Pipes di Yahoo non funziona più...

... e quando apri il blog e vedi vuoto ci resti male davvero!

Eh sì, lo aveva detto +Ernesto Tirinnanzi  che il servizio Pipes di Yahoo sarebbe terminato, servizio molto amato dagli sviluppatori (non io, eh...) ma che non produce profitti per la Società.
Ecco il post in cui Ernesto ne parla e cita il suo widget "Menu verticale con l'elenco di tutti i post".

Lo avevo fatto e funzionava, e compariva al posto di questo spazio vuoto che vedi in foto (lo toglierò, ovviamente).
Poco male per me perchè la stessa funzione la fa Mappa del blog (sempre un lavoro di Ernesto, qui il post).
La Mappa di questo mio blog è tra le pagine, qui.

Mi dispiace molto più invece la dismissione di Google Drive, esattamente la sua funzione di hosting gratuito con hotlink, (qui il post di Ernesto).
Sarà attivo fino al 31 agosto 2016 e io sono quasi disperata, non tanto per il funzionamento di questo blog quanto per un altro Boanerges Mc. 3,17 dove ho caricato file audio dei nostri concerti.
Cosa farò?
Dovrò comprare un dominio? Bah...

E' un blog "sfortunato", ci ho lavorato tantissimo e sono di nuovo a terra...
Ho cominciato hostando su Adrive per poi scoprire che non forniva l'hotlink. Poi sono passata a Boxtr, è durato poco e ha chiuso.
Ho caricato di nuovo tutto su Fileden e anche questo ha chiuso.
Lo spazio su Amazon non fornisce l'hotlink.
Onedrive di Microsoft non hosta file audio.
E finalmente avevo trovato Google Drive e tutto funzionava. C'è un post in questo blog dove faccio le prove.

Speriamo che nel frattempo i Maghi del blogging escogitino qualcosa o nascano altri servizi.
Se qualcuno è a conoscenza di spazio web free e con hotlink me lo faccia sapere, per gentilezza.
Ma credo che sarà dura...

spostare un blog da wordpress a blogger

Sì, ho avuto problemini vari con un blog in wordpress (su altervista) e ho deciso di portarlo in blogger.

Sul web ho trovato parecchi siti in cui viene spiegato come ciò sia possibile:
-si esporta un file .xml da wordpress
-si passa attraverso questo sito http://wordpress2blogger.appspot.com/ (è l'unico che fa questo servizio!) che trasforma il file .xml in un altro compatibile per blogger
-si importa in blogger

Dopo vari tentativi (ore!) ho intuito che qualcosa non andava (mi si bloccava tutto).

[sai quando vedi la clessidra ferma e capisci che il pc sta pensando e pensando... quanto deve pensare, uffa!]

Infatti, su un forum, ho trovato la spiegazione: il file di esportazione non può superare 1 MB.
Ok!

Per rispettare ciò bisogna "lavorare" un po' con l'esportazione di wordpress cioè scegliere delle date precise di esportazione e vedere i kb.
Sono andata per tentativi: alcuni mesi erano più "pesanti" di altri e quindi dovevo reimpostare l'esportazione affinchè non superasse il megabyte.

Il sito di trasformazione "mangia" velocemente il file se questo è sotto 1 MB, e così pure blogger lo riceve con facilità.

E' possibile esportare anche le pagine.

Conviene eliminare tutti i commenti di spam e i commenti non indispensabili, ciò alleggerisce il file di esportazione.
L'esportazione mantiene i link a foto e altro (meno male!)

Con una decina di passaggi ho esportato e importato tutto.

PS- se proprio non c'è verso di esportare (ad esempio un mese molto pesante, wordpress non permette di frazionare il mese), beh allora non resta che copiare i file uno ad uno a mano.

Anche i vari widget nella barra laterale vanno reimpostati a mano.
I servizi di tracciamento che si basano su un url preciso non sono più validi (ad esempio Clustr) poichè l'url del mio blog in blogger ovviamente non può essere lo stesso di wordpress, anche se sono riuscita a mantenere il "nome" del blog.

newbie ;)

Post correlati con miniature da Linkwithin

Con questo servizio, sotto ogni tuo post compariranno da 3 a 5 miniature di altri post correlati ad esso. Se non ci sono foto nei post correlati, verrà mostrato un link testuale.
Embè, carino!

Allora:

45-migliorare l'orientamento della sidebar

Già in questo post ho orientato gran parte della sidebar a destra ma, come dicevo lì, non tutto è ancora a posto: non mi garbano Informazioni personali, Archivio blog, il counter di Bravenet.
Ad esempio la foto delle informazioni personali è spostata completamente a destra e l'archivio...

Procedo così:
Devi premettere che il mio modello, il modello di questo blog, è Herbert.
Faccio il login a Blogger, clicco il link Design in alto a destra, mi sposto nella tab Modifica Html, espando i modelli widget, cerco nel codicei seguenti pezzi:

.BlogArchive #ArchiveList {

 float: $endSide;

}

Sostituisco end con start.

Molto bene. L'archivio blog è ora Ok.

---

Ora cerco:

/* Profile

----------------------------------------------- */

.profile-textblock {

  clear: both;

  margin-$startSide: 0;

}

.profile-img {

 margin-top: 0;

 margin-$endSide: 0;

 margin-bottom: 5px;

 margin-$startSide: 5px;

 float: $endSide;

}

Sostituisco both con none.
Sostituisco margin-$endSide: 0; con margin-$endSide: 5px;
Sostituisco margin-$startSide: 5px; con margin-$startSide: 0px;
Sostituisco end con start.

Ora la foto e il testo, attorno ad essa, sono perfetti!

---

Poi cerco:


  div#sidebar {

    width: 30%;

    float: $endSide;

    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */

    overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */

  }

Sostituisco end con start.
Questa modifica allinea a sinistra il testo di Lettori Fissi che prima era centrato.

---

E infine cerco:

.#sidebar .widget {

  clear: both;

}

Dopo clear: both aggiungo float: left; che non c'era per nulla. 
Questo raddrizza il counter di Bravenet!

---

Che soddisfazione!
Mi commento da sola: "Ma non potevi sceglierti un altro modello 'che facevi prima?"

newbie ;)

38-modificare il foglio di stile in Wordpress

Questo post serve a me, per ricordarmi come ho fatto a sistemare le larghezze del mio blog Boanerges in Wordpress.
Dunque...
Questo blog aveva un template (Aeros) troppo "stretto": in sidebar i widget mi venivano tagliati (soprattuto il MixPod, un lettore di playlist); e in Content desideravo avere più spazio intorno alle foto.
Cosa ho fatto? Ho ragionato così: se allargherò di 50 pixel la sidebar dovrò allargare altrettanto il Contenitore Principale.
Allora ho aperto il foglio di stile (style.css) e ho preso nota della larghezza massima che trovavo (supponendo che fosse quella del Main Container, il Contenitore Principale).

Infatti ho trovato:

/* ++++++++++++++++++ The Main Container ++++++++++++++++++ */
#rap {
        width:775px; (l'ho portato dapprima a 825 pixel [e poi a 855]
        margin:0 auto;
-----    -----

/* ++++++++++++++++++ The Header Section ++++++++++++++++++ */
#header {
        width:775px; (l'ho portato dapprima a 825 pixel, [e poi a 855]
        font-family: Verdan
----    ------ 
#headmenu {
font-family: verdana, arial, sans-serif;
font-size:16px;
width:775px; (l'ho portato dapprima a 825 pixel [e poi a 855]
letter-spacing:-1px;
font-weight:bold;

 Poi, esauriti tutti i 775, ho prestato attenzione alla sezione della sidebar:

/* ++++++++++++++++++ The Sidebar Section ++++++++++++++++++ */

#sidebar {
        width:180px; (l'ho portato a 230 pixel)
        float:right;

In questo modo la sidebar si è allargata sufficientemente.

Poi ho voluto allargare il Contenuto (precisamente il Contenitore del Contenuto) di 30 pixel.
Ho cercato la larghezza maggiore dopo il 775 e ho trovato il 590:

/* +++++++++++ The Content Container - where your posts are ++++++++++ */
#content {
        width: 590px; (l'ho portato a 620 pixel)
        float:left;
        overflow:hidden;

Ma ho dovuto allargare di 30 pixel anche il Contenitore Principale. E le misure finali sono evidenziate in rosso.


Ho salvato e pubblicato.
C'era qualcosa che non andava, i segnalibri dei commenti si posizionavano in modo strano... infatti mi era sfuggito .storywrap che non so cosa sia ma ho supposto che dipendesse dalla sezione dei contenuti: aveva una width di 505px e ho pensato di aumentarlo di 30 pixel.

.storywrap {
        padding:10px 20px;
        font-size:14px;
        text-align:justify;
        float:left;
        width:505px; (l'ho portato a 535 pixel)
        margin-bott...

Questa volta tutto è andato a posto.
Forse molti esperti di codice e linguaggi rideranno di me... ma anch'io rido per me perchè sono felice di avercela fatta!
newbie ;)

37-orientare la sidebar

Questo modello prevede la sidebar di dx orientata a dx. A me non piace, mi dà un'impressione di disordine. Allora cerco di orientarla a sx. Faccio così:

Vado al mio blog, clicco il link Design in alto a dx. Clicco Modifica Html. Seleziono la casellina Espandi modelli widget. Cerco il seguente codice:

div#sidebar-wrapper {
    margin: 0px;
    padding: 0px;
    text-align: $endSide;
  }

Presto attenzione a $endSide e sostituisco la parolina end con start. Il codice adesso è così:

div#sidebar-wrapper {

    margin: 0px;

    padding: 0px;

    text-align: $startSide;

  }

Clicco il pulsante arancio SALVA MODELLO e poi il link celeste Visualizza blog.
Bene! Già questa sola modifica ha portato la sidebar a posizionarsi sulla sx!

Non ho risolto però tutto: devo ri-allineare la chatbox (fatto!) e il contatore di Bravenet (non si lascia allineare...).
newbie ;)

34-Top Link di MBL

Torna alla pagina di MBL (vedi post precedente) oppure vai direttamente a
http://www.mybloglog.com/buzz/community/doingblog/ ... (tu metti il nome della tua community)
Preleveremo il codice anche del secondo widget, il TOP LINK, prima però dobbiamo "customizzarlo" (personalizzarlo).

Abbiamo 5 voci precedute da un quadratino colorato e, dalla loro somiglianza con i colori predefiniti del widget, possiamo capire la traduzione e il da farsi:

1. color heading bg: colore di sfondo della testata
2. color heading: colore della testata
3. color link bg: colore di sfondo dei link
4. color link: colore dei link
5. color bottom bg: colore di sfondo del fondo, della base

Scegli dei colori che si intonino col tuo blog e anche col widget RECENT READERS inserito al post 33.
Poi preleva il codice e incollalo (nel tuo blog) sotto Recent Readers (in un elemento Html/Java).

Potrebbe essere che il Top link non sia largo come Recent Visitors.
Allora vai all'ultimo codice GIA' inserito nel tuo blog (quello di RECENT VISITORS): cerca width=... (180 nel mio caso)
Beh, questa width (larghezza) deve essere uguale in entrambi i widget. Io infatti modifico 180 in 220 facendo bene attenzione di non toccare null'altro.
Poi SALVA.
Il Top Link ora risulta della stessa larghezza del Recent Visitors (almeno il mio!).
newbie ;)

33-Recent Visitors di MBL

Torna alla pagina di MBL: appena sotto lo script c'è un link di questo tipo:
Go to doinblog community (al posto di DOINGBLOG ci sarà il nome che hai scelto tu)
Oppure segui un url di questo tipo:
http://www.mybloglog.com/buzz/community/doingblog/

Clicca e ... che bello!
Ecco uno screenshot (o thumbnail) del tuo blog (appena sotto l'intestazione verde di MBL a sx);
sempre a sx c'è la sezione TAGS FOR ...il nome del tuo blog... dove puoi "taggare" il tuo blog (cioè inserire le parole chiave del tuo lavoro);
ancora sotto, in LATEST CONTENT, puoi vedere i post che hai finora scritto.

Sulla destra nella sezione AUTHORS c'è la tua foto (se l'hai messa prima);
subito sotto AUTHORS c'è la sezione MEMBERS dove compariranno coloro che si aggregheranno alla tua community;
e sotto MEMBERS, c'è un widget (RECENT VISITORS) per il tuo blog! Clicca il primo pulsante verde GET THIS WIDGET.
Nella pagina che si apre hai delle scelte da fare per "customizzare" il tuo widget, anche in base ai colori del tuo blog e allo spazio che hai a disposizione:

• Style: io scelgo Multiple Columns
• Color: io scelgo Red
• Images: io scelgo small
• Flyout Orientation: io scelgo Right (ricordi? ho la sidebar allineata a destra...)
• Width (Larghezza in pixel): lascio per ora 220px
• Rows: (righe): lascio per ora 4

In Additional Option lascio quella di default.
Da YOUR CODE prelevo il codice che andrà incollato su un html/java gadget in sidebar del blog (se non ti ricordi come si fa, torna a questo post...). Io però preferisco incollarlo in VISITE INASPETTATE, sotto CLUSTR.
Quando avrai inserito il codice di MBL e salvato, nella tua sidebar apparirà il RECENT VISITORS di MyBlogLog: da esso potrai vedere le foto di coloro (iscritti a MBL) che ti visiteranno. Sii cortese: ricambia la visita!
Problemino: RECENT VISITORS non si lascia allineare: ho provato la Flyorientation a left, right, none... ma non cambia nulla.
Può dipendere dall'allineamento della sidebar che comanda il codice dentro a un widget, oppure può dipendere dal browser (firefox). Cercherò di capire...
newbie ;)

17-allineamento

Poichè tutta la sidebar è allineata a destra, ora proviamo ad allineare a destra anche la chat box, come annunciato nel post precedente.

Fai il login al tuo blog, vai sul link Personalizza in alto a destra. Sei sulla tab Layout e sottotab Elementi Pagina: nella sidebar a destra clicca su Modifica nella sezione CHATTA CON ME che porta il codice della chat box di cbox.
Il codice che si presenta è questo:

<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0pt;">
<div><iframe src="http://www5.cbox.ws/box/?boxid=627719&amp;boxtag=53s414&amp;sec=main" marginheight="2" marginwidth="2" allowtransparency="yes" name="cboxmain" style="border: 1px solid rgb(219, 226, 237);" id="cboxmain" width="200" frameborder="0" height="305" scrolling="auto"></iframe></div>
<div><iframe src="http://www5.cbox.ws/box/?boxid=627719&amp;boxtag=53s414&amp;sec=form" marginheight="2" marginwidth="2" allowtransparency="yes" name="cboxform" style="border-style: none solid solid; border-color: -moz-use-text-color rgb(219, 226, 237) rgb(219, 226, 237); border-width: 0px 1px 1px;" id="cboxform" width="200" frameborder="0" height="75" scrolling="no"></iframe></div>
</div>
<!-- END CBOX -->

Prendi nota di text-align: center
Ebbene, al posto di center scrivi right, avendo cura di non toccare null'altro.
Clicca il bottone arancio SALVA e poi il link celeste Visualizza blog dentro al rettangolo arancio in alto.
Ora anche la chat box è allineata a destra!
Quindi:
text-align: center posiziona il testo al centro
text-align: right posiziona il testo a destra
Puoi fare la prova di allineare a sinistra: dovrai scrivere left al posto di right o center.
newbie ;)

16-chat box

E' bello e utile fornire la possibilità ai nostri visitatori di interagire con noi. Il mezzo più semplice per raggiungere questo scopo è fornirsi di una chat box (significa scatola, riquadro in cui chiacchierare). Ci sono molti siti che offrono questo servizio. Ti consiglio cbox.

Vai su http://cbox.ws/
Registrati scegliendo un nome per la chat box, inserendo la tua email e una password, accettando i Terms and Conditions. Ti verrà inviata una mail all'indirizzo che hai appena inserito, essa ti proporrà un link simile:
http://www.cbox.ws/admin.php?snippet

Fatto il login accederai al codice. Presta attenzione che sia evidenziata la tua piattaforma: I'm installing on Blogger/Blogspot. Copia il codice, o sugli appunti o su un file di servizio.
Vai al tuo blog. Clicca in alto a dx su Personalizza. Ti trovi in Elementi pagina. Sulla sidebar di dx clicca Aggiungi un gadget, scegli il quarto gadget Html/JavaScript. Nella finestra di configurazione scegli un bel titolo (io ho scelto "chatta con me") e sotto, su Sezioni del sito, incolla il codice di cbox.ws. Clicca il bottone arancio SALVA. Ti rimanda a Elementi pagina, e qui sulla sidebar potrai vedere il tuo nuovo widget col titolo appena inserito.
Clicca sul link celeste Visualizza blog del rettangolo arancio in alto. Finalmente vedrai il tuo blog fornito di una chat veloce e carina! Sul sito di cbox puoi "customizzare" cioè "personalizzare" la tua chat box come più ti aggrada, in base anche ai colori del tuo blog. Nel menù Look & Feel ne puoi vedere parecchie.

A proposito:
Ti sei accorto che la chat box si posiziona centralmente nella sidebar del blog?
Mentre tutta la sidebar è allineata a destra, fa brutto, no? ...
Vedremo di sistemarla.
newbie ;)

13-condividere con Add This

Ci sono dei servizi (si chiamano social bookmark) che permettono di condividere i contenuti internet. Cosa significa? Quando tu, navigando, trovi qualcosa che ti piace o ti è utile o vuoi condividerlo con altri, puoi salvare il contenuto in un sito apposito.
Inoltre, in tali siti puoi inserire i tuoi stessi contenuti, per farti conoscere e commentare.
A me piace molto Add This poichè permette con un bottone solo di condividere in più siti di social bookmark.

Vai su http://www.addthis.com

Nella prima colonna (1. Select your service) seleziona Blogger (il tuo blog è in Blogger, o meglio: questa guida è per blog di Blogger; però puoi vedere che tale servizio è disponibile anche per altre piattaforme...).
Nella seconda colonna (2. Select a button style) ti consiglio di selezionare il primo bottone (ma puoi scegliere quello che ti piace di più...)
Poi clicca il pulsante arancio Get Your Button.
La finestra che si apre ti permettere di scegliere se inserire il bottone di condivisione nella tua sidebar (Install Button in Blogger Sidebar) oppure se inserirlo sotto ogni post (Blog Post Button Instructions).
Ti consiglio questa seconda opzione anche se è un po' più complicata. Per far ciò devi copiare e incollare la porzione di codice nel tuo template, giusto sotto la tag:

<div class='post-footer'>

Per fare ciò devi modificare il template, presta attenzione!
Loggati al tuo blog, clicca sul link Personalizza in alto a dx, ti trovi nella tab Layout e devi cliccare la sottotab Modifica html, poi seleziona la casellina espandi modelli widget e cerca

<div class='post-footer'>

E' a circa metà abbondante del cursore grigio (in questo momento, nel mio template).
Appena sotto, incolla il codice. Clicca il bottone celeste ANTEPRIMA. Se tutto è OK, torna alla pagina origine e clicca il bottone arancio SALVA MODELLO, poi clicca il link celeste Visualizza blog sul rettangolo arancio.
Ora, sotto ogni tuo post comparirà il bottone di Addthis. Se col mouse ci vai sopra, vedrai una finestrella con i maggiori social bookmarks (Delicious, Facebook, Twitter, Segnalo, Google, Digg, OKNotizie, e altri possibili...) ai quali potrai inviare i tuoi post.
Inizia intanto a condividere i tuoi contenuti. In un prossimo post faremo insieme uno step-by-step.
newbie ;)

9-salvare e cambiare il modello

(leggi il post precedente)
Se desideri cambiare il modello del blog, o quando interverrai sul codice HTML, devi prima salvare il modello installato per il tuo blog. Così, se qualcosa dovesse andar storto, potrai comunque ripristinare il tuo lavoro.
Fai così.
Accedi al blog. Clicca sul link PERSONALIZZA in alto a destra nella navbar. Ti trovi nella sottotab ELEMENTI PAGINA della tab LAYOUT. Clicca il terzo link MODIFICA HTML.
Cerca la la casella ESPANDI WIDGET e spuntala;
Torna su: appena sotto la scritta ESEGUI BACKUP/RIPRISTINO MODELLO, clicca il link celeste SCARICA MODELLO COMPLETO.
Una finestra ti chiederà di SALVARE IL FILE "template- numeri- .xml";
che probabilmente verrà salvato nella cartella DOWNLOAD sotto la cartella DOCUMENTI del tuo pc (io preferisco salvare in desktop).
Trovalo e cambiagli il nome in modo che tu possa riconoscerlo facilmente, ad esempio io l'ho rinominato "mifaccioilblog-02feb10.xml"; inserisco anche la data per sapere in futuro se un backup è più o meno recente di un altro.

Backup significa salvataggio.

Questo è un passaggio sempre utile che diventa fondamentale se possiedi più blog perchè il file potrebbe sovrascrivere un altro file esistente.

Ricorda: il file contenente il modello del tuo blog ha estensione .xml

Qualora tu, a causa di errori, esperimenti (come faccio io), malfunzionamenti del programma, interruzione dell'alimentazione, etc. avessi necessità di ripristinare il tuo modello (capita più spesso di quanto si creda!) potrai farlo sempre grazie alla pagina LAYOUT/MODIFICA HTML:
clicca il pulsante SFOGLIA della casella di input "carica un modello da un file sul tuo disco rigido", cerca nel tuo pc il filedel tuo modello salvato precedentemente e poi clicca sul pulsante CARICA.
In questo stesso modo puoi caricare anche altri modelli (template) che troverai sul web: ci sono dei siti che li offrono gratuitamente.

Ora cambiamo il modello.
Clicca sulla sottosezione SCEGLI NUOVO MODELLO (link celeste).
Prova a cambiare modello: clicca sul pulsante radio (rotondo) di qualunque modello tu voglia e poi clicca sul link celeste appena sotto "Anteprima modello"; potrai vedere in un'altra finestra come appare il tuo blog con il nuovo modello. Torna indietro chiudendo la finestra cliccando la X in alto a destra.
NON SALVARE!
Fai esperimenti, scopri i diversi template. Solo quando avrai trovato quello di tuo gradimento cliccherai sul bottone arancio SALVA MODELLO e poi sul link celeste "Visualizza blog". Io ho scelto HERBERT, abbandonando così il vecchio modello SAND DOLLAR.
Herbert non è molto diverso da Sand Dollar se non per la barra laterale che qui è a destra, ed è anche giustificata a destra. Vai a vedere a questo post com'era il blog con il modello Sand Dollar
E' meglio cambiare modello prima di installare i gadget sulla sidebar. Al contrario, alcuni gadget installati possono venir perduti al cambio del modello.
newbie ;)