immagin top

18.2.14

Blog design: come inserire la firma visibile in tutti i post

18.2.14

In un tutorial fatto quasi un anno fa (wow come passa il tempo) vi spiegavo come inserire una firma semplice nei vostri post. Certo questo aveva un piccolo difetto, ossia quello di far visualizzare la firma nei post successivi all'inserimento del codice.

Oggi invece vi mostro come inserire una firma visibile in tutti i post, anche in quelli vecchi.

Creiamo la nostra firma... come? dove? Beh esistono alcuni tool online facili ed intuitivi.
Uno che posso consigliarvi è Pixlr Editor, che somiglia un po' a Photoshop, ma più semplice.

Dopo aver creato la vostra firma come immagine, dobbiamo caricarla sul blog.
Forse mi ripeterò, ma vi consiglio di creare un post e mantenerlo come bozza in modo da avere le immagini a disposizione, come se fosse una cartella :)

Una volta caricata l'immagine avrà come codice su per giù questo:
<img src='URL_VOSTRA_FIRMA' border='0' alt='' />
Ora andate in Modifica HTML e andate al widget Blog1 come nell'immagine sotto.

tutorial inserire firma nei post - Simona S.

Scendete giù pian,pianino, per cercare nel codice la sezione del post. Una volta trovato cliccate sulla freccina per espanderlo.




Scendendo sempre piano, dovreste trovare il codice per il jump-link, ovvero il 'continua a leggere'. Questo di solito delimita lo spazio dove è inserito il corpo del post che noi scriviamo.
Subito sotto inserisci il codice dell'immagine della firma come da esempio :)

tutorial inserire firma nei post - Simona S.

PER APPROFONDIRE!


  • Se utilizzate il vecchio metodo, vi consiglio di cancellarlo dalle impostazioni prima di utlizzare il nuovo, proprio per evitare due firme.
  • Se volete centrare la firma inserite nel tag img lo stile, ovvero:<img src='URL_VOSTRA_FIRMA' border='0' alt='' style='margin:0 auto;'/>
  • Se invece volete spostarlo a destra, il codice è questo: <img src='URL_VOSTRA_FIRMA' border='0' alt='' style='float:right;'/> , per spostarlo a sinistra sostituite right con left.

30 commenti:

  1. Grazie! Le tue guide sono la mia salvezza... Proverò a modificare! Ma l'url dell'immagine è compreso solo tra due apici? non le virgolette?

    RispondiElimina
    Risposte
    1. Ciao Laura! Sì non utilizzo le virgolette nel codice HTML del blog perchè a me le dà come errore, quindi per ovviare ad un eventuale problema, li escludo a monte :D

      Elimina
    2. Ok perfetto! Era più una curiosità perchè ho sempre messo gli indirizzi tra virgolette... Grazie mille!!! :-)

      Elimina
  2. Ciao! mi piace un sacco il tuo blog ^-^ mi diverto a giocare con i codici sul mio ma sono autodidatta in fatto di css e html e ho sempre qualcosa da imparare quindi grazie per le tue preziose condivisioni :) un bacio,
    Leb

    RispondiElimina
    Risposte
    1. Ciao Leb, beh allora siamo in due ad essere autodidatte :D

      Elimina
  3. Wow, grazie Simona! Io utilizzo il metodo standard di Blogger per la firma perché ho iniziato a inserirla dall'inizio, ma se mai vorrò cambiarla, o avrò una richiesta d'inserirla in un altro blog, farò tesoro di questo tuo tutorial :)
    PS. Anch'io carico le immagini per la mia grafica del blog in un post di bozza :D

    RispondiElimina
    Risposte
    1. Se io avessi pensato prima a questa soluzione ora non mi ritroverei diverse firme nei post, perchè poi un altro handicap del metodo 'standard' è proprio questo, quello di lasciare 'tracce' -.-

      Elimina
  4. Ciao Simona seguo sempre con molto piacere ed interesse i tuoi post grazie sempre di tutto soprattutto per la semplicità con cui spieghi questi argomenti!!!!

    RispondiElimina
    Risposte
    1. Grazie Marella, sei sempre gentilissima con me *_*

      Elimina
  5. ciao simona, mi piace molto questo post e per me che sono ai primi passi mi risulta anche facilmente comprensibile....ti farò sapere buona serata

    RispondiElimina
  6. per stasera ci ho provato ma non ci sono riuscita! a presto <3

    RispondiElimina
    Risposte
    1. mi spiace... se riesci a dirmi cos'è che non è andato bene magari insieme ce la facciamo ;)

      Elimina
    2. ciao Simo, ho seguito passo passo anche per la creazione della firma...ma non sono riuscita a trovare la URL (nemmeno cliccando con il tasto destro etc)...

      Elimina
  7. adoro il tuo blog <3
    purtroppo io non ho quel codice dopo la freccetta ho un altro codice, se lo metto dopo script mi viene per tutto il blog, se lo metto prima non si vede :(

    RispondiElimina
  8. Ciao!! Questo blog è semplicemente meraviglioso! Vorrei chiederti un piccolo aiuto: ho installato un nuovo template sul mio blog, ma sono scomparsi i tastini per condividere alla fine di ogni post... Penso che sia una cosa da gestire nel modello html, ma non so proprio come fare! Hai per caso qualche suggerimento? Il mio blog è basilntomato.blogspot.it

    RispondiElimina
    Risposte
    1. Ciao Federica! Grazie mille per il complimento :) ♥
      Hai provato a vedere in Layout, nel gadget post sul blog se sono attivi i pulsanti per la condivisione?

      Elimina
    2. Ciao Simona, grazie per la tua risposta! Si ho già provato e sono attivi, evidentemente è il nuovo template che li blocca! Uffa non so come fare... Anche nella colonna di destra, nella parte dei post più popolari vorrei mettere il titolo dei post i grassetto ma non ci riesco... Vorrei essere più esperta ;)

      Elimina
    3. Alla fine ce l'ho fatta anche grazie a questo tutorial ;)

      Elimina
    4. Mi fa piacere :D
      Quando si scelgono questi tipi di templates, che io trovo belli per carità, si hanno però molte difficoltà a personlizzarli, perchè molti designer cambiano anche i nomi dei 'div' classici di Blogger...insomma un macello -.-

      Elimina
    5. Si hai ragione, però purtroppo io non sono ancora cosi brava da modificarlo manualmente e mi tocca affidarmi a questi template già pronti ;)

      Elimina
  9. Splendido! Sei sempre bravissima e chiarissima.
    Grazie anche per questa chicca.
    Un bacione!

    RispondiElimina
  10. ciao, bellissimo e semplice questo tutorial, ho quasi fatto tutto, ma quando faccio l'anteprima non si vede la firma :(

    RispondiElimina
    Risposte
    1. Ciao Sara, perdonami se ti rispondo solo ora, ma l'influenza non mi ha dato scampo -.-
      Dunque hai provato di nuovo ad inserire il codice della firma?
      Se lo rifai, dimmelo così poi io posso vedere dove sta l'errore ;)

      Elimina
  11. Ciao Simona, un post davvero utile. Ho provato ad inserire la firma con questo metodo e FUNZIONA. L' unico problema è che la firma mi viene visualizzata anche alla fine dei post nella home mentre io vorrei che venisse visualizzata solo alla fine dei post e che fosse invisibile nelle home (mi sono spiegata da cani!). Spero di essere riuscita a farmi capire. Suggerimenti in merito? Ancora grazie mille!

    RispondiElimina
    Risposte
    1. Certo c'è un metodo!
      Il codice che hai inserito va bene lì dove sta, devi solo aggiungere all'inizio di esso questa riga:

      <b:if cond='data:blog.pageType == &quot;item&quot;'>

      e alla fine questa:

      </b:if>

      Se dovessi avere problemi contattami pure ;)

      Elimina
  12. Ciao Simona! Grazie a te sono riuscita ad inserire la firma nei miei post senza impazzire...
    Ora volevo inserire il widget di linkwithin, ma purtroppo mi appare tra la fine del post e la firma, c'è un modo per spostarlo? Grazie infinite di tutto! ;)

    RispondiElimina
    Risposte
    1. Vorresti che la firma comparisse prima del gadget di linkwithin?
      Perchè se fosse puoi inserirlo manualmente nell'HTML prima, appunto, della firma.

      Elimina
    2. Provo subito, poi ti faccio sapere! Grazie!!! ;)

      Elimina