Il blog per tutti gli smanettoni del pc

In wordpress qualsiasi post può essere definito con una serie di elementi(attachments) come i video e le immagini .  Quando inseriamo un’ immagine nel contenuto di un post è possibile prelevarla con una funzione php messa a disposizione da wordpress e isolarla dal contenuto.

$images = get_children(array(
'post_type' => 'attachment',
'numberposts' => 1,
'post_status' => null,
'post_mime_type' => 'image',
'post_parent' => $id));
 
 
if(!empty($images)){
 
	foreach($images as $image){
	//$attachment = wp_get_attachment_image_src($image->ID, $size);
	$attachment = wp_get_attachment_image( $image->ID, $size );
	}
 
}

La funzione get_children(), che troviamo nella prima riga di questo script, è una funzione wordpress usata per prelevare dal database attachments, revisioni o sotto pagine di un post genitore .

Wp_get_attachment_image , invece, restituisce il codice html dell’immagine. Come secondo parametro è possibile inserire tre valori : thumbnail, medium, large or full .

Quandi se velessimo prelevare la thumb dell’immagine generata da wordpress basterebbe specificare nella funzione wp_get_attachment_image il valore thumbnail e il gioco è fatto

I widget sono una delle cose piu’ utili di wordpress perchè permettono di gestire il contenuto del sito in modo semplice ed immediato . Per chi non li conoscesse, essi non sono altro che dei box di semplice testo o box con plugin gestibili dal pannello admin.

Il primo passo è quello di dichiarare le aree destinate a questo scopo nella pagina functions.php :

	register_sidebar( array(
		'name' =>'Sidebar',
		'id' => 'sidebar',
		'before_widget' => '
	<li id="%1$s" class="widget-container %2$s">',
		'after_widget' => '</li>
',
		'before_title' => '
<h3 class="widget-title">',
		'after_title' => '</h3>
',
	) );

Nel parametro name inseriamo il nome dell’area . L’id ( secondo parametro ) è la stringa che identifica l’area . Con il terzo e quarto parametro indichiamo il codice che apre e chiude il box widget . Before_title e after_title sono i codici che aprono e chiudono il titolo del box .

Possiamo inserire quante  aree vogliamo , l’importante è dare un id diverso .

Il passo successivo consiste nel richiamare le aree dichiarate nelle pagine dove vogliamo visualizzarle :

 dynamic_sidebar("sidebar");

La funzione dynamic_sidebar accetta come argomento l’id dell’area .

A volte abbiamo la necessità di isolare dei post che appartengono ad una determinata categoria. Purtroppo, attualmente, dal pannello wordpress non è possibile gestire direttamente questo piccolo particalare. Nulla pero’ è impossibile, inserendo una semplice riga di codice è possibile ottenere l’effetto desiderato. Continua a leggere

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
}

Spero di esservi stato utile A domani !

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 :

1. Fare click su Aggiungere Nuovo
2. Compilare i due campi Nome e Valore
3. Fare click su Aggiungi Campo Personalizzato

Continua a leggere

Indice guida

1. - Introduzione
2. - Convertiamo header
3. - Commento prima parte del codice css
4. - Convertiamo i post
5. - Convertiamo la sidebar
6. - Convertiamo il footer

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.

<div id="footer">
<div id="footer-main">Qui footer</div>
</div>

#footer{
clear:both;
background:#D7D7D7;
padding:40px 0;
margin:40px 0 0 0;}
#footer-main{
width:999px;
margin:0 auto;}

Indice guida

1. - Introduzione
2. - Convertiamo header
3. - Commento prima parte del codice css
4. - Convertiamo i post

Eccoci al 4° appuntamento della guida . Oggi convertiremo i post del nostro theme wordpress.

Continua a leggere

Indice guida

1. - Introduzione
2. - Convertiamo header
3. - Commento prima parte del codice css
   

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:0 auto;
padding:0 30px;
}
#header{
padding:40px 0;
}
#header #logo{
float:left;
padding:0 30px 0 0;
font-family:"Times New Roman", Times, serif;
font-size:36px;
color:#3C3C30;
border-right:1px solid #CCCCCC;
 
}
#header #slogan{
float:left;
padding:15px 0 0 30px;
}
#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

Indice guida

1. - Introduzione
2. - Convertiamo header
   

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

A volte, 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