Come togliere il bordo alle immagini del blog.

Come eliminare il bordo dalle immagini o foto pubblicate nei post di un blog su Blogger.

In alcuni blog le immagini vengono postate automaticamente insieme a un bordo di dimensioni e colore spesso personalizzabili. Si può infatti andare su Modello > Personalizza > Avanzato > Immagini dove si può settare il colore dello sfondo delle immagini, il colore del bordo e quello della didascalia.

Bisogna ricordarsi di andare su Applica al blog in alto a destra per rendere effettive le modifiche. Questo vale per i modelli ufficiali di Blogger mentre per quelli scaricati da internet le cose sono più complicate. Per verificare lo stile con cui vengono pubblicate le immagini andate su Modello > Modifica HTML > Procedi e cercate con F3 .post-body img oppure .post img per i template più vecchi.

Il blocco di codice relativo sarà quello che determinerà l'aspetto delle immagini pubblicate. Ecco uno screenshot dei CSS presenti in un mio blog

In questo caso le immagini pubblicate avranno un bordo arrotondato. Si potrebbe modificare il codice precedente o al limite eliminarlo completamente per fare in modo di avere le immagini senza nessun bordo. Nel caso scegliate queste opzioni è sempre opportuno andare su Modello > Backup/Ripristino per salvare una copia di sicurezza del template.

In un commento mi è stato chiesto come si potrebbe fare per lasciare la gran parte delle immagini con il bordo ma avere anche la possibilità di pubblicarle senza bordo quando il caso lo richiedesse. Parlo di immagini animate o di foto che si preferisce visualizzare senza cornici aggiuntive. In genere nei modelli ufficiali di Blogger le immagini inserite in dei widget vengono visualizzate di default senza bordo ma ci potrebbero essere dei template in cui questo non accade. 

Per togliere il bordo a determinate immagini bisogna per prima cosa creare una classe di stile apposita che potrebbe essere chiamata "nobordo" 

.post-body img.nobordo {
border:none !important;
padding:0 !important;
}

Andate su Modello > Modifica HTML > Procedi, cercate la riga ]]></b:skin> e incollatelo subito sopra. Se nel vostro template avete il blocco di codice .post img allora sostituite nel codice precedente .post-body con .post. Salvate il modello.

Quando volete pubblicare in un articolo una immagine senza bordo, basterà che andiate in modalità HTML, in Origine se usate Windows Live Writer, e inseriate la foto con questa sintassi

<img class="nobordo" src="INDIRIZZO_IMMAGINE" alt="nome-immagine" title="titolo-immagine" width="300" />

dove si applica la classe "nobordo" alla immagine postata. I tag Title e Alt possono essere scelti a piacere così come anche la dimensione della immagine.