Come eliminare il bordo o sfondo dei gadget di Blogger


Molti modelli di Blogger ufficiali e non, presentano degli inestetismi, più precisamente degli effetti e personalizzazioni non desiderate. In questo caso mi riferisco ai bordi o sfondi dei gadget che risultano sgradevoli, in quanto sono di dimensioni sbagliate o caratterizzate da un colore che stona con il resto del tema o con l'interno del gadget stesso.

Eccovi un esempio di bordo presente attorno i gadget:



Per eliminare il bordo o sfondo dei gadget di Blogger si deve per prima cosa conoscere l'ID del gadget. Una volta individuato si va su Modello > Modifica HTML e si cerca la riga ]]></b:skin> e poi subito prima di essa dovete incollare il seguente codice:

#HTML1 {background-color: none !important;}

In questo caso l'id dell'esempio è HTML1 ma il vostro potrebbe essere di un numero diverso (HTML2, HTML3 ecc.), oppure totalmente diverso se avete utilizzato un gadget come quello della newsletter o della casella di ricerca, delle immagini ecc.

Se non volete eliminare il bordo o sfondo del gadget ma volete semplicemente sostituirlo con un altro colore il codice da usare sarà sempre lo stesso ma va sostituito none con il valore di un colore esadecimale.

Alcuni gadget non hanno impostato un colore esadecimale come sfondo, bensì un'immagine, quindi potrebbe non bastare il codice precedente per rimuovere o cambiare il colore del bordo o dello sfondo. Per individuarla vi consiglio di usare Google Chrome. Cliccando con il pulsante destro del mouse sul bordo o sfondo dovrete selezionare Ispeziona elemento. Si aprirà una finestra con tutto il css del gadget e voi dovrete individuare l'url dello sfondo.

Eccovi un esempio di come si dovrebbe individuare l'url.



Una volta trovato, vi basterà cercarlo nel modello e sostituirlo con un altro url per avere uno sfondo colorato diversamente.



3 commenti :

  1. niente da fare non riesco a risolverlo , non riesco a trovare url del bordo volevo farlo trasparente ma niente

    RispondiElimina
    Risposte
    1. l'ultima immagine l'ho presa dal tuo blog, quindi il link è quello ma se non lo trova può essere che non l'hai scritto corretto o che il codice del Modello è ristretto, cioè per individuarlo dovresti fare click su quelle freccette nere vicino ai numeri...

      Prova ad inserire questo codice css, dovrebbe funzionare per la sidebar di destra:
      .column-right-inner {background: none !important;}

      Elimina
    2. grazie Andrea il codice css funziona ora e perfetto

      Elimina

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, altrimenti la modalità "anonimo".