Annuncio pubblicitario

Molti blogger cercheranno in alto e in basso il widget WordPress perfetto che farà esattamente cosa vogliono, ma con una piccola esperienza di programmazione potresti trovare più facile scrivere le tue abitudini aggeggio.

Questa settimana vorrei mostrare come fare esattamente questo, e il widget che scriveremo è semplice che seleziona un singolo post casuale dal tuo sito, estrae l'immagine in primo piano e la visualizza sulla barra laterale: un widget visivo di "check out" che aiuterà gli utenti a trovare più contenuti sul tuo luogo.

Questa è anche un'estensione di una serie continua in cui ti mostro quanto sia facile personalizza il tuo modello WordPress 2 nuovi fantastici plugin di Wordpress e comprensione della struttura del tema di WordpressQuesta settimana darò un'occhiata a un'alternativa superiore al SEO All-In-One spesso elogiato; un plug-in che ti dà la potenza di un sistema di pubblicazione Wordpress ma ti consente di produrre ... Leggi di più .

Potresti anche essere felice di sapere che ne abbiamo aggiunto uno nuovo

Categoria Tutorial di WordPress MakeUseOf, quindi assicurati di verificarlo per un archivio sempre crescente di suggerimenti e guide aggiornati sulla piattaforma di blog preferita nel mondo.

Concetti chiave: query di WordPress e il ciclo

Ogni pagina del tuo blog è costituita da una query al 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 "ottenere gli ultimi 10 post del blog“. Quando visualizzi gli archivi di categoria, la query può cambiare in "ricevi gli ultimi 20 messaggi solo per la categoria foto di famiglia, ordina i risultati per data di pubblicazione“. Ogni query restituirà una serie di risultati e, a seconda del modello di pagina utilizzato, ciascun risultato verrà eseguito attraverso il "ciclo" principale del modello.

Ogni pagina può in realtà essere composta da più di una query e puoi anche 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: sono disponibili alcune query aggiuntive ogni pagina che ha lo scopo di mostrarti articoli correlati che potrebbero interessarti o articoli che stanno andando di tendenza settimana.

Per creare il nostro widget personalizzato, dovremo semplicemente creare una query aggiuntiva che acquisisca un numero X di post casuali più le loro immagini e li visualizzi in qualche modo sulla barra laterale. Ti ho già mostrato la scorsa settimana il codice a prendi l'immagine in primo piano Configura il tuo blog con WordPress: la guida definitivaVuoi iniziare il tuo blog ma non sai come fare? Guarda WordPress, la più potente piattaforma di blog disponibile oggi. Leggi di più , quindi dobbiamo solo sapere come creare un nuovo widget WordPress e posizionarlo sulla barra laterale.

Codice widget di base

Inizia creando un nuovo file .php nel tuo wp-content / plugins directory. Puoi anche seguire il tutorial offline e caricarlo utilizzando 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 ci 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 modificare 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 un secondo momento.

php. /* Nome plug-in: Widget post casuale. URI del plug-in: http://jamesbruce.me/ Descrizione: Widget Posta casuale prende un post casuale e la miniatura associata da visualizzare sulla barra laterale. Autore: James Bruce. Versione: 1. URI dell'autore: http://jamesbruce.me/ * / class RandomPostWidget estende WP_Widget. {function RandomPostWidget () {$ widget_ops = array ('classname' => 'RandomPostWidget', 'description' => 'Visualizza un post casuale con anteprima'); $ this-> WP_Widget ('RandomPostWidget', 'Random Post and Thumbnail', $ widget_ops); } form function ($ instance) {$ instance = wp_parse_args ((array) $ instance, array ('title' => '')); $ title = $ instance ['title'];
Titolo: 
php} aggiornamento della funzione ($ new_instance, $ old_instance) {$ instance = $ old_instance; $ instance ['title'] = $ new_instance ['title']; restituisce $ instance; } widget della funzione ($ args, $ instance) {extract ($ args, EXTR_SKIP); echo $ before_widget; $ title = empty ($ instance ['title'])? '': apply_filters ('widget_title', $ instance ['title']); if (! empty ($ title)) echo $ before_title. $ Titolo. $ After_title;; // IL CODICE WIDGET VA QUI echo "
 Questo è il mio nuovo widget! 
"; echo $ after_widget; } } add_action ('widgets_init', create_function ('', 'return register_widget ("RandomPostWidget");'));

Allo stato attuale, il plug-in non fa molto a parte stampare un titolo di grandi dimensioni con le parole "Questo è il mio nuovo widget!“.

Ti dà comunque la possibilità di cambiare il titolo, che è essenziale per qualsiasi widget. L'aggiunta di altre opzioni va un po 'oltre lo scopo di questo articolo oggi, quindi per ora passiamo a dargli uno scopo reale.

Una nuova query e il ciclo

Per fare una nuova query nel database del tuo blog, devi usare il query_posts () insieme ad alcuni parametri, quindi esegui l'output usando un ciclo while. Proviamo questo: una query e un ciclo molto semplici da dimostrare. Sostituisci la riga di codice che dice:

con il seguente:

// IL CODICE WIDGET VA QUI. query_posts ( ''); if (have_posts ()): while (have_posts ()): the_post (); il titolo(); endwhile; finisci se; wp_reset_query (); 

Questa è una query assolutamente di base che utilizza le opzioni predefinite e la formattazione zero dell'output. A seconda di come è impostato il tuo blog, il valore predefinito sarà molto probabilmente quello di prendere gli ultimi 10 post - quindi tutto il codice sopra è quello di produrre il titolo di ciascun post. È piuttosto brutto, ma funziona:

Possiamo migliorarlo subito aggiungendo un po 'di formattazione HTML all'output con ECO comando e creando un collegamento al post usando get_the_permalink () funzione:

 query_posts ( ''); if (have_posts ()): echo "

• “; while (have_posts ()): the_post (); eco "
  • “.Get_the_title ().”

“; endwhile; eco "

“; finisci se; wp_reset_query ();

Sta già 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'); 

Certo, potresti cambiarlo in qualsiasi numero di post - in effetti, c'è un tutta la gamma di bit extra che è possibile passare alla query al fine di limitare, espandere o modificare l'ordine dei risultati, ma per ora restiamo fedeli a quello. Se aggiorni, dovresti vedere solo un post che viene randomizzato ogni volta che aggiorni.

Ora per la miniatura in primo piano. Sostituisci il codice con questo, speriamo 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 (); eco "
  • “.Get_the_title (); echo the_post_thumbnail (array (220.200)); eco "

“; endwhile; eco "

“; finisci se; wp_reset_query ();

Puoi vedere di nuovo i risultati finiti sul mio blog di sviluppo Guida all'autosufficienza, anche se potrei aver spostato le cose quando leggi questo.

Conclusione:

Vedi quanto è facile creare il tuo widget personalizzato in grado di fare esattamente quello che vuoi? Anche se non capisci il 90% del codice che ti ho mostrato oggi, dovresti comunque essere in grado di personalizzarlo modificando semplicemente le variabili o producendo HTML diverso. Oggi abbiamo scritto un intero widget, ma puoi facilmente utilizzare solo la nuova query e il codice loop su uno qualsiasi dei tuoi modelli di pagina.