WordPress: minunea numită Shortcode


Folosiţi WordPress? Vă place WordPress? S-ar putea să faceţi parte din categoria celor modeşti care se consideră simpli „exploatatori” a ceea ce oferă nativ WordPress. Unde nu vă place ceva, căutaţi un plugin. WordPress 2.5 a introdus însă o facilitate remarcabilă – despre care da, ajung să scriu abia acum, deşi doream de mai multe luni – numită Shortcode. Pentru cei care scriu pluginuri istoria se împarte în pre-shortcode şi după-shortcode. Nu glumesc. Facilitatea este atât de remarcabilă încât merită toată atenţia. Cine prinde „şpilu” poate apoi scrie pluginuri uşor (trebuie doar minime cunoştinţe de PHP). Şi, mare atenţie, nu mă refer neapărat la pluginuri publice. Mă refer la pluginuri în care să îţi rezolvi facilităţile de care TU ai nevoie.

Şi ca să nu o lungim, trecem la acţiune. Avem un cod care, dincolo de bla-bla-ul comentariu (e stas pentru pluginuri) conţine doar două lucruri. În linia 13, după cum putem „citi”, am add-ăugat un shortcode pentru „iute”. Puteam scrie şi „ceapă” sau „pian” dacă vroiam. Ideea este că primul parametru al funcţiei add_shortcode defineşte cuvântul cheie care declanşează funcţia indicată ca al doilea parametru. Şi vedeţi mai jos şi o funcţie banală, care nu face altceva decât să returneze un string.

<?php
/**
Plugin Name: ShortcodeECoolA
Author URI: http://www.cnet.ro
Plugin URI: http://www.cnet.ro
Description: Doar de teste
Author: Eu insumi
Version: 9.9
*/
function functiaIute($atts, $content=null) {
   return "Ia să vedem <em>dacă</em> merge!";
}
add_shortcode('iute', 'functiaIute');
?>

Am pluginul, l-am pus în wp-content/plugins şi l-am activat. Acum pot merge să scriu un articol în WordPress în care voi pune cuvântul cheie între paranteze drepte. Adică voi scrie [iute]. Când încarc articolul cu pricina nu voi vedea [iute] ci rezultatul funcţiei. Vedeţi mai jos!

E genială ideea! De ce? Până la WP 2.5 pentru a interveni într-un articol cu propria ta funcţie trebuia să faci un match cu o expresie regulară. Uşor pentru cine ştie. Oribil pentru toţi ceilalţi. Cu shortcode WP devine manipulabil de către oricine. Exemplul meu pare stupid, dar să zicem ceva ce poate avea ceva mai mult sens: în blogul Dvs scrieţi frecvent un bloc de vreo 5-10 rânduri (habar nu am ce e, poate o adresă, o semnături, datele unui cont bancar… ceva ce e lung şi enervat să tot rescrieţi). Cu exemplul de mai sus, în loc să scrieţi de exemplu adresa de nu ştiu câte rânduri vă puteţi defini un shortcode şi veţi scrie doar [adresamea]. Dar aplicaţiile merg mult mai departe.

Şi vă propun ceva cât se poate de concret. Să ne facem un plugin pentru inserat… să zicem clipuri YouTube. Desigur, sunt zeci de pluginuri ce fac aşa ceva, dar de ce să nu ne facem noi unul aşa cum ne place nouă? Oare cât de greu este? Mergem pe YouTube şi la un clip, orice clip, ne configurăm după plac (cu margine, dacă da ce culoare, dacă să includă related videos sau nu…). Copiem apoi codul şi îl folosim ca mai jos.

<?php
/**
Plugin Name: ShortcodeECoolB
Author URI: http://www.cnet.ro
Plugin URI: http://www.cnet.ro
Description: Doar de teste
Author: Eu insumi
Version: 9.9
*/
function functiaYT($atts, $content=null) {
	extract(shortcode_atts(array('id' => ''), $atts));
	return '<object width="425" height="349"><param name="movie" '.
	'value="http://www.youtube.com/v/'.$id.'&hl=en&fs=1&rel=0&color1=0xe1600f&color2=0xfebd01&border=1">'.
	'</param><param name="allowFullScreen" value="true"></param><embed '.
	'src="http://www.youtube.com/v/'.$id.'&hl=en&fs=1&rel=0&color1=0xe1600f&color2=0xfebd01&border=1" '.
	'type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="349"></embed></object>';
}
add_shortcode('yt', 'functiaYT');
?>

Practic am făcut două lucruri. De returnat am returnat codul YouTube doar că în locul ID-ului clipului am pus variabila $id. Această variabilă primeşte valoare în linia 11 (implicit vid, dar puteţi scrie ce doriţi Dvs). Şi am ajuns astfel la şi mai marea putere a shortcode-urilor: parametri. Ştiţi cum funcţionează pluginul de mai sus? Intuiţi deja că e vorba de ceva de genul [yt]. Doar că acum îi mai punem şi un parametru ca să ştie ce clip să afişeze. De exemplu [yt id=bLiX5d3rC6o] conduce la ceva ca în captura următoare. Cu un astfel de plugin inserarea unui clip YouTube se reduce la a scrie [yt id=…] unde în loc de puncte puncte punem ID-ul clipului (e ceea ce vine după http://www.youtube.com/watch?v=).

Vrem să fim mai flexibili? Hei, doar noi comandăm aici lucrurile! Cu shortcode e uşor. Să introducem mai mulţi parametri! Vrem să putem decide în orice moment culorile şi dimensiunea afişării clipului. După cum vedeţi în codul de mai jos, am introdus nişte valori implicite. Aceasta înseamnă că cu codul de mai jos putem indica un clip YouTube în orice variante de omitere a ultimilor trei parametri (ID-ul e evident esenţial). Deci putem foarte bine scrie [yt id=…] ca înainte, dar şi [yt id=… c1=… c2=… w=…] (la c1 şi c2 culorile trebuie să fie în hexa) sau [yt id=… w=…].

<?php
/**
Plugin Name: ShortcodeECoolC
Author URI: http://www.cnet.ro
Plugin URI: http://www.cnet.ro
Description: Doar de teste
Author: Eu insumi
Version: 9.9
*/
function functiaYT($atts, $content=null) {
	extract(shortcode_atts(array('id' => '-','c1'=>'e1600f','c2'=>'febd01','w'=>'425'), $atts));
	$h=ceil($w*349/425);
	return '<object width="'.$w.'" height="'.$h.'"><param name="movie" '.
	'value="http://www.youtube.com/v/'.$id.'&hl=en&fs=1&rel=0&color1=0x'.$c1.'&color2=0x'.$c2.'&border=1">'.
	'</param><param name="allowFullScreen" value="true"></param><embed '.
	'src="http://www.youtube.com/v/'.$id.'&hl=en&fs=1&rel=0&color1=0x'.$c1.'&color2=0x'.$c2.'&border=1" '.
	'type="application/x-shockwave-flash" allowfullscreen="true" width="'.$w.'" height="'.$h.'"></embed></object>';
}
add_shortcode('yt', 'functiaYT');
?>

În captura de mai jos vedeţi rezultatul pentru apelul [yt id=bLiX5d3rC6o c1=dae5f0 c2=396491 w=550].

Dacă vi s-a părut interesant, atunci e timpul pentru un ultim cod. Doar să daţi pagina vă rog.


Pagini: 1 2

Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (4 evaluări, media: 5,00 din 5)
Loading...Loading...

0 comentarii


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *