Crea un database di recensioni dei prodotti con Wordpress: tipi di post personalizzati, campi personalizzati, immagini in primo piano e widget!

Annuncio pubblicitario

L'ultima volta che ti ho mostrato come creare un semplice elenco di eventi Come creare il tuo elenco di eventi utilizzando i tipi di post personalizzati in WordPressWordPress ti consente di utilizzare i tipi di posta personalizzati per estendere la funzionalità integrata. Ecco come farlo senza plugin. Leggi di più usando forse la funzionalità più potente di WordPress 3.0 - tipi di post personalizzati. Dopo alcune richieste per svilupparlo ulteriormente, oggi creeremo un database di recensioni dei prodotti per collegare tutto ciò che abbiamo appreso finora.

Sarai in grado di mantenere un elenco separato di prodotti utilizzando tipi di post personalizzati, ognuno con un'immagine associata e alcuni meta-informazioni come prezzo, valutazione, specifiche - e finiremo tutto con un modo per visualizzarli in un widget della barra laterale e un pagina indice. Suona bene? Continuare a leggere.

Requisiti:

Avrai bisogno di un'installazione autonoma di WordPress 3.0+ funzionante e questo farà uso di una vasta codifica PHP. Ti darò il codice, ma dovrai essere relativamente a tuo agio con PHP e XHTML per adattare i nomi delle variabili alle tue esigenze o cambiare lo stile. Se hai bisogno di un corso rapido per principianti su CSS e XHTML, posso suggerire il nostro meraviglioso programma gratuito

guida per principianti Impara a parlare di "Internet": la tua guida a xHTMLBenvenuti nel mondo di XHTML - Extensible Hypertext Markup Language - un linguaggio di markup che consente a chiunque di costruire pagine Web con molte funzioni diverse. È la lingua principale di Internet. Leggi di più scaricare. Suggerirei anche di usare a codificato in modo pulito ma di base tema: il valore predefinito Venti Dieci o Twenty-Eleven il tema è in realtà abbastanza complicato da modificare, quindi prova questo prima su qualcosa di più semplice prima di provare a integrarlo.

Se leggi il tutorial delle ultime settimane, dovresti avere una certa familiarità con la creazione di un tipo di post personalizzato in WordPress. Copia e incolla questo codice di base in un nuovo plugin, attivalo e inizia ad aggiungere alcuni nuovi prodotti in modo che abbiamo un set di dati con cui lavorare. (Nota. Se preferisci scaricare il codice completo e completo ora senza provare ad aggiungere elementi lungo il percorso, utilizzare invece questo codice finito. Puoi ancora seguire il tutorial e personalizzarlo mentre procediamo)

È anche saggio decidere ora quale tipo di meta-informazioni desideri associare a ciascun prodotto. Un database di fotocamere digitali, ad esempio, potrebbe richiedere:

• Prezzo al dettaglio
• Risoluzione
• Video HD
• Link per l'acquisto
• Valutazione

Invece di aggiungere queste informazioni direttamente alla descrizione del prodotto (il "contenuto del post"), creeremo campi personalizzati per contenere queste informazioni. Nella schermata Aggiungi prodotto, assicurati di aver abilitato i campi personalizzati, quindi crea un nuovo campo per ogni set di informazioni. Dovrai creare nuovi campi una sola volta: il prodotto successivo che aggiungi sarà in grado di selezionare il nome del campo personalizzato dalla casella a discesa. Non dimenticare di aggiungere un'immagine in primo piano, oltre a usarla per visualizzarla in un secondo momento accanto al prodotto informativo.

Modello per singolo prodotto

Se provi a visualizzare uno dei tuoi prodotti ora, probabilmente otterrai un 404 non trovato errore. Per risolvere il problema, vai in impostazioni di permalink di WordPress e basta premere Salva le impostazioni una volta. Ora, quando visualizzi una delle tue nuove voci di prodotto, a seconda del tema, potresti vedere qualcosa di un po 'chiaro. Il testo del titolo e della descrizione ci sono, ma per quanto riguarda tutte le nostre meta info personalizzate e l'immagine?

Per personalizzare le visualizzazioni dei singoli prodotti, dovremo personalizzare un nuovo file modello chiamato single-products.php - fallo duplicando il tuo esistente single.php quindi abbiamo le basi in atto e non stiamo iniziando da zero.

A questo punto, apporterò una piccola modifica alla riga che mostra "Scritto da (autore) il (data)", Quindi invece legge semplicemente"Aggiunto al database il (data)”. Questo è solo per essere sicuro che il modello funzioni e l'aggiornamento della pagina del singolo prodotto dovrebbe mostrare immediatamente questa modifica.

Ora, per aggiungere l'immagine di post in evidenza che abbiamo allegato al prodotto, questa riga dovrebbe farlo (ho incluso anche le informazioni di stile, nel caso ne avessi bisogno). Ho pubblicato il codice completo per il mio single-products.php qui, ma ricorda che è unico per il mio tema, quindi semplicemente copiarlo nella tua directory dei temi può produrre risultati inaspettati.

Il modo più semplice per aggiungere le meta info ovunque è usare:

... ma questo ci fornirà solo un elenco di output molto semplice di coppie chiave-valore. Per fare qualcosa di più complicato con i valori restituiti (come visualizzare un grafico a stelle), è necessario afferrare tutti i valori e quindi scorrere su di essi. [Visualizza il codice qui]:

Nell'esempio sopra, sto controllando ogni nome di campo personalizzato (il $ chiave) per vedere se si chiama "Livello’. Se è chiamato livello, invece di ripetere semplicemente il valore del campo, sto visualizzando un diverso elemento grafico basato sul contenuto. Per qualsiasi altro campo personalizzato, sto facendo eco al valore così com'è, insieme al nome del campo (che è esattamente ciò che the_meta () lo fa). Ora la mia pagina del singolo prodotto è simile a questa:

Lo lascerò lì per le visualizzazioni dei singoli prodotti, poiché dipende davvero dal tuo tema e da ciò che vuoi ottenere con esso. Per ora, passiamo a un widget della barra laterale per visualizzare... i 3 prodotti con il punteggio più alto nel database?

Aggeggio

Per fare questo, ho leggermente modificato il codice che ti ho dato prima nel post Come scrivere un widget WordPress di base Come creare i tuoi widget Wordpress di baseMolti blogger cercheranno il widget Wordpress perfetto che farà esattamente quello che vogliono, ma con una piccola esperienza di programmazione potresti trovare più facile scrivere il tuo widget personalizzato. Questa settimana avrei ... Leggi di più , ma invece di mostrare un singolo post casuale, l'ho modificato con il seguente [visualizza il codice completo qui]:

Questo mi darà 3 post disposti in modo simile allo screenshot di esempio qui sotto. Se non vedi nessuno dei tuoi prodotti visualizzati, controlla attentamente la sezione che dice & meta_key = Valutazione per assicurarti di avere effettivamente una meta chiave con quel nome. Nota come ho anche scelto di visualizzare le meta info associate a quel prodotto insieme alla miniatura in primo piano, ma puoi modificare quel particolare blocco di codice per mostrare quello che ti piace.

Archivi o elenchi di prodotti

Infine, volevo anche creare una pagina di indice / archivio, in modo che visitassi http://yourdomain.com/products/ mostrerebbe un semplice elenco di tutti i prodotti, simile a un indice del blog. L'estratto di base + post stile miniature che ti ho mostrato come creare in Come aggiungere anteprime ai tuoi temi 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ù l'articolo è stato per lo più sufficiente, ma per personalizzarlo ho duplicato il file archive.php file nel mio tema e rinominato archive-products.php.

Se non hai già una pagina di archivio, basta duplicare index.php e rinominalo in archive-products.php. Ancora una volta, modificando la riga delle meta-informazioni dell'articolo e aggiungendo una chiamata al the_meta () da qualche parte, ho ottenuto questo:

Ovviamente, sembra un po 'sciocco con entrambi gli archivi e la barra laterale, e potrebbe fare con un po' più di regolazione dello stile, ma lo lascerò a te!

Questo è tutto da me oggi. È possibile visualizzare il codice completo completo online qui - basta copiare e incollare o scaricare l'intera cosa in un file chiamato products.phpe posizionalo nella directory dei plug-in. Ora dovresti essere in grado di espandere potenzialmente il tuo blog WordPress in un database di qualsiasi cosa! È difficile rispondere ai singoli problemi che potresti avere, ma ti preghiamo di pubblicare nei commenti se desideri un aiuto o desideri mostra il tuo apprezzamento: un tweet o un like di Facebook sarebbero molto apprezzati, o anche una menzione sul tuo blog se decidi di implementare Questo. Grazie per aver letto e non dimenticare tutti gli altri Tutorial per WordPress noi abbiamo!