Pubblicato il 21/06/12e aggiornato il

Come sostituire Posta un commento con una immagine in Blogger.

Come sostituire in Blogger l'espressione Posta un Commento con una immagine personalizzata.
Tutti i bog di Blogger che hanno optato per il modulo dei commenti incorporato sotto il post visualizzano al di sopra dello stesso un anonimo Posta un commento di colore scuro. Ho già pubblicato un post in cui prendevo in esame tutte le possibili opzione per la personalizzazione dell'area dei commenti.
Alla fine dell'articolo linkato è illustrato come sostituire Posta un commento con un'altra espressione. Vediamo adesso come si possa invece inserire una immagine sopra al modulo al posto della scritta di default Posta un commento.

Si va su Modello > Backup/Ripristino e si salva il modello completo come al solito. Si torna su Modello > Modifica HTML > Procedi e si espandono i modelli widget.

Pigiando su F3 o su Ctrl+F si cerca la riga seguente

<h4 id='comment-post-message'><data:postCommentMsg/></h4>

che credo sia identica in tutti i template ufficiali di Blogger della generazione del Designer Modelli. Non ci resta che sostituire al tag colorato di rosso un codice di una immagine o di una scritta personalizzata che per esempio potrebbe avere questo HTML

<img alt=' Commenta qui sotto ' title='lasciaci un commento' border='0' src='https://lh5.googleusercontent.com/-D-0UrQPbDF0/T-Lp-g10chI/AAAAAAAAYxA/atKnq9NogV0/s400/posta-commento.png'/>

dove la scritta in blu è il testo alternativo, quella in viola è il tooltip che si visualizza al passaggio del mouse mentre l'URL in rosso è quello della immagine che abbiamo sostituito a Posta un commento.

personalizzare-scritta-posta-un-commento

Dopo aver salvato il modello, il modulo dei commenti avrà l'aspetto dello screenshot precedente. L'immagine l'ho creata in un minuto e certamente la maggior parte di voi sapranno fare di meglio.




21 commenti :

  1. ma va copiato sotto o sostituito???

    RispondiElimina
  2. @IvanDeFelice
    Copio e incollo dal testo dell'articolo
    "Non ci resta che sostituire al tag colorato di rosso un codice di una immagine o di una scritta personalizzata"

    RispondiElimina
  3. Ciao Ernesto, un post davvero interessante e vorrei provare ad inserire anche io l'immagine.
    Che dimensioni deve avere l'immagine scelta? Se ad esempio deve avere la stessa larghezza dell'area del post, come faccio a sapere quanto deve essere larga l'immagine per evitare che mi vada a finire nelle sidebar. Lo chiedo perché avendo un template a tre colonne vorrei inserire un'immagine che abbia le dimensioni giuste.
    Grazie

    Lucia Alocchi

    RispondiElimina
    Risposte
    1. @LuciaAlocchi
      Puoi fare un po' ad occhio. L'immagine che ho usato io è di 400x50 pixel quindi regolati un po'. Poi puoi sempre ridimensionarla con Pixlr in un secondo
      http://www.ideepercomputeredinternet.com/2011/01/pixlr-per-modificare-foto-e-immagini.html

      Elimina
    2. Grazie mille Ernesto, molto gentile :)
      Buona serata!

      Lucia Alocchi

      Elimina
  4. ciao ernesto, intanto ti ringrazio per tutto l'aiuto e le scoperte che ci fai fare. ho provato a modificare quella parte di codica, ma non è successo niente. è successo solo che gli adsense tra i post si sono resi non disponibili...non so cosa sbaglio. esiste un codice simile da poter mettere tra i css? magari in quel modo riuscirei. grazie

    RispondiElimina
    Risposte
    1. @Lunaticamakeupblog
      Puoi provare ad aggiungere questo CSS su Modello > Personalizza > Avanzato > Aggiugni CSS

      #comment-post-message {
      background-image:url(Indirizzo della immagine) no-repeat;
      }

      dove al posto di indirizzo della immagine metti l'URL di quella che vuoi visualizzare.

      Elimina
  5. Ciao Ernesto, scusa se ti faccio un'altra domanda. Ho fatto prima un test su un blog di prova ed è riuscito tranquillamente. Ma l'immagine è visibile solo se nel post non ci sono commenti. Ho inserito un commento e dopo non appare più. C'è un modo per renderla visibile anche se sono presenti i commenti? Grazie ancora.

    Lucia Alocchi

    RispondiElimina
    Risposte
    1. @LuciaAlocchi
      Probabilmente hai un modello recente come questo in cui il modulo si visualizza in modo dinamico e allora questa personalizzazione non funziona.

      Elimina
    2. Grazie lo stesso. Comunque lo inserirò ugualmente perché come personalizzazione mi piace molto. Buona giornata.

      Lucia Alocchi

      Elimina
  6. Ciao Ernesto, questa guida funziona anche per i modelli dinamici?

    RispondiElimina
    Risposte
    1. @ThomasCercato
      Nei Modelli a Visualizzazione Dinamica non è attivo neppure il link per modificare l'HTML :(

      Elimina
  7. ciao,
    avrei bisogno di un aiuto per una cosa.
    ho visto che tu sei molto bravo con i codici per blogger.
    sto facendo un blog e ho tolto tutto lo sfondo dei post dal blog
    mia intenzione era quella di mettere un codice che contenesse una pergamena di 10 cm di lunghezza o 20 o 30 ....ecc ecc hostate in un sito esterno o in picasa di cui fa uso blogger.
    non riesco a comprendere come fare il codice per inserire questa immagine come sfondo (visto ceh ho tolto quello a tinta unita di blogger) e mettere il testo ad una certa distanza dai bordi laterali e superiore e inferiore. puoi aiutarmi?

    grazie

    RispondiElimina
    Risposte
    1. @Marikalien
      Vuoi mettere lo sfondo solo nei post? In questo caso puoi leggerti questo articolo
      http://www.ideepercomputeredinternet.com/2012/07/sfondo-post-blogger.html
      L'immagine la devi caricare su Picasa
      http://www.ideepercomputeredinternet.com/2010/07/picasa-e-lo-strumento-piu-completo-per.html
      e acquisirne il link da sostituire poi nel codice come indicato nell'articolo di cui ti ho postato l'URL.

      Elimina
  8. Aggiungere immagini ai commenti???

    RispondiElimina
    Risposte
    1. Non è possibile con Blogger. Si può usare Disqus
      http://www.ideepercomputeredinternet.com/2011/05/come-integrare-disqus-per-gestire-i.html
      @#

      Elimina
  9. 1. Come personalisa-re Posta un commento in ogni pagina in modo diverso o solo in una diverso di altri.

    2. Pensavo di usare commenti per inserire annunci cosi ogni persona in vece di lasciare un commento può inserire un annuncio.

    Può essere posibile si può realisa-re una cosa di genere.

    RispondiElimina
    Risposte
    1. Puoi modificare Posta un commento solo in una singola pagina usando i tag condizionali
      http://www.ideepercomputeredinternet.com/2013/03/tag-condizionali-blogger.html
      in questo modo
      <b:if cond='data:blog.url == "URL_PAGINA"'>
      <img alt=' Commenta qui sotto ' title='lasciaci un commento' border='0' src='https://lh5.googleusercontent.com/-D-0UrQPbDF0/T-Lp-g10chI/AAAAAAAAYxA/atKnq9NogV0/s400/posta-commento.png'/>
      <b:else/>
      <data:postCommentMsg/>
      </b:if>

      Puoi fare anche in modo che ciascun commento sia anche un annuncio

      Elimina
    2. Dopo che scrivo primo commento la immagine sparisse cosa devo fare per stare sempre la ? Grazie mille.

      Elimina
    3. Ti avevo dato un input per provare ma non ti avevo assicurato che funzionasse
      @#

      Elimina
    4. Si certo hai ragione pero spero che troverò un modo per farlo comunque mi se stato di grande aiuto tantissimi volte e ti ringrazio .

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.