WordPress 検索フォームをショートコードで挿入する

Last Updated: 2015 年 08 月 22 日 댓글

WordPress 検索フォームをショートコードで挿入するadd_shortcodeを介してショートコードの関数を作ってくれればされます。

function wpbsearchform( $form ) {

$form = '<form role="search" method="get" id="searchform" action="' . home_url( '/' ) . '" >
<div><label class="screen-reader-text" for="s">' . __('Search for:') . '</label>
<input type="text" value="' . get_search_query() . '" name="s" id="s" />
<input type="submit" id="searchsubmit" value="'. esc_attr__('Search') .'" />
</div>
</form>';

return $form;
}

add_shortcode('wpbsearch', 'wpbsearchform');

// Source: http://www.wpbeginner.com

上記の関数を関数ファイルに追加するようにします。 そして次のショーのコードを好きなところに追加して下さい。

{wpbsearch}

*上記の{...}は[...]に置き換えてください。

上記のショートコード関数でclass要素は、現在使用しているテーマに応じて適宜追加いただいてもされて、または既存のCSSスタイルを新たに追加する検索フォームに適用もできます。

注:add_shortcode

add_shortcodeの詳細については、こちらを参照してください。

参考までに、次のようなadd_shortcode関数を関数ファイルに追加すると、{high}...{/high}を使用して希望のフレーズを蛍光ペンにハイライトできます({...}も同様に[...]に変更します。 )。

add_shortcode('high', 'highlighter_span_shortcode');
function highlighter_span_shortcode($atts, $content = null) {
extract(shortcode_atts(array('color' => '', 'bg' => 'yellow', 'size' => '', 'top' => '', 'right' => '', 'bottom' => '', 'left' => ''), $atts));
$return = '<span style="';
if (!empty($color)) $return .= 'color:'.$color.';';
if (!empty($bg)) $return .= 'background-color:' .$bg.';';
if (!empty($size)) $return .= 'font-size:'.$size.';';
if (!empty($left)) $return .= 'padding-left:'.$left.';';
if (!empty($right)) $return .= 'padding-right:'.$right.';';
if (!empty($top)) $return .= 'padding-top:'.$top.';';
if (!empty($bottom)) $return .= 'padding-bottom:'.$bottom.';';
$return .= '">';
return $return . $content . '</span>';
}

このショートコード関数とwpbsearchformショートコードの関数を見てみるとadd_shortcode関数を使用する基本的な方法を理解することができるようになります。

ワードクラッカーのアバター画像

ワードクラッカー

プロの英国翻訳家。 WordPress 愛好家。 Naver カフェ 「ワープ社」 操作。

コメントを残す

コメントを残す

カカオトーク相談 カトクサービス相談