Pierwsze kroki z skrótami WordPress i przykładowymi fragmentami kodu

Skróty WordPress zostały wprowadzone w wersji 2.5 i pomagają tworzyć kody makr do wykorzystania w treści. Jeśli się nad tym zastanowisz, jest to świetny sposób na stworzenie czegoś w rodzaju dynamicznego miejsca reklamowego lub przycisku wezwania do działania w swoich postach.

Jeśli użyjemy przykładu wezwania do działania, możesz dodać coś takiego do swojego posta na blogu, aby wyświetlić przycisk, a następnie edytować wynik w pliku functions.php szablonów, do którego przejdziemy za chwilę.

 [button]

Aby dostosować przycisk, możemy po prostu dodać coś takiego:

 [button type="twitter"]

Lub żeby było jeszcze lepiej, moglibyśmy użyć załączonego shortcode:

 [button type="twitter"]Follow me on Twitter![/button]

Przy odrobinie wyobraźni szybko zdasz sobie sprawę z potencjału krótkich kodów i tego, co można z nimi zrobić. W tym artykule pokażę, jak tworzyć i używać tych trzech różnych typów krótkich kodów, a następnie pokażę kilka gotowych do użycia krótkich kodów do wykorzystania na własnej witrynie WordPress.

Tworzenie samozamykającego się shortcode

Najprostszym shortcodem jest samozamykający. Stworzymy prosty link do naszego konta na Twitterze, a następnie dodamy go do posta na blogu.

Cały kod trafia do functions.php , który znajduje się w /wp-content/themes/your-theme/ . Jeśli go nie masz, po prostu go utwórz i umieść w nim kod.

 <?php function button_shortcode() { return '<a href="http://twitter.com/filipstefansson" class="twitter-button">Follow me on Twitter!</a>"'; } add_shortcode('button', 'button_shortcode'); ?>

Stosowanie:

 [button]

Po prostu używając funkcji add_shortcode() , możemy połączyć dowolną funkcję PHP z naszym shortcode. W tym prostym przykładzie wszystko, co robimy, to zwracanie linku do naszego konta na Twitterze, ale przejdźmy o krok dalej i dodajmy kilka parametrów.

Tworzenie samozamykającego się shortcode z parametrami

Shortcode obsługuje parametry, co pozwala nam dostosować wyjście. W tym przykładzie mamy dwa różne przyciski, więc musimy zdefiniować, który przycisk chcemy pokazać.

 <?php function button_shortcode($type) { extract(shortcode_atts(array( 'type' => 'type' ), $type)); // check what type user entered switch ($type) { case 'twitter': return '<a href="http://twitter.com/filipstefansson" class="twitter-button">Follw me on Twitter!</a>'; break; case 'rss': return '<a href="http://example.com/rss" class="rss-button">Subscribe to the feed!</a>' break; } } add_shortcode('button', 'button_shortcode'); ?>

Teraz możesz wybrać przycisk do wyświetlenia, definiując type w swoim krótkim kodzie.

 [button type="twitter"] [button type="rss"]

To jest świetne. A co, gdybyśmy chcieli zmienić tekst? Moglibyśmy dalej dodawać typy shortcode, takie jak [button type="twitter-2"] i tak dalej, ale to nie jest zbyt dynamiczne, prawda? Zobaczmy, jak zrobić to we właściwy sposób.

Tworzenie załączonego shortcode

Załączony krótki kod pozwala na osadzenie treści w swoim krótkim kodzie, tak jak BBCode, jeśli kiedykolwiek go używałeś.

 <?php function button_shortcode( $attr, $content = null ) { return '<a href="http://twitter.com/filipstefansson" class="twitter-button">' . $content . '</a>'; } add_shortcode('button', 'button_shortcode'); ?>

Aby użyć tego skrótu, osadzasz tekst, którego chcesz użyć w następujący sposób:

 [button]Follow me on Twitter![/button]

Aby ten przycisk był jeszcze lepszy, moglibyśmy dodać parametry, tak jak to zrobiliśmy w poprzednim przykładzie. Tym razem dodajmy dwa parametry, jeden dla nazwy użytkownika Twittera, a drugi dla stylu przycisku. Następnie możemy mieć różne typy przycisków i wybrać, z jakim kontem na Twitterze chcemy połączyć przycisk.

 <?php function button_shortcode( $atts, $content = null ) { extract( shortcode_atts( array( 'account' => 'account', 'style' => 'style' ), $atts ) ); return '<a href="http://twitter.com/' . esc_attr($account) . '" class="twitter-button ' . esc_attr($style) . '">' . $content . '</a>'; } add_shortcode('button', 'button_shortcode'); ?>

Stosowanie:

 [button account="filipstefansson" style="simple"]Follow me on Twitter![/button] // Result: <a href="http://twitter.com/filipstefansson" class="twitter-button simple">Follow me on Twitter!</a>

Teraz mamy konfigurowalny przycisk, który możemy połączyć z dowolnym kontem na Twitterze. Jestem pewien, że rozumiesz, że możesz stworzyć znacznie bardziej zaawansowane skróty niż to, ale to dobry początek.

Skróty w widżetach i plikach szablonów

Teraz, gdy zobaczyłeś moc skrótów, prawdopodobnie zastanawiasz się, dlaczego nie możesz ich używać w swoich widżetach i plikach szablonów. Okazuje się, że możesz.

Aby aktywować skróty w swoich widżetach, po prostu umieść następujący kod w functions.php:

 add_filter('widget_text', 'do_shortcode')

Aby użyć skrótu w plikach szablonów, możesz uzyskać do nich dostęp za pomocą:

 do_shortcode("[button]");

Gotowe do użycia zwarcia

Oto kilka fajnych skrótów, które możesz zaimplementować od razu.

Kod w postach

Jeśli prowadzisz bloga, który koncentruje się na programowaniu, prawdopodobnie chcesz wyświetlać kod w swoich postach.

 function code_shortcode( $attr, $content = null ) { $content = clean_pre($content); // Clean pre-tags return '<pre"><code>' . str_replace('<', '<', $content) . // Escape < chars '</code></pre>'; } add_shortcode('code', 'code_shortcode');

Stosowanie:

 [code]<?php echo 'Hello World!'; ?>

Osadzaj AdSense w dowolnym miejscu swoich postów

Dzięki temu skrótowi możesz dodać reklamę Google w dowolnym miejscu swoich postów, używając po prostu [adsense] .

 function showads() { return '<script type="text/javascript"><!-- google_ad_client = "pub-3637220125174754"; google_ad_slot = "4668915978"; google_ad_width = 468; google_ad_height = 60; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> '; } add_shortcode('adsense', 'showads');

Osadź film z YouTube

Ten krótki kod pozwoli Ci umieszczać filmy z YouTube w swoich postach na blogu.

 function youtube($atts) { extract(shortcode_atts(array( "value" => 'http://', "width" => '475', "height" => '350', "name"=> 'movie', "allowFullScreen" => 'true', "allowScriptAccess"=>'always', "controls"=> '1', ), $atts)); return '<object style="height: '.$height.'px; width: '.$width.'px"><param name="'.$name.'" value="'.$value.'"><param name="allowFullScreen" value="'.$allowFullScreen.'"><param name="allowScriptAccess" value="'.$allowScriptAccess.'"><embed src="'.$value.'" type="application/x-shockwave-flash" allowfullscreen="'.$allowFullScreen.'" allowScriptAccess="'.$allowScriptAccess.'" width="'.$width.'" height="'.$height.'"></object>'; } add_shortcode("youtube", "youtube");

Stosowanie:

 // Optional attributes: width, height, name, allowFullScreen, allowScriptAccess, controls [youtube value="http://www.youtube.com/watch?v=1aBSPn2P9bg"]

Paypal skrócony kod darowizny

To jest krótki kod, który pomaga tworzyć linki do darowizn na Twoje konto Paypal.

 function donate_shortcode( $atts, $content = null) { global $post;extract(shortcode_atts(array( 'account' => 'your-paypal-email-address', 'for' => $post->post_title, 'onHover' => '', ), $atts)); if(empty($content)) { $content='Make A Donation'; } return '<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_xclick&business='.$account.'&item_name=Donation for '.$for.'" title="'.$onHover.'">'.$content.'</a>'; } add_shortcode('donate', 'donate_shortcode');

Stosowanie:

 [donate] [donate]Donate Now[/donate] [donate account="[email protected]" onHover="Thanks" for="Title"] [donate account="[email protected]" onHover="Thanks" for="Title"]Donate Now[/donate]

Prywatna notatka do autorów

Ten ostatni jest sprytny. Za pomocą tego skrótu możesz tworzyć notatki w swoich postach, które widzą tylko autorzy.

 function sc_note( $atts, $content = null ) { if ( current_user_can( 'publish_posts' ) ) return '<div class="note">'.$content.'</div>'; return ''; } add_shortcode( 'note', 'sc_note' );

Wniosek

Po przeczytaniu tego artykułu mam nadzieję, że pokochasz skróty WordPressa tak samo jak ja i mam nadzieję, że zaczniesz je wdrażać na swoim własnym blogu.