Allargare il tema per Wordpress “Gossip City” Scrivi un commento!

Allargare il tema per Wordpress “Gossip City”

English Translation: Enlarging “Gossip City” Wordpress Theme

Gossip City
è un tema per Wordpress disegnato da Design Disease - gli autori di temi famosi come Illacrimo e Dilectio Theme. Come possiamo vedere da Google, ben 352000 blog lo usano (come Bimbominkia). È pensato per i blog sul gossip, ma è così bello che l’ho usato anche per il blogging blog! :P Purtroppo è un tema abbastanza stretto:

  • non puoi innestare, nei post, blocchi di adsense larghi;
  • non puoi inserire immagini troppo larghe (penso sia un parametro importante, per un blog sul gossip);

Comunque, con un po’ di modifiche al CSS, puoi facilmente allargarlo!

gossip city - enlarging the theme
Gossip City largo VS la versione originale

Gossip City Standard VS Gossip City largo

Puoi aumentare la larghezza del tema di 140 pixels. Come?

  • riducendo la larghezza della sidebar di sinistra: recupererai 60px;
  • allargando il contenitore principale (dei post e delle sidebar): recupererai altri 80px.

Allargare Gossip City

Ora devi modificare un po’ il foglio di stile. Apri il file style.css e segui le istruzioni!

Ridurre la larghezza della sidebar sinistra

Cerca

.SRL { width: 230px; float: left; padding: 0px;}

e sostituiscilo con

.SRL { width: 170px; float: left; padding: 0px;}

Adesso devi diminuire anche la larghezza del div contenitore delle sidebar. Cerca

.SR { width: 415px; float: right; position: relative; padding: 0px 0px 20px 0px; }

e rimpiazzalo con

.SR { width: 355px; float: right; position: relative; padding: 0px 0px 20px 0px; }

Se ti vuoi fermare qui (in modo che il corpo centrale resti allineato all’header e al footer) continua a leggere, altrimenti salta al prossimo paragrafo! ;)

Così, non vuoi restringere ulteriormente il tema. Bene: trova

.SC { width: 455px; float: left; padding: 0px 0px 20px 0px; }

e sostituiscilo con:

.SC { width: 515px; float: left; padding: 0px 0px 20px 0px; }

Adesso devi comunque risolvere il problema del div dei commenti.

Allargare il div contenitore principale

Cerca

.CON { width: 900px; position: relative; margin: 0 auto; padding: 0px; margin-top: 25px; }

e sostituiscilo con

.CON { width: 980px; position: relative; margin: 0 auto; padding: 0px; margin-top: 25px; }

Imposta la larghezza originale al div dei commenti!

Poiché il tema Gossip City non è fluido, e i commenti hanno tutti e 4 i bordi arrotondati, devi ripristinare la larghezza originale al div dei commenti, per non rovinare la grafica. Cerca

.Comments { margin: 20px 0px 0px 0px;}

e sostituiscilo con

.Comments { margin: 20px 0px 0px 0px; width: 455px;}

Usare la larghezza originale per il div dei trackback!

Lo stesso problema del div dei commenti si presenta col div dei trackback. Cerca

.TrackList { background: #f4ebef url(images/TrackListBottom.gif) no-repeat bottom; padding: 15px; margin-top: 20px; position:relative;}

E sostituiscilo con:

.TrackList { background: #f4ebef url(images/TrackListBottom.gif) no-repeat bottom; padding: 15px; margin-top: 20px; position:relative; width: 425px;}

Perché 425px, invece di 455px? Perché il div di classe TrackList ha 15px di padding; poiché

larghezza reale (we need 455px) = width dichiarata + padding-left (15px) + padding-right (15px)

width deve essere dichiarata di 455-15-15 = 425px!

È tutto! :D

Articoli simili:

Se questo articolo ti è stato utile, segnalalo sul tuo sito! Puoi inoltre seguire comodamente gli aggiornamenti di Techlog tramite il feed RSS; infine puoi lasciare un commento se ti serve aiuto (o anche solo per un saluto); anche qui non serve registrarsi (sono abilitati anche i commenti anonimi; l'E-Mail serve, eventualmente, per ricevere le notifiche delle nuove risposte). ;-)

One Response to “Allargare il tema per Wordpress “Gossip City””

  1. Enlarging “Gossip City” Wordpress Theme - The Blogging Blog Says:

    […] italiana: Allargare il tema per Wordpress “Gossip City” Gossip City is a wonderful wordpress theme designed by Design Disease - the authors of well known […]

Leave a Reply


SMS Gratis