WordPress e i campi personalizzati
Una guida, una bozza di quel che si può fare utilizzando i campi personalizzati – custom fields – di WordPress per impaginare contenuti e parte di un post.
Avevo espresso questo mio enigma anche sul Forum per Webmaster TPU – Tutti Per Uno
PREMESSA – IL PROBLEMA:
Ho avuto la necessità di trovare la soluzione ad un problema che mi assillava da tempo ovvero poter inserire nello stesso post di un sito basato su WordPress, un oggetto quale per esempio un’ immagine o un video YouTube e variarne le dimensioni a seconda che l’ articolo si trovi in homepage (nel qual caso volevo una thumbnail o il video di dimensioni ridotte in altezza e larghezza) o nella pagina dell’ articolo singolo (nel quel caso volevo mostrare l’ oggetto in questione con le dimensioni originali o comunque ingrandito rispetto alla visualuizzazione in homepage).
ANALISI DEL PROBLEMA:
Approfondendo sono venuto alla conclusione che mi serviva del codice php per poter estrapolare e passare le dimensioni all’ oggetto in questione, a seconda che mi trovassi in home o nella pagina dell’ articolo singolo.
L’ idea di base era che nei 2 blocchi di codice php i tag html per inserire le immagini o i tag per inserire contenuto flash in una pagina web sarebbero stati uguali per tutte le pagine, quindi la variabile sostanziale che avrei dovuto preoccuparmi sarebbe stato solamente il link da dove attingere il contenuto (src per il tag img per le immagini e value ed src per i tag per il video in flash di YouTube).
Per le dimensioni sarebbero state fissate già preventivamente nei due blocchi di codice php inseriti nella home e nella pagina dell’ articolo singolo facilitato dal fatto che nel mio template, come nel 90% dei templates WordPress, esiste il file index.php per la homepage del blog e single.php dove si trova il codice per estrapolare il contenuto del post singolo.
LA SOLUZIONE:
Quindi detto questo, mi serviva solo capire come poter inserire agevolmente il link all’ immagine o al video senza per forza dover a che fare con codice html e php.
WordPress mette a disposizione di default sotto il form, la textarea, in cui scrivere il post, una sezione dedicata ai campi personalizzati, che fino ad oggi non mi ero mai sognato di utilizzare, ma cercando soluzioone al mio problema su Google, quando mi son ricordato “campi personalizzati” mi è scattata la molla rileggendo “personalizzati”… questo significa che se posso inserire etichetta/nome del campo e contenuto dello stesso, si sarebbe registrato nel database ergo avrei potuto estrapolare a mio piacimento e quando avrei avuto la necessità tale contenuto nel template come e dove mi sarebbe piaciuto.
Capito il problema, analizzato… la soluzione si trovava sotto i miei occhi da sempre.
LA PRATICA:
IL CODICE:
Ho aperto con un editor testuale (io utilizzo joe da shell sulla mia postazione Ubuntu 
) index.php del template WordPress che stavo utilizzando;
Subito prima di questo codice che fa comparire il riassunto nella homepage:
<?php the_excerpt() ; ?>
..ho inserito tale codice (primo stralcio per inserire le miniature delle immagini Рed il secondo ̬ per i video YouTube):
<?php // pubblica la immagine se il campo personalizzato ‘immagine’ esiste
$values = get_post_custom_values(“videoyt”);
if ( is_array($values) ) { ?>
<div id=”imgCSS”>
<img src=”<?php $key=”immagine”; echo get_post_meta($post->ID, $key, true); ?>” alt=”<?php the_title(); ?>” width=”150″ height=”100″ />
</div>
<?php } ?>
<?php // pubblica la immagine se il campo personalizzato ‘videoyt’ esiste
$values = get_post_custom_values(“videoyt”);
if ( is_array($values) ) { ?>
<div id=”introVIDEO”>
<object width=”150″ height=”100″>
<param name=”movie” value=”<?php $key=”videoyt”; echo get_post_meta($post->ID, $key, true); ?>”></param>
<param name=”allowFullScreen” value=”true”></param>
<embed src=”<?php $key=”videoyt”; echo get_post_meta($post->ID, $key, true); ?>” type=”application/x-shockwave-flash” allowfullscreen=”true” width=”150″ height=”100″>
</embed>
</object>
</div>
<?php } ?>
Ho aperto il file single.php (il file come detto precedentemente, per estrapolare il contenuto di un post singolo):
<?php the_content(); ?>
Subito dopo questo codice che fa visualizzare tutto il contenuto del post:
…ho inserito il secondo blocco di codice php:
potete copiare il codice inserito nel index.php e variarne i paramentri width e height
Fatte queste modifiche il sistema è funzionante.
Nel momento in cui andrò a scrivere il mio post ed utilizzerò i campi personalizzati accoppiando l’ etichetta immagine + link di dove si trova l’ immagine o videoyt col link di dove si trova il video YouTube che voglio inserire, il codice php inserito nei due file sopra citati, si preoccuperà di estrapolare e far visualizzare le immagini e i video con le dimensioni adattate alla pagina in cui verranno pubblicati.
Un esempio lo potete vedere sul sito del CKF – Canoa Kayak Friuli nel blocco MOVIE a fondo pagina dell’ homepage e cliccando per esempio sul titolo in rosso scuro di tale video, come compare lo stesso video sull’ articolo singolo di tale news.
Questo ebook è il primo pubblicato da Informatica Friuli dedicato alla personalizzazione di certi aspetti dei template per WordPress.
Questo ebook non deve dare grosse aspettative ...
Non c'è hosting, spazio web dove hai caricato i file del tuo sito, che ti da la garanzia al 100% di posizionarti nella serp di Google al primo posto.
[caption id="" ...
Prendo spunto da quanto si può leggere su MasterNewMedia per quanto riguarda il Newsmaster come la figura che filtra e fornisce ...
[...] Come si possono utilizzare i campi personalizzati diper poter migliorare l’ aspetto grafico e visivo, con un semplice automatismo durante la stesura di un post.Il mio punto di vista, il problema, l’ anialisi dello stesso e la soluzione le ho riportate sotto forma di guida su Informatica Friuli. [...]
[...] WordPress e i campi personalizzati Risorse utili [...]
ciao
complimenti per il blog
ho un grosso problema (almeno per me ) praticamente sono passato da blogger a Word press quindi capirai la differenza sono partito nuovamente da 0 . ecco il mio problema
ho un blog word press faccio un articolo metto l immagine in Home page si vede un rettangolo che in qualche modo potrei pure accettare anche se non e' preciso nel post va tutto bene , l unico posto dove viene veramente indecente e' nella sezione archivio praticamente in un pagina vengono elecati piu post di una determinata categoria a lato del titolo c'e' un immagine del post piccola che in nessun caso viene raffigurata bene
Come posso fare ? ecco un esempio
immagine giusta nel post http://www.linkstreaming.com/88-minuti.html
immagine non tanto buona in home page http://www.linkstreaming.com/
immagine nell archivio praticamente nulla http://www.linkstreaming.com/category/alta-qual...
scusa tanto il disturbo pero non so cosa fare
grazie 1000
Ciao nata100
Darti una risposta precisa è difficile perchè dipende dal template che stai utilizzando.
La prassi è di non appesantire troppo le sezioni archivi cercaando di non inserire le immagini dei vari post, che condivido come prassi.
Ti dico cosa farei io: (è una soluzione “avanzata” per chi come te proviene da blogger e magari non mastica fogli di stile e codice)
1. L' immagine nel post la carico tramite la gestione immagini di WordPress;
2. Copio il link di dove viene salvata l' immagine;
3. utilizzo un campo personalizzato dandogli il nome “imgpost” ed incollo dentro il link;
4. personalizzerei il template precisamente il file archive.php (il file per far visualizzare appunto gli archivi) inserendo il codice sulla traccia di quella che ho fornito nel mio post inserendo al posto di “videoyt” il nome del campo che hai creato ovvero “imgpost”.
5. al posto del codice tra i <div id=â€introVIDEOâ€> e </div> inserirei il codice html per inserire un' immagine.
6. nel foglio di stile impartirei le direttive per “introVIDEO” dicendo che le immagini sotto questa classe abbiano le dimensioni personalizzate da me in altezza e larghezza.
Stesso procedimento dovrai farlo per single.php ovvero il file del template per visualizzare l' articolo singolo MA invece di metterci come classe “introVIDEO” ci meti un altro nome per la classe CSS stile “imgSINGLE” e nel CSS (foglio di stile) inserirai le dimensioni standard (grandezza naturale dell' immagine) per farla visualizare nella sua dimensione naturale.
Detto cosi è difficile da spiegare, ma se vuoi sono sempre a disposizione.
Ci si può sentire via chat (devo ancora indicarli pubblicamente su questo blog) ma su Google Talk mi puoi trovare davide.tommasin@gmail.com oppure su skype come kinghack
Per le mail trovi la sezione contatti in questo blog
Ciao
non riesco ad inserire le immagini nella home page
ho fatto come hai scritto ma zeeerooooo!!!!!!!!!!!!!
help!!
Sono incappato in questo post molto utile.
La procedura è chiara ma non ho capito che cos'è videoyt
$values = get_post_custom_values(â€videoytâ€);
Che significa? A cosa rimanmda?
videoyt è solamente l' “etichetta”, un termine, un tag inventato da me per specificare la variabile per i video youtube.
get__post_custom_values è la funzione che va a estrapolare dal database il valore di quella variabile specifica del post in cui l' hai inserita.
Qui dipende imho tutto dal template che stai utilizzando,
Darti una risposta precisa, una soluzione alla tua domanda non è possibile.
Che template utilizzi? Il link al tuo blog? Se me li indichi forse arrivo a darti ulteriori info.
Ciao, utilizzo i custom fields da un pò senza problemi. Ora è giunto il momento di fare un passa in più. Molti temi premium (a pagamento) offrono i custom field automatici per le immagini. in pratica prendono l'indirizzo della prima immagine che trovano nel post e lo salvano nel custum field desiderato. questo aiuta molta perchè non è più necessario copiare il nome dell'immagine o il percorso…
In rete però non ho trovato molto sull'argomento. Ne sai qualcosa?
Grazie in anticipo
Mauri
Ciao Mauri, per ora non so darti una risposta precisa perchè devo studiarmi la cosa.
Se ho news ti faccio sapere
ho trovato proprio ora un semplice plugin molto configurabile che permette quanto detto:
http://justintadlock.com/archives/2008/05/27/ge...
Il plugin una volta attivato cerca all'interno del post la prima immagine e restituisce attraverso la funzione:
<?php echo get_the_image('width=70&height=70&image_class=left'); ?>
il codice html relativo all'immagine… Ho eliminato tutti i custom fields dai miei post (vedi italytodo dot com) e penso di avere anche guadagnato in performance (oltre che in codice php)
spero vi sia utile
Ciao
Mauri
Grazie 1000 per la segnalazione
ottima guida, dopo a casa proverò ad attuarla nel mio blog
intanto mi iscrivo ai feed!
Buon lavoro… in caso facci sapere com'è andata
è andata, dopo qualche imprecazione di troppo (a chi copia il codice, ricordatevi di ridigitare le virgolette….arg!), ora devo solo formattare meglio il tutto
[...] campi personalizzati di [...]
Ciao, ottima la soluzione proposta, mi piacerebbe implementarla su un blog dedicato agli orologi.
Però, ho un però
Come potrei fare in modo che gli articoli creati e che voglio vengano visualizzati…NON compaiano nella Home Page del Blog?
Mi spiego meglio: di default WP quando scriviamo un articolo lo visualizza nella home page, ecco, io vorrei fare in modo che ciò non avvenga e che l’utente possa leggere gli articoli presenti con la soluzione da te proposta,
Per meglio farmi comprendere: l’idea è quella di creare una categoria chiamata “Orologi e Marchi in evidenza” dove inserire articoli su orologi o marchi che hanno particolari caratteristiche (complicazioni, style ecc ecc ecc)
Grazie per l’aiutone
Ciau
Teodoro
Ciao…stranamente a me non funziona…boh proverò a smanettare un po' sul codice…a proposito…sono friulano anch'io
Ciao paic95
Dire che non funziona è troppo generico per poterti dare un aituo o un consiglio.
Che problemi hai riscontrato?
eheh risolto…bastava riscrivere le virgolette…cmq al max faccio un post sul mio blog…
probabilmente copiando le virgolette "sfasavano"…boh…cmq ade ho risolto e funziona…
Ciao paic95
Si, purtroppo è un qualcosa inerente all' impaginazione di WordPress che fa in modo di codificare certi tipi di caratteri.
Fra un po sistemo anche questo problema qui su InformaticaFriuli.
Ho piacere che hai risolto
Grazie mille!
))
Grazie a te Elisa per il commento e per essere passata di qua
grandissimi, dopo lunghe prove e ricerche, innumerevoli codici php e plugin non funzionanti, con il vostro aiuto sono riuscito ad avere le immagini dei post in home page! grazie!
ah, nel primo campo php penso ci sia una svista:
<?php // pubblica la immagine se il campo personalizzato ‘immagine’ esiste $values = get_post_custom_values(“immagine”);
e non <?php // pubblica la immagine se il campo personalizzato ‘immagine’ esiste $values = get_post_custom_values(“videoyt”);
ciao!
Sono contento che hai risolto
Ci sono altre tecniche che si possono adottare e spero ben presto di poterci scrivere altri post
Mmmm, si hai ragione una svista.
Grazie per la segnalazione.