テーマオプションを設定する方法 [wordpress]

フリーのブログテーマなんぞを使う時に テーマオプションが設定出来ると 少し得した気分になります。

有名所ではカスタムヘッダーと背景でしょうか。

今回は、それに加えて様々なオプションを手軽に付けられる方法を紹介します。

 

ヘッダー画像をテーマオプションで変更できるようにする

下記のコードをfunctions.phpに加えます。

// カスタムヘッダー
define('HEADER_TEXTCOLOR', 'ffffff');// 画像の上ににテキストを乗せる時の色指定
define('HEADER_IMAGE', '%s/images/default_header.png');//デフォルトで表示させる画像ファイル
define('HEADER_IMAGE_WIDTH', 1000);// 画像の幅サイズを指定します
define('HEADER_IMAGE_HEIGHT', 287);// 画像の縦サイズを指定します
define('NO_HEADER_TEXT', true );

// サイト用に出力するCSS
function header_style() {
	?><style type="text/css">
			</style><?php
}

// 管理画面用に出力するCSS
function admin_header_style() {
	?><style type="text/css">
		#headimg {
			width: <?php echo HEADER_IMAGE_WIDTH; ?>px;
			height: <?php echo HEADER_IMAGE_HEIGHT; ?>px;
		}
	</style><?php
}

add_custom_image_header('header_style', 'admin_header_style');

テンプレートのヘッダー画像を表示させたい箇所に下記コードを入力
<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />

テーマオプションで背景を変更できるようにする方法

下記コードをfunctions.phpに加えます

add_custom_background();

   // show return top link
      if ($_POST['return_top']) {
      $options['return_top'] = (bool)true;
      } else {
      $options['return_top'] = (bool)false;
      }

これだけで背景の色や画像をテーマオプションで設定出来るようになります。

その他テーマオプションを設置する方法

現在フリーで提供するブログテーマ制作を依頼されているのですが
ヘッダーやフッターにTitter等のアイコンを付けて テーマオプションでアカウントを入力すればリンクされるというのを作ったので、それを例に紹介します。

テーマに簡単に加えられるPHPを配布しているサイトがありますので まずは下記サイトから”Theme options theme”をダウンロードします。
Theme options theme→

ダウンロードしたらtheme-options.phpというファイルがあるので、それをテーマフォルダにアップロードします。
※プラグインではありません。テーマフォルダーにアップしましょう。

アップロードが終わるとテーマ編集にtheme-options.phpが現れますのでそれを編集します。

theme-options.phpにはあらかじめオプションの記述例がありますので それを参考にカスタマイズしてください。
たとえば テンプレートにFacebookのアイコンを付けて そのリンク先をテーマオプションで設定したい時はtheme-options.phpに下記のように加えます。

<?php
				/**
				 * Facebook
				 */
				?>

           <tr valign="top"><th scope="row"><?php _e( 'Facebookアカウント', 'sampletheme' ); ?></th>
					<td>
						<input id="sample_theme_options" class="regular-text" type="text" name="sample_theme_options" value="<?php esc_attr_e( $options['facebook'] ); ?>" />
						<label class="description" for="sample_theme_options"><?php _e( 'FacebookのフルURLを入力してください', 'sampletheme' ); ?></label>
					</td>
				</tr>

これでテーマオプションにFacebookという設定項目が表示されます。テーマオプションで設定した内容をテンプレートに呼び出したい時は下記のコードをテンプレートに加えます。

<?php
    $options = get_option('sample_theme_options');
    echo $options['facebook'];
?>

この場合はリンク先のURLを指定しているので <a href=”テーマオプション呼び出しコード”>アイコンの画像</a>などとします。
もっと便利なカスタマイズ方法が沢山あるのでしょうが 色々研究して また紹介します。

may the force be with you…