Category Archives: Template tag

Wordpressをカスタマイズするための第一歩

WordPress, Category ArchiveでもStickyさせたい

Posted on by
Reply

WordPressで投稿にSticky（先頭に表示）してもCategoryページだと反映されません。

で、次のようにしてみました。

// sticky
$args = array(
	'posts_per_page' => 1,
	'post__in'  => get_option( 'sticky_posts' ),
	'ignore_sticky_posts' => 1
);
query_posts( $args );
while ( have_posts() ) : the_post();
	get_template_part( 'content', get_post_format() );
endwhile;
wp_reset_query();
 
// 残りの投稿
$wp_query->query_vars['post__not_in'] = get_option( 'sticky_posts' );
query_posts( $wp_query->query_vars );
while ( have_posts() ) : the_post();
	get_template_part( 'content', get_post_format() );
endwhile;

【メモ】WordPress, テーマ内のJavaScriptをwp_enqueue_scriptに追加

Posted on by
Reply

テーマ内に置いたJavaScriptファイルをwp_enqueue_scriptで呼び出せるように設定する。

functions.php

function js_enque_method() {
   wp_register_script('example_script',get_bloginfo('template_url').'/js/example.js','jQuery','1.0');
   wp_enqueue_script('example_script');
}
add_action('wp_enqueue_scripts', 'js_enque_method');

テーマ内に[js]フォルダを作り、そのフォルダ内に[example.js]があります。
example.jsのVersionは1.0です。
example.jsはjQueryを必要とします。

WordPress, ループをカスタマイズする3つの方法

Posted on by
Reply

WordPressでループをカスタマイズするメモ。

query_posts()
http://wpdocs.sourceforge.jp/テンプレートタグ/query_posts

global $query_string;
// 全投稿出力
$posts = query_posts($query_string.'&posts_per_page=-1');
 
if (have_posts()) : while (have_posts()) : the_post();
   // ループ処理
   endwhile;
else;
   // not found
endif;
 
// ループをリセット
wp_reset_query();

オリジナルのループを元にカスタマイズしたい時に使用する。
wp_reset_queryを最後に実行する。

WP_Query()
http://wpdocs.sourceforge.jp/関数リファレンス/WP_Query

$args = array(
   'post_type'=>'page',
   'post__in' => array('595', '33', 44)
);
$query = new WP_Query($args);
 
while($query->have_posts()) : $query->the_post();
   // ループ処理
endwhile;
 
// queryをリセット
wp_reset_postdata();

オリジナルのループを作成、複数のループを作成。
wp_reset_postdataを最後に実行する。

get_posts
http://wpdocs.sourceforge.jp/テンプレートタグ/get_posts

$myposts = get_posts('posts_per_page=5&offset=1&category=1');
foreach($myposts as $post) :
   setup_postdata($post);
   // ループ処理
endforeach;

リセットはいらない。
引数は配列。

update 2012-03-19
get_posts の時Resetはいらないは間違い。
setup_postdataしてるのでResetしないと！

wp_reset_postdata();

ちゃんとリセットしてあげないと不幸が待ってる。

WordPress 3, sidebar.phpが無い時のget_sidebar

Posted on by
Reply

default テーマが添付されなくなった WordPress 3.0。

get_sidebar を実行した時に…
WordPress 3.0 以前では使用しているテーマに sidebar.php が無かったら default テーマの sidebar.php が使用されていました。

default テーマが無くなると、どうなるんだろうと思ったのですが抜かり無く代替え策が考えられていました。

sidebar.php が無いときは、
wp-includes/theme-compat/sidebar.php が使われます。

theme-compat には他に

comments-popup.php
comments.php
footer.php
header.php

が用意されています。

ただファイルのコメントに次のように書かれていたので、一時的な処置のようです。
ちゃんとテーマに footer.php, header.php, sidebar.php などは用意しておいた方が良さそうです。

This file is here for Backwards compatibility with old themes and will be removed in a future version

WordPress, Useragentなグローバル変数

Posted on by
1

WordPressはUseragentに関するグローバル変数を持っています。

$is_lynx
$is_gecko
$is_IE
$is_winIE
$is_macIE
$is_opera
$is_NS4
$is_safari
$is_chrome
$is_iphone

ブラウザーに合わせた設定を加えたい時とかに便利です。
もとネタ、
10 useful new WordPress hacks の
Detect the visitor browser within WordPress

さらにもとネタ
Browser Detection and the body_class() Function

add_filter('body_class','browser_body_class');
function browser_body_class($classes) {
	global $is_lynx, $is_gecko, $is_IE, $is_opera, $is_NS4, $is_safari, $is_chrome, $is_iphone;
 
	if($is_lynx) $classes[] = 'lynx';
	elseif($is_gecko) $classes[] = 'gecko';
	elseif($is_opera) $classes[] = 'opera';
	elseif($is_NS4) $classes[] = 'ns4';
	elseif($is_safari) $classes[] = 'safari';
	elseif($is_chrome) $classes[] = 'chrome';
	elseif($is_IE) $classes[] = 'ie';
	else $classes[] = 'unknown';
 
	if($is_iphone) $classes[] = 'iphone';
	return $classes;
}

body_classの出力するクラスへUseragentを入れとこうぜ、な関数ですよね。

/wp-includes/ -> vars.php (source)

WordPress, 親テーマfunctions.phpのaction, filterを子テーマでremove

Posted on by
Reply

WordPress3.0から使える親テーマ機能。
便利なんだけど、親テーマのfunctions.phpで設定されているactionやfilterを子テーマでremoveする方法が分からず悶々としてたけど、ようやく方法が分かりました。

本家Forum : [resolved] can i create child functions.php file for twentyten?
http://wordpress.org/support/topic/can-i-create-child-functionsphp-file-for-twentyten?replies=26

Adeptris さんによれば
after_setup_themeを使えば良いらしい。

/** Tell WordPress to run child_theme_setup()
when the 'after_setup_theme' hook is run.
*/
add_action( 'after_setup_theme', 'child_theme_setup' );
 
/** This function will hold our new calls and over-rides */
if ( !function_exists( 'child_theme_setup' ) ):
function child_theme_setup() {
 
}
endif;

関数 child_theme_setup にremoveを書けば対応できました。
感謝感謝です。

WordPress, 子テーマのための親テーマ作成の心構え – functions.php その2

Posted on by
Reply

親テーマ functions.php に add_filter されている関数を子テーマで変更することは困難を極めます。

読み込む順序が
1.子テーマ functions.php
2.親テーマ functions.php
になるからです。

これだと、いくら子テーマ functions.php で remove_filter しても意味がありません。
理論的には何らかの hook を使い最後の最後に remove_filter することは可能かもしれませんが、ワンクリック・インストールのWordPressらしくない解決方法に思えます。

親テーマの functions.php の関数は 全て functions_exists 判定 を入れることを必須条件にしてもらいたいものです。
そうすれば、子テーマでの変更はあっけないほど簡単にできます。
同名の関数を書けば良いだけですから。

Twenty Ten も一部の関数にしか判定が入っておらず不満が残ります。
というか、3.0対応テーマ作成の見本となるべきテーマなので早急に改善して欲しいです。

子テーマの子、孫テーマもありかな。

そうなると、配布テーマの functions.php の関数も 全て functions_exists 判定 が必須ですね。

update 2010-09-22
子テーマでremoveする方法があるので functions_exists が必須という訳では無さそうです。
でも、用意してくれてるとかなり嬉しい。

WordPress, 親テーマfunctions.phpのaction, filterを子テーマでremove

WordPress, wp_nav_menuのbefore, after と link_before, link_after

Posted on by
1

wp_nav_menuのbefore, after と link_before, link_after 用法が誤解を生みそうな件。

$before
（文字列） （オプション） リンクテキストの前のテキスト
初期値： なし

$after
（文字列） （オプション） リンクテキストの後のテキスト
初期値： なし

$link_before
（文字列） （オプション） リンクの前のテキスト
初期値： なし

$link_after
（文字列） （オプション） リンクの後のテキスト
初期値： なし

before と link_before の説明がどうもすっきりしない。

Usage:

<?php wp_nav_menu( array(
    'link_before' => '<span class="link_before">', 'link_after' => '</span>', 
    'before' => '<span class="before">', 'link_after' => '</span>', 
    'theme_location' => 'primary', 'depth' => '1' )
 );

Output:

<div class="menu">
    <ul>
        <li>
            <span class="before">
                <a href="/"><span class="link_before">Home</span></a>
            </span>
        </li>
    </ul>
</div>

出力結果をみても逆な気がしてしょうがない。

WordPress, wp_nav_menu+カスタムメニューのCSS設定

Posted on by
Reply

wp_nav_menu+カスタムメニューがナビゲーション・メニューを作るのに便利なことが分かってきた。
前回のPost : WordPress 3.x, wp_nav_menu コードを追ってみた

.menu の位置が状況によって変わるのでCSSの設定には注意が必要です。

Twentyten では次のように使われています。
header.php

wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' ) );

この時のHTML出力は以下のようになります。

カスタムメニューを使用しない場合

Output（１行で出力されているのをインデントを付けています）

<div class="menu">
    <ul>
        <li >
            <a href="http://me.beginsprite.com/" title="ホーム">ホーム</a>
        </li>
    </ul>
</div>

menu オプションを指定していないので、ul を wrap する div には class='menu' が設定されます。

Twentyten はデフォルトのページメニューを使用する場合 functions.php で 「ホーム」へのリンクを出力するように設定されています。

function twentyten_page_menu_args( $args ) {
	$args['show_home'] = true;
	return $args;
}
add_filter( 'wp_page_menu_args', 'twentyten_page_menu_args' );

カスタムメニューを設定した場合

<div class="menu-header">
    <ul id="menu-カスタムメニュー名" class="menu">
        <li >
            <a href="http://me.beginsprite.com/" title="ホーム">ホーム</a>
        </li>
    </ul>
</div>

class='menu' の位置が「カスタムメニュー」を使うと container タグ内 ul タグに設定されます。

配布テーマを作成する時は CSS 設定に充分な注意と配慮が必要になるでしょう。