mercoledì 18 giugno 2014

Istruzioni per sfondi pesanti (+ 300Kb)

Come probabilmente molti sapranno Blogger da la possibilità di inserire un proprio sfondo al nostro blog, però l'immagine non deve superare i 300Kb di peso. Quindi dobbiamo inserire l'immagine, previamente caricata in un servizio di host immagini, direttamente nel codice Html di Blogger...niente di difficile, ci vuole solo un pò di pazienza.

Clicca su Design, in alto a destra nella barra di Blogger:


 poi clicca su Backup/Ripristino quindi salva il tuo modello originale, in questo modo potrai riutilizzarlo nel caso in cui qualcosa andasse storto:


Clicca su Personalizza, e scegli il modello Semplice:
quindi salva cliccando su Applica al blog.

Ora clicca su Modifica Html:
e cerca questa porzione di codice <b:skin>...</b:skin>
quindi clicca sulla piccola freccia nera accanto sulla sinistra, nel mio caso è sulla 27° riga, ma può essere un pò più giù o sù.
Cerca quindi questa parte di codice:

body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
padding: 0 $(content.shadow.spread) $(content.shadow.spread) $(content.shadow.spread);
$(body.background.override)
}

selezionalo e sostituiscilo con questo:
body {
font: $(body.font);
color: $(body.text.color);
background-image:url(indirizzo dell'immagine);
background-repeat:repeat-y;
background-position:center top;
background-attachment: fixed;
margin:0px;
padding: 0;
}

Il codice sostituito farà visualizzare l'immagine al centro, si ripeterà in verticale, e rimarrrà fissa anche quando scorreremo la pagina.


Ora non ci resta che eliminare l'effetto trasparenza del blog.

Scorri il codice fino alla riga 224 (circa):
.content-outer {
-moz-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);
-webkit-box-shadow: 0 0 $(content.shadow.spread.webkit) rgba(0, 0, 0, .15);
-goog-ms-box-shadow: 0 0 $(content.shadow.spread.ie) #333333;
box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);

margin-bottom: 1px;
}


cancella ora questa parte di codice:
-moz-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);
-webkit-box-shadow: 0 0 $(content.shadow.spread.webkit) rgba(0, 0, 0, .15);
-goog-ms-box-shadow: 0 0 $(content.shadow.spread.ie) #333333;
box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);


lasciando solo l'ultima riga tra le due parentesi: margin-bottom: 1px;

Non ti resta che salvare il modello e goderti il tuo nuovo sfondo!
Spero di essere stata sufficientemente chiara, ma se così non fosse, scrivete nei commenti e cercherò di aiutarvi.


2 commenti :

  1. sei bravissima
    immagini delicate e accostate con grande gusto!!
    complimenti

    RispondiElimina
    Risposte
    1. Grazie, sei molto gentile. Mi fa piacere che ti siano ppiaciuti i miei lavori ^_^

      Elimina

Related Posts Plugin for WordPress, Blogger...