Convertendo il footer concludiamo la conversione generale del nostro theme wordpress. Nei prossimi articoli installeremo wordpress ed adatteremo easyTheme.
Il footer ha una struttura abbastanza semplice. Si tratta di due contenitori ( #footer e #footer-main ) . Il primo contenitore avrà una larghezza dinamica ( occupa orizzontalmente tutta la pagina) . Mentre il secondo contenitore sarà un div di 999px centrato.
In questo articolo convertiremo la sidebar, parte fondamentale di un theme wordpress. La sidebar contiene informazioni utili per l’utente come gli archivi, le categorie e informazioni personali.
Spiegare passo passo come convertire tutto il theme in html/css è davvero complicato . Dovrei scrivere una guida di minimo 50 pagine perchè ci vuole una solida conoscenza dell’html e del css. Per codesto motivo , ogni qual volta converto, registro ogni movimento del mio monitor.
Oggi spiegheremo passo passo il codice css, scritto nell’articolo precedente.
body{margin:0;padding:0;font-family:Arial, Helvetica,sans-serif;}#conteiner{width:999px;margin:0auto;padding:030px;}#header{padding:40px0;}#header#logo{float:left;padding:030px00;font-family:"Times New Roman", Times,serif;font-size:36px;color:#3C3C30;border-right:1pxsolid#CCCCCC;}#header#slogan{float:left;padding:15px0030px;}#header#logo em{color:#69950F;}
Prima di procedere, devo parlarvi di alcuni concetti chiave per la sintassi del css.
Per attribuire una determinata proprietà a un elemento html , si usano i selettori . Sono selettori, nel nostro caso :
‘body’,'#conteiner’,'#header’,'#header #logo’,'#header #slogan’ e ‘#header #logo em’.
Se non avete mai smanettato in css, vi starete chiedendo cosa è # ( sharp ) . Il simbolo sharp viene usato per selezionare un elemento della pagina HTML con un determinato id. Continua a leggere
La grafica che convertiremo passo passo è la seguente My Easy Theme
Si tratta , come accennato nell’articolo precedente, di una grafica molto semplice , studiata per chi non è tanto pratico .
Un layout grafico, per buona regola, si divide in tre parti : header , contenuto centrale e footer. La header è quella parte del sito, fissa in alto, composta da un logo e da un menu . Il contenuto, sono i testi centrali di ogni pagina. Invece il footer , è quella parte fissa in basso che contiene il copyright.
Oggi convertiamo la header del nostro theme.
Creiamo la pagina index.html , il file style.css e la cartella images . Continua a leggere
Questo articolo, è una piccola introduzione su quello che faremo nei prossimi appuntamenti. Non spiegherò come disegnare il layout grafico, perchè è un argomento molto ampio, che spero di trattare più in là. Ci limiteremo a convertire una piccola grafica realizzata dal sottoscritto, ed adattarla al nostro amato WordPress.
WordPress è uno dei piu’ importanti e diffusi CMS ( content management system ) per la gestione di un blog . I CMS non sono altro, che delle applicazioni , che facilitano la gestione di un sito web. WordPress ha fatto un gran successo perchè è molto semplice da adattare,da gestire e da implementare . E’ facile da implementare grazie ai numerosi plugin in circolazione . Anche noi possiamo fare un plugin ! E’ davvero molto semplice .
Il template che andremo a convertire è molto easy . E’ stato realizzato in modo da facilitare la conversione in CSS . Per chi non conosce il CSS, non vi preoccupate ! Spiegherò passo passo ogni riga di codice.
Nel prossimo appuntamento convertiremo il template !
Creiamo la pagina index.html , il file style.css e la cartella images . 
Questo articolo, è una piccola introduzione su quello che faremo nei prossimi appuntamenti. Non spiegherò come disegnare il layout grafico, perchè è un argomento molto ampio, che spero di trattare più in là. Ci limiteremo a convertire una piccola grafica realizzata dal sottoscritto, ed adattarla al nostro amato WordPress.