Pubblicato da Denvoizer | 19:45 | | 3 commenti »

Come si può vedere dallo screenshot qui sotto,l'immagine visualizzata accanto al titolo dipende a seconda di chi è l'autore dell'articolo.

Se volete scoprire come si può mettere un'immagine accanto all'articolo visitate questa pagina.

Esiste un metodo elaborato da EL Escaparate che sfrutta il JavaScript per questo scopo, tuttavia ho scoperto che esiste un'altro metodo moooolto più semplice che sfrutta i tag condizionali di Blogger.



Come si possono inserire immagini differenti per autori differenti su blogger?
Iniziamo, quindi:

1) layout->modifica HTML
2) selezionare "Espandi i modelli widget"
3) Cercate questa porzione di codice:

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

dovrebbe essere qualcosa di questo tipo:


4) subito dopo la linea rossa, inserite il seguente codice:

<b:if cond='data:post.author == "AUTORE1"'>
<span class="author"><img src="IMAGE1_URL"/></span>
</b:if>

<b:if cond='data:post.author == "AUTORE2"'>
<span class="author"><img src="IMAGE2_URL"/></span>
</b:if>

Potete aggiungere più tag condizionali se il vostro blog è condivisa tra più di 2 membri.

TENETEVI IN MENTE CHE il codice è case sentitive. In questo caso, "autore1" non la stessa cosa che "AUTORE1". Il nome utente (autore) che bisogna inserire deve essere esattamente lo stesso che viene visualizzato nel profilo di Blogger. La dimensione ideale dell'immagine è di circa 30x30 - 50 x 50 pixel.

5) subito prima ]]</b:skin> inserite il seguente codice:


.author img{padding: 0; float: left; border: none; margin: 0 10px 10px 0;}

la proprietà float, cosi come la proprietà margin potrebbere essere cambiati a seconda di dove si desidera che l'immagine venga visualizzata.

6) DIVERTITEVI.

è SEMPLICISSIMOOOOOOOOOOOOOO

Scoprite anche



3 commenti

  1. paomablog // ha detto... 1 dicembre 2009 23:56  

    Ciao Denvoiser
    veramente bella questa dritta, pero' ho una richiesta da farti come posso far visualizzare l'immagine sotto alla fine del post? non riesco.
    Grazie in anticipo

  2. paomablog // ha detto... 2 dicembre 2009 00:29  

    Scusa ma lavorandoci un po' e ragionando ci sono riuscito.Comunque complimento per il BLOG sei forte,ti ho aggiunto nella mia lista di link amici spero che tu faccia lo stesso con il mio. CIAO

  3. Denvoizer // ha detto... 6 dicembre 2009 21:42  

    Ciao paomablog,
    Grazie per i complimenti...scusami ma non sono riuscito a risponderti, questi gioni ho um po' di esami all'uni....quindi non ho fatto in tempo.

Posta un commento