WordPress, WP ヒント

WordPress テーマの詳説：第三章

1件のコメント

ステップ２ – サイドバー各セクション

検索

検索フィールドは、あまり利用されないとはいえ、どんなウェブサイトにとっても重要な機能だ。 頻繁に訪れる読者は、以前の記事を参照するのにアーカイブや一般的な検索エンジンでの検索に時間を使いたがらないだろう。 初めての読者が検索機能を使用することはなさそうだが、検索機能はいつもあった方がいい。

私個人の意見では、検索フィールドをサイドバーの一番上に置くのは重要視し過ぎだと思う。 私たちの多くは、左から右へ、上から下へ読んでいく。そして検索フィールドは、使用するは最後なのに、サイドバーで最初に目にする。 これは簡単に変更することができるので一番下の位置に置くことにしよう：

    <?php /* If this is the frontpage */ if ( is_home() || is_page() ) { ?>       

      <?php get_links_list(); ?>

     
      <li><h2><?php _e(‘Meta’); ?></h2>

      <ul>

        <?php wp_register(); ?>
        <li><?php wp_loginout(); ?></li>

        <li><a href=“http://validator.w3.org/check/referer” title=“<?php _e(’This page validates as XHTML 1.0 Transitional’); ?>”><?php _e(‘Valid <abbr title=”eXtensible HyperText Markup Language”>XHTML</abbr>’); ?></a></li>

        <li><a href=“http://gmpg.org/xfn/”><abbr title=“XHTML Friends Network”>XFN</abbr></a></li>
        <li><a href=“http://wordpress.org/” title=“<?php _e(’Powered by WordPress, state-of-the-art semantic personal publishing platform.’); ?>”>WordPress</a></li>

        <?php wp_meta(); ?>
      </ul>

      </li>

    <?php } ?>
   

    <li>
      <?php include (TEMPLATEPATH . ‘/searchform.php’); ?>

    </li>

  </ul>
</div>

これでサイドバーを見てみると検索フィールドは一番下の項目になった：

検索フィールド自身はサイドバー内に定義されているわけではなく、searchform.php からインクルードされている。 その中身は次のようになっている：

<form method=“get” id=“searchform” action=“<?php echo $_SERVER[’PHP_SELF’]; ?>”>

  <div>

    <input type=“text” value=“<?php echo wp_specialchars($s, 1); ?>” name=“s” id=“s” />

    <input type=“submit” id=“searchsubmit” value=“Search” />
  </div>

</form>

これを別ファイルに分ける価値があるのか否かは議論の余地があるが、どちらにしろ変更する必要はない。

著者の情報

ブログというのは、私たちの多くの内（うち）にある潜在的なのぞき趣味を明らかにすることがある。 たくさんのブログが何らかの「私について – about me」のリンクを持っていて、そこには自分自身、私生活、そのブログの目的、趣味、そして著者が公開したいと望んでいるその他諸々のことについて書かれている。

人によってはこれをさらに進めて、サイドバーに写真付きの略歴を追加したりしている。 デフォルトでは無効になっているものの、Kubrick テーマも著者情報を提供することができる：

<!– Author information is disabled per default. Uncomment and fill in your details if you want to use it.

<li><h2>< ?php _e(‘Author’); ?></h2>

<p>A little something about you, the author. Nothing lengthy, just an overview.</p>
–>

この著者情報を表示させるのは簡単だ。 まず HTML のコメントタグを取り除く。

<li><h2>< ?php _e(‘Author’); ?></h2>

<p>A little something about you, the author. Nothing lengthy, just an overview.</p>
</li>

次にこの情報の中身をより適切なものに変更する。 ここではサイドバーにテキスト情報以外のものも置くことができるということをお見せするために、写真を入れてみた。

<li><h2><?php _e(‘Author’); ?></h2>

  <p>Born under a tree, shot into space; life as a monkey is a challenge.</p>

  <div id=“author”>
    <a href=“/about” title=“View my biography”>

      <img border=“0″ src=“<?php bloginfo(’template_url’) ?>/images/author.jpg” alt=“photo”/>

    </a>

  </div>
</li>
 

そしてこのためのスタイルは：

#author
{
  border: 1px solid #999;

  margin: 10px auto;

  text-align: center;
  width: 130px;
  padding: 2px;

}

#author img

{
  border: 0;
}

イメージにはより詳しい情報のための「アバウト – about」ページへのリンクを張った。 URL は適当なものに変更すること。 また、イメージは div で囲ってサイドバー内の中央にくるようにした。

では実際のサイドバーを見てみよう：

イメージは日本のテレビシリーズ「西遊記」からお借りした。

著者タイトルの表示に _e() 機能を使用していることに注目してほしい。 これは WordPress の国際化のための機能だ。 これ自身が翻訳を行うのではなく、翻訳された語句の辞書を提供し、キーワードを用いて参照する。 翻訳された語句がなければキーワード自身が使用される。 WordPress の標準準拠を維持するためにもこの方法を使い続けよう。

著者の略歴に置き換えられるものはたくさんある。 例えば、あなたのブログのさらに詳しい説明や、名言やイメージを入れてもいいだろう。 また、Flickr アルバムからランダムに写真を表示したりするような動的コンテンツをサイドバーに挿入するプラグインも多数ある。

コンテクスト特有情報

このセクションはそのブログ内の閲覧中のページに関する情報を提供する。 アーカイブのページを閲覧しているのなら何月もしくは何年のページなのかを表示し、 カテゴリーのページを表示しているのならそのカテゴリーの説明を表示する。

<li>
  <?php /* If this is a category archive */ if (is_category()) { ?>

  <p>You are currently browsing the archives for the < ?php single_cat_title(‘’); ?> category.</p>

 

  <?php /* If this is a yearly archive */ } elseif (is_day()) { ?>

  <p>You are currently browsing the <a href=“<?php echo get_settings(’siteurl’); ?>”>< ?php echo bloginfo(‘name’); ?></a> weblog archives

  for the day < ?php the_time(‘l, F jS, Y’); ?>.</p>
 

  <?php /* If this is a monthly archive */ } elseif (is_month()) { ?>

  <p>You are currently browsing the <a href=“<?php echo get_settings(’siteurl’); ?>”>< ?php echo bloginfo(‘name’); ?></a> weblog archives

  for < ?php the_time(‘F, Y’); ?>.</p>
 
  <?php /* If this is a yearly archive */ } elseif (is_year()) { ?>

  <p>You are currently browsing the <a href=“<?php echo get_settings(’siteurl’); ?>”>< ?php echo bloginfo(‘name’); ?></a> weblog archives

  for the year < ?php the_time(‘Y’); ?>.</p>
 

  <?php /* If this is a monthly archive */ } elseif (is_search()) { ?>

  <p>You have searched the <a href=“<?php echo get_settings(’siteurl’); ?>”>< ?php echo bloginfo(‘name’); ?></a> weblog archives

  for <strong>‘< ?php echo wp_specialchars($s); ?>’</strong>. If you are unable to find anything in these search results, you can try one of these links.</p>
 

  <?php /* If this is a monthly archive */ } elseif (isset($_GET[‘paged’]) && !empty($_GET[‘paged’])) { ?>

  <p>You are currently browsing the <a href=“<?php echo get_settings(’siteurl’); ?>”>< ?php echo bloginfo(‘name’); ?></a> weblog archives.</p>

 
  <?php } ?>
</li>

複雑に見えるが、このコードは、次のように要約できる：

カテゴリーなら

  • カテゴリーのタイトルを表示

アーカイブなら

  • アーカイブのタイプ（日、月、年、）を表示

検索結果なら

  • 検索語句を表示

複雑に見えるのは条件による選択を行うため HTML 内で PHP が使われているからだ：

<?php if (is_category()) { ?>

<p>You are currently browsing the archives for the < ?php single_cat_title(‘’); ?> category.</p>

<?php } elseif (is_day())

「you are currently browsing」というテキストが PHP 命令の if else に囲まれているのが分かるだろう。 PHP の括弧は重要で、間違った箇所に置くとエラーを引き起こすことがあるので注意すること。

サイドバーのその他のセクションと同じようにここも自由に変更することができる。 ここでの一番の問題は、どの分岐処理でも true が返ってこなければこのセクションは空のリスト項目を出力することだ。 エラーではない限り何も表示されない。

ページ: 1 2 3 4 5 6 7

「WordPress テーマの詳説：第三章」への1件のフィードバック

コメントは停止中です。