it.hideout-lastation.com
Paradiso Per Designer E Sviluppatori


Come creare i propri codici brevi WordPress

Gli shortcode sono una funzionalità molto potente di WordPress. In sostanza uno shortcode è un segnaposto per altri contenuti. Uno shortcode ben noto è lo shortcode della galleria integrato. Basta digitare nell'editor di WordPress e sarà sostituito da una galleria di immagini tratte dai media caricati sul post.

Sebbene l'uploader multimediale offra una bella interfaccia per creare una galleria, dietro le quinte, tuttavia, viene creato un shortcode, qualcosa del genere: . A seconda del tema, questo potrebbe apparire diverso sulla tua installazione, ma un possibile output potrebbe essere qualcosa del genere:

L'HTML che avresti bisogno di scrivere per far sì che ciò accada è piuttosto pesante; l'uso dello shortcode lo rende considerevolmente più veloce. Se hai bisogno di svolgere compiti ripetitivi nell'editor dei post o hai bisogno di un formato HTML specifico che richiede un po 'di tempo, potresti scoprire che il tuo shortcode può aiutarti.

In questo articolo ti mostrerò come funzionano gli shortcode e come puoi crearne uno attraverso alcuni semplici esempi.

Le basi di Shortcode

Come ho detto, gli shortcode vengono sostanzialmente rimpiazzati da altri contenuti che definisci. Diamo un'occhiata alle basi attraverso un esempio. Supponiamo che durante il tuo post tu voglia fare riferimento al proprietario del sito web.

"Secondo il proprietario della nostra società, Daniel Pataki, l'obiettivo principale del sito Web è generare un sacco di soldi, Daniel Pataki ritiene importante anche la condivisione".

Invece di scrivere "Daniel Pataki" potremmo usare uno shortcode.

"Secondo il proprietario della nostra azienda - [proprietario] - l'obiettivo principale del sito è generare un sacco di soldi. [Il proprietario] pensa che anche la condivisione sia importante."

Questo ci permetterebbe di cambiare il nome del proprietario in un'unica posizione, quindi nel caso in cui il proprietario cambi, tutte le istanze del nostro shortcode userebbero il nuovo nome.

La codifica di questo è in realtà piuttosto semplice. Dovremo utilizzare la funzione add_shortcode() per dire a WordPress del nostro shortcode e quindi creare la nostra funzione per gestire l'output:

 add_shortcode ('owner', 'owner_output'); function owner_output () {return 'Daniel Pataki'; } 

Nota che questo codice dovrebbe essere aggiunto al file functions.php del tuo tema o ai file del tuo plugin . Se stai utilizzando un tema di terze parti, ti consiglio di utilizzare un tema figlio.

La funzione add_shortcode richiede 2 parametri: il primo parametro è lo shortcode che WordPress cerca di far corrispondere - questo è ciò che scrivi tra parentesi quadre - il secondo parametro è il nome della funzione che gestisce l'output, che è completamente a noi.

All'interno della nostra funzione di gestione dell'output è necessario restituire l'output che vogliamo sostituire il nostro shortcode.

Attributi shortcode

È importante essere consapevoli che i nostri codici brevi possono anche utilizzare gli attributi. Ad esempio, se vuoi assicurarti che il proprietario del sito web sia mostrato in grassetto, puoi farlo creando un attributo denominato "bold" e quando questo è impostato su true, verranno aggiunti i tag HTML appropriati.

 add_shortcode ('owner', 'owner_output'); function owner_output ($ atts) {$ atts = shortcode_atts (array ('bold' => false), $ atts); if ($ atts ['bold'] == true) {return ' Daniel Pataki '; } else {return 'Daniel Pataki'; }} 

Questo sembra molto più intimidatorio, ma in realtà è abbastanza semplice. Innanzitutto, inizia a visualizzare come verrà utilizzato il tuo shortcode. Quando digiti il ​​tuo shortcode lo faresti:

[owner bold='true']

Ora sappiamo che avremo un attributo chiamato "grassetto".

Nella nostra funzione di gestione dell'output usiamo la funzione shortcode_atts() per analizzare tutti gli attributi e fornire alcuni valori predefiniti. Ci stiamo accertando che se non specifichi quale sia il valore di "bold", allora è impostato su false.

Quindi diamo un'occhiata al valore dell'attributo grassetto. Se è vero, restituiamo il nome del proprietario in un tag forte, altrimenti lo restituiamo così com'è.

Contenuto Shortcode

Il contenuto Shortcode viene solitamente utilizzato quando un po 'di contenuto deve ricevere una formattazione HTML speciale. Supponiamo che il tuo sito web usi titoli di fantasia come questo:

Il mio titolo

Questo è un titolo speciale che è un'intestazione di livello uno e contiene anche un'icona. Potremmo creare questo come shortcode usando la seguente formattazione:

[title icon='check']My Title[/title]

Tieni presente che stiamo utilizzando un tag di shortcode di apertura con alcuni parametri e un tag di shortcode di chiusura. Il contenuto all'interno (My Title) viene passato alla nostra funzione di generazione dell'output come secondo parametro.

 add_shortcode ('title', 'title_output'); function title_output ($ atts, $ content) {$ atts = shortcode_atts (array ('icona' => 'matita'), $ atts); ritorno ' 

'. $ contenuto. '

'; }

Come puoi vedere, l'icona predefinita è "matita", a meno che non sia definita nello shortcode. Il contenuto viene passato come secondo parametro e viene utilizzato come contenuto all'interno dell'intestazione di livello uno.

Usi pratici

Ci sono un gran numero di usi per i codici brevi da inserire cursori e gallerie in post, a timer conto alla rovescia e altri contenuti dinamici. Questi di solito richiedono alcuni Javascript e CSS per funzionare bene. In questi casi dipende dalla tua immaginazione e dalle tue abilità di codifica.

Ci sono un certo numero di cose che puoi fare per semplificarti la vita (anche come non programmatore), in modo da semplificare il processo di editing e di scrittura. Diciamo che scrivi recensioni di giochi e in ognuna devi inserire una tabella come questa:

TitoloSviluppatoreGenerePrezzoIl nostro verdetto
Mai soloUpper One GiochiIndie Casual Adventure$ 14.995/5

Anche se si copia-incolla questo articolo dall'articolo all'articolo, è una buona dose di spam rispetto alla quantità di contenuti che si sta aggiungendo. Potresti usare un semplice shortcode per portare a termine il lavoro:

[final_table title="Never Alone" dev="Upper One Games" genre="Upper One Games" price="14.99" rating="5"]

La tua funzione di output shortcode sarebbe responsabile di aggiungere l'intera tabella e altri bit di contenuto intorno a queste informazioni, qualcosa del genere:

 add_shortcode ('final_table', 'final_table_output'); function final_table_output ($ atts) {return ' 
TitoloSviluppatoreGenerePrezzoIl nostro verdetto
'. $ atts ['title']. ''. $ atts ['dev']. ''. $ atts ['genere']. '$ '. $ atts ['prezzo']. '5 / '. $ atts ['rating']. '
'; }

L'uovo di Pasqua di Natale

Quindi sei arrivato così lontano ed è quasi ora di Natale quindi ho pensato di includere un piccolo uovo di Pasqua. Christmas Countdown Widget è un plug-in che ti dà l'opportunità di aggiungere un conto alla rovescia natalizio a tema Babbo Natale al tuo sito web come widget della barra laterale o come shortcode.

Installa, attiva e usa [countdown] ovunque nel contenuto del tuo post per aggiungere Mr. Clause al tuo post.

Conclusione

Penso che i codici brevi siano grandi perché consentono ai non codificatori di semplificare i propri flussi di lavoro e possono aumentare di complessità man mano che si amplia la conoscenza della codifica. Suggerisco di provare a creare uno shortcode qua e là in quanto hai esigenze più complesse.

Per un elenco di tutti gli shortcode predefiniti, consulta la sezione Shortcode nel codice WordPress. Per maggiori informazioni date un'occhiata al Codex e potreste anche voler aggiungere un segnalibro allo Shortcode Generator che può far risparmiare alcune battute quando si creano le funzioni del generatore.

21 Google Maps Suggerimenti e trucchi da conoscere

21 Google Maps Suggerimenti e trucchi da conoscere

Google Maps è la mia app di go-to non appena esco di casa . Non solo per conoscere la mia strada, ma per le preziose informazioni che fornisce sul mio percorso. Ottengo informazioni sul traffico, imparo informazioni sui luoghi vicini, tieni sotto controllo il tempo e la distanza, programma il mio viaggio completo e molto altro ancora.

(Consigli tecnici e di design)

Animare facilmente il testo con Textillate.js

Animare facilmente il testo con Textillate.js

Nel nostro precedente, vi presentiamo Animate.css, una fantastica libreria CSS3, che semplifica la creazione di animazioni CSS3. In questo post vi presenteremo un plugin jQuery, creato utilizzando Animate.css, che è in grado di animare il testo, chiamato Textillate.js .Sebbene sia possibile animare il testo con Animate.

(Consigli tecnici e di design)