Validare un form con jquery è davvero semplice : occorrono poche istruzioni per scrivere una funzione completa e sicura . Non avevo mai validato un checkbox con jquery , cosi mi sono chiesto come sia possibile farlo senza usare javascript puro .
Girovagando sul sito di jquery sono arrivato ad una semplice conclusione , usare la funzione is() .
if($("#id_checkbox").is(":checked")){// Se checkbox è selezionato}else{// Se checkbox non è selezionato}
I Costum Field non sono altro che dei campi aggiuntivi da inserire in post e pagine per organizzare al meglio le informazioni . Dal mio punto di vista questa funzione è una delle più utili di wordpress perchè permette di creare dei veri e propri cms .
Inserirne uno è davvero semplice . Quando stai per salvare un nuovo post , in fondo alla pagina avrai sicuramente notato il box “Campi personalizzati” . Da li è possibile aggiungere tutti i parametri che vuoi .
Nella versione 3.0 di wordpress occorrono i seguenti passaggi :
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.
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
Avvolte, per esigenze grafiche, si ha la necessità di isolare le immagini del nostro theme wordpress, e manipolarle come ci piace.
Questa funzione è realizzabile. Vi posto il codice :
function get_first_image($post){preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i',$post->post_content,$matches);$firstimage=$matches[1][0];return$firstimage;}
Per renderla visibile in tutto il theme wordpress, basta inserirla nella pagina functions.php
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 !