スポンサーリンク

【WordPress】ショートコードの基本形

WordPress

WordPressでオリジナルのショートコードを作りたい場合の基本形について、忘れがちなので備忘録もかねて記載します。

WordPressショートコードの作成

function.phpなどに以下を追加します。

function ext_short_code($atts) {
    extract(shortcode_atts(array(
        'kw-google' => null, //デフォルトはnull
        'kw-yahoo' => 'fugafuga' //デフォルトは'fugafuga'
    ), $atts));
    $html = '<ul>';
    $html .= '<li><a href="https://www.google.com/search?q='.$kw-google.'">Google</a></li>';
    $html .= '<li><a href="https://search.yahoo.co.jp/search?p='.$kw-yahoo.'">Google</a></li>';
    $html .= '</ul>';

    return $html;
}
add_shortcode('search-link', 'ext_short_code');

(とりあえず出力されるHTMLは何の役にも立ちませんが。。。)

ショートコードの処理関数を作り、add_shortcode()関数を使って登録します。

add_shortcode()の第一引数がショートコード名になり、投稿編集画面にて角カッコを使って呼び出すことができます。

[search-link kw-google='hogehoge' kw-yahoo='']

ショートコードから渡される引数は、shortcode_atts()関数を通すことでユーザー指定の値とデフォルト値を結合した配列を取り出すことができます。

extract(shortcode_atts(array(
    'kw-google' => null, //デフォルトはnull
    'kw-yahoo' => 'fugafuga' //デフォルトは'fugafuga'
), $atts));

関数内でHTMLなどのコードを作ってreturnで返してあげれば、ショートコードを入力した場所にコードが反映されます。

また、phpからショートコードを呼び出すには do_shortcode() 関数を使用します。

do_shortcodeの第一引数にショートコードの文字列をそのまま渡せばOKですし、変数の組み合わせも可能です。

$html = do_shortcode('[search-link kw-google="'.$kw_g.'" kw-yahoo="'.$kw_y.'"]');
echo $html;

結果はhtmlの文字列などで返ってくるため、内容をechoで表示します。

WordPress&Cocoonのお悩みにお答えします

クラベルではWordPressのブログサイト構築、Cocoonテーマの導入やカスタマイズに関するご相談を承っております。

お困りの方はぜひ一度お問い合わせください。また、現在ココナラをつかったサービス出品も始めてみました。お悩みおひとつの解決からお手軽にお申込みできますので、こちらもぜひあわせてご覧ください。

最短当日★ワードプレスの疑問質問トラブル解決します ご相談無料!初心者歓迎!優しく丁寧、徹底的にサポートします!
Cocoonテーマサイト構築&カスタマイズします ご相談無料★公式サポート対象外もOK!プログラミングはお任せ
WordPressWeb開発
この記事は良かったですか?
最新情報をお届けします。
クラベル(Cravel)をフォローする
スポンサーリンク
この記事を書いた人
クラベル(Cravel)

Webサイト構築、Wordpressのカスタマイズやphpプログラミングなどやってます。BPM(ビジネスプロセス管理)、BPR(業務改革)コンサルなどにも従事。世の中すべてピタゴラ装置をモットーに自動化します。ブログは省エネ運営中。Cocoonカスタマイズやゲーム、ガジェットの話題など。

プロフィール詳細、お仕事のご依頼はこちら

クラベル(Cravel)をフォローする
クラベル

コメント

タイトルとURLをコピーしました