WP:WordPress(ワードプレス)

WPのカテゴリーをドロップボックス形式で表示

カテゴリーをプルダウン形式(ドロップボックス)で表示させたい時、

wp_dropdown_categories()を使用すれば、

勝手にドロップボックスのHTMLを吐き出してくれるので楽です。

 

例えば、

wp_dropdown_categories("show_count=1&show_option_none=カテゴリーを選択");

とすれば、

件数付きでのドロップボックスになります。

 

また、タクソノミーで追加したカテゴリーをドロップボックス形式で吐き出したい場合には、

wp_dropdown_categories("taxonomy=タクソノミー名&show_count=1&show_option_none=カテゴリーを選択");

とするだけです。

 

ただ、

こいつ「option」の「value」に設定する値を自由に変更できません。

 

例えば、

valueにスラッグを設定した場合等もあると思います。

 

その場合は以下の様なコードを書いてやれば大丈夫です!!

 

例:「baibai」というカスタム投稿タイプに「building_type(物件種別)」というタクソノミーを追加したとします。

<?php $cats = get_categories(array("post_type" => "baibai","taxonomy" => "building_type")); ?>
<select>
<option value="">カテゴリー</option>
<?php foreach($cats as $cat): ?>
<option value="<?php echo $cat->slug; ?>"><?php echo $cat->cat_name; ?>(<?php echo $cat->count; ?>)</option>
<?php endforeach; ?>
</select>

 

因みに、

スマホサイトに設定する場合には、

選択すればそのまま選択ページのURLに飛んで欲しいですよね。

 

その場合は、

「value」にURLを設定して、

JavascriptでそのURLに飛ばすようなコードを書いてやれば簡単です。

 

Javascript部分はネット上で公開されていたコードのほぼコピペになりますが、

<?php $cats = get_categories(array("post_type" => "baibai","taxonomy" => "building_type")); ?>
<?php if(!empty($cats)): ?>

<select name="cat" id="cat">
<option value="">カテゴリーを選択</option>
<?php foreach($cats as $cat): ?>
<option value="<?php echo get_term_link("{$cat->slug}", "building_type"); ?>"><?php echo $cat->cat_name; ?>(<?php echo $cat->count; ?>)</option>
<?php endforeach; ?>
</select>

<script type="text/javascript">
<!--
var dropdown = document.getElementById("cat");
function onCatChange(){
    if(dropdown.options[dropdown.selectedIndex].value != ""){
        location.href = dropdown.options[dropdown.selectedIndex].value;
    }
}
dropdown.onchange = onCatChange;
-->
</script>

<?php endif; ?>

みたいなコードで、

恐らくいけます。

この記事を書いている人
株式会社ディープ
名前足立拓也

メールアドレスadachi@deep-deep.jp

関連記事

最近の記事

  1. ドメインについて
  2. WP:WordPress(ワードプレス)
  3. URL設計(URLデザイン)
  4. URL「ディレクトリ名」と文字アンダースコア(_)とハイフン(-)
  5. SEO対策(外部ファイルの読み込み)
  6. URL リダイレクト
  7. インデックスされない
  8. 内部対策は必要?
  9. CMS(シーエムエス)
  10. SEO業者は必要?

Twitter

アーカイブ

PAGE TOP