Come creare i propri widget di WordPress di base
Molti blogger cercheranno in alto e in basso il perfetto widget WordPress che farà esattamente quello che vogliono, ma con una piccola esperienza di programmazione potresti trovare che è più facile scrivere il tuo widget personalizzato.
Questa settimana mi piacerebbe mostrare come fare esattamente questo, e il widget che scriveremo è un semplice che preleva un singolo post casuale dal tuo sito, estrae l'immagine in primo piano e la mostra nella barra laterale - un elemento visivo “controllalo” widget che aiuterà gli utenti a trovare più contenuti sul tuo sito.
Questa è anche un'estensione di una serie continua in cui ti mostro com'è facile personalizzare il tuo modello WordPress 2 Nuovi fantastici plugin per Wordpress e comprensione della struttura dei temi di Wordpress 2 Nuovi fantastici plugin per Wordpress e comprensione della struttura dei temi di Wordpress Questa settimana farò dare un'occhiata a un'alternativa superiore al SEO All-In-One spesso elogiato; un plugin che ti dà la potenza di un sistema di pubblicazione Wordpress ma ti permette di produrre ... Leggi altro .
Potresti anche essere contento di sapere che abbiamo aggiunto una nuova categoria di tutorial per WordPress a MakeUseOf, quindi assicurati di verificarlo per un archivio in continua crescita di suggerimenti e guide aggiornate alla piattaforma di blogging preferita del mondo.
Concetti chiave: query WordPress e il ciclo
Ogni pagina del tuo blog consiste in una query al tuo database di post. A seconda della pagina che stai visualizzando, la query cambierà. La home page del tuo blog, ad esempio, può utilizzare la query “ricevi gli ultimi 10 post del blog“. Quando si visualizzano gli archivi delle categorie, la query può cambiare a “ricevi gli ultimi 20 post per le foto di famiglia di categoria, ordina i risultati per data di pubblicazione“. Ogni query restituirà una serie di risultati e, a seconda del modello di pagina utilizzato, ogni risultato verrà eseguito attraverso il principale “ciclo continuo” del modello.
Ogni pagina può infatti consistere di più di una query, e puoi persino creare le tue query per aggiungere funzionalità a vari punti del tuo modello. Puoi vedere un esempio di questo in uso nella parte inferiore di questo articolo: abbiamo alcune query aggiuntive eseguite su ogni pagina che mirano a mostrare gli articoli correlati a cui potresti essere interessato o gli articoli di tendenza questa settimana.
Per realizzare il nostro widget personalizzato, dovremo semplicemente creare una query aggiuntiva che acquisisca il numero X di post casuali più le loro immagini e li visualizzi in qualche modo nella barra laterale. Ti ho già mostrato la settimana scorsa il codice per catturare l'immagine in primo piano Come migliorare il tuo Wordpress aggiungendo immagini in primo piano Come migliorare il tuo Wordpress aggiungendo immagini in primo piano Le immagini sono state introdotte in Wordpress nella versione 2.9 e ti consentono di visualizzare facilmente un'immagine associata al post del tuo blog in varie parti del tuo tema. Oggi mi piacerebbe mostrare ... Leggi di più, quindi abbiamo solo bisogno di sapere come creare un nuovo widget di WordPress e posizionarlo nella barra laterale.
Codice del widget di base
Inizia creando un nuovo file .php nel tuo wp-content / plugins directory. Puoi anche seguire il tutorial offline, quindi caricarlo tramite l'interfaccia di WordPress, ma trovo che sia più facile scrivere mentre procediamo nel caso in cui sia necessario eseguire il debug. Chiama il tuo file come preferisci, ma io vado random-post-widget.php
Incolla quanto segue nel file e salva. Sentiti libero di cambiare la sezione in alto con il mio nome, ma non aggiustare ancora il resto del codice. Questo è fondamentalmente un widget scheletro vuoto e puoi vedere dove dice // IL CODICE WIDGET VA QUI è dove aggiungeremo la nostra funzionalità in seguito.
'RandomPostWidget', 'description' => 'Visualizza un post casuale con miniatura'); $ this-> WP_Widget ('RandomPostWidget', 'Post casuale e miniatura', $ widget_ops); function form ($ instance) $ istanza = wp_parse_args ((array) $ istanza, array ('title' => ")); $ title = $ istanza ['titolo'];?> Questo è il mio nuovo widget!"; echo $ after_widget; add_action ('widgets_init', create_function (", 'return register_widget ("RandomPostWidget");'));?>
Così com'è, il plugin non fa molto a parte stampare un grande titolo con le parole “Questo è il mio nuovo widget!“.
Tuttavia ti dà la possibilità di cambiare il titolo, che è un po 'essenziale per qualsiasi widget. Aggiungere altre opzioni è un po 'oltre lo scopo di questo articolo oggi, quindi per ora passiamo a dargli un vero scopo.
Una nuova query e il ciclo
Per creare una nuova query nel database del tuo blog, devi utilizzare il query_posts () funzione insieme ad alcuni parametri, quindi esegui l'output usando un ciclo while. Proviamo questo: una query e un loop molto semplici da dimostrare. Sostituisci la riga di codice che dice:
Questo è il mio nuovo widget!
con il seguente:
// CODICE WIDGET VA QUI query_posts ("); if (have_posts ()): while (have_posts ()): the_post (); the_title (); endwhile; endif; wp_reset_query ();
Questa è una query di base che utilizza le opzioni predefinite e la formattazione zero dell'output. A seconda di come è impostato il tuo blog, l'impostazione predefinita sarà probabilmente quella di prendere i 10 post più recenti - quindi tutto il codice di cui sopra fa uscire il titolo di ogni post. È piuttosto brutto, ma funziona:
Possiamo renderlo un po 'migliore subito aggiungendo un po' di formattazione HTML all'output con ECO comando e creando un collegamento al post utilizzando get_the_permalink () funzione:
query_posts ("); if (have_posts ()): echo""; while (have_posts ()): the_post (); echo"- ".Get_the_title ()."
"; endwhile; echo"
"; endif; wp_reset_query ();
Già sembra molto meglio. Ma vogliamo solo un post, scelto a caso. Per fare ciò, specifichiamo alcuni parametri nella query:
query_posts ( 'posts_per_page = 1 & orderby = rand');
Ovviamente, è possibile cambiarlo in un numero qualsiasi di post: infatti, è disponibile un'intera gamma di bit aggiuntivi che è possibile trasferire nella query per limitare, espandere o modificare l'ordine dei risultati, ma restiamo invariati per adesso. Se si aggiorna, si dovrebbe vedere solo un post che è randomizzato ogni volta che si aggiorna.
Ora per la miniatura in primo piano. Sostituisci il codice con questo, si spera che tu possa vedere dove stiamo afferrando la miniatura e mostrandola:
query_posts ( 'posts_per_page = 1 & orderby = rand'); if (have_posts ()): echo ""; while (have_posts ()): the_post (); echo"- ".get_the_title (); echo the_post_thumbnail (array (220,200)); echo"
"; endwhile; echo"
"; endif; wp_reset_query ();
Puoi vedere di nuovo i risultati finiti sulla mia guida Self Sufficiency del mio blog di sviluppo, anche se potrei aver spostato le cose nel momento in cui leggi questo.
Conclusione:
Guarda quanto è facile creare il tuo widget personalizzato che può fare esattamente quello che vuoi? Anche se non comprendi il 90% del codice che ti ho mostrato oggi, dovresti comunque essere in grado di personalizzarlo in qualche modo semplicemente cambiando le variabili o emettendo HTML diversi. Oggi abbiamo scritto un intero widget, ma potresti facilmente utilizzare solo la nuova query e il codice di loop su qualsiasi modello di pagina.
I problemi? Hai bisogno di aiuto per WordPress? Sono sempre a disposizione per aiutare in MakeUseOf Answers, quindi vai avanti e posta una nuova domanda lì.
Scopri di più su: Blogging, programmazione, Wordpress.