Aggiungere Immagine Prima o Dopo Titolo del Widget di Blogger


Su blogger le personalizzazioni che si possono fare ad apparenza sono poche ma con un mix tra ingegno e fantasia si può rendere anche il più scarno blog in un qualcosa di veramente semplice e piacevole. E' il caso delle icone, immagini di piccole dimensioni, che possono essere aggiunte anche prima di ogni widget, solitamente li possiedono blog con grafica semplice e quelli che affrontano argomenti femminili come la cucina e le ricette.

La prima cosa che bisogna fare è individuare ID del Widget interessato. Andate su Layout e cliccate su Modifica nel Widget nella quale volete far apparire l'icona.


Aprendo il widget, andate nella parte finale dell'URL e ricavate la parola finale, quella dopo Id=. Nel mio caso essendo il widget della casella di ricerca si chiamava CustomSearch1 ma solitamente gli altri il widget prendono il nome di HTML1, HTML2, HTML3 ecc.. Quindi non copiate i codici che inserisco sotto tali e quali ma effettuate le modifiche in base al ID del vostro widget. Ricordo anche che il cuoricino luminoso è caricato sul mio album fotografico su Picasa e che comunque non eliminerò mai, potete se volete hostare l'immagine anche sul vostro album, ricavatene il link diretto e poi potete inserirla nel codice sostituendo il link che avevo messo in precedenza.


Ecco come si presenta l'icona prima del titolo del widget.



Invece l'icona qui è presente dopo il titolo del widget. E credo sia la soluzione migliore, almeno per quanto riguarda questo widget.


Per far apparire il cuoricino dovrete andare su Modello, poi su Modifica HTML e dentro il codice dovrete cercare la riga ]]></b:skin> e subito prima dovete incollare il codice riportato qui sotto:
#CustomSearch1 h2:before {
content: url(https://lh5.googleusercontent.com/-5oIzaow7pEk/UZOPgKCFJvI/AAAAAAAAhu4/Rz9O7YsmSus/s16/cuore16.png);
padding-right:8px;
}

CustomSearch1 = sostituitelo con l'ID del vostro widget.
Link = il link presente nel codice è quello del cuoricino, potete inserire qualsiasi altra immagine.

Inserendo questo codice l'icona apparirà prima del titolo del widget. Per farla invece apparire dopo dovete sostituire la parola before con after e poi sostituire right con left. Salvate il modello, e la personalizzazione è stata eseguita. Aggiornate la pagina del blog e potete mostrare il bellissimo cuoricino sul vostro blog. Può capitare che non appaia come vorrebbe questo perché usato il solito browser guasta grafica ma potete rimediare se ancora non l'avete già fatto ottimizzando blogger per Internet Explorer.


Nessun commento :

Scrivi un commento

I commenti dovranno prima essere approvati da un amministratore. Verranno pubblicati solo quelli utili a tutti e attinenti al contenuto della pagina. Per commentare utilizzate un account Google/Gmail.


© Scuolissima.com - appunti di scuola online! © 2021, diritti riservati di Andrea Sapuppo
P. IVA 05219230876

Policy Privacy - Cambia Impostazioni Cookies