カテゴリー: Template tag

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

Jetpack入れたからwp_get_attachment_image_srcの戻り値が変わったの？

Yoko theme を使用しheaderに画像を出力していました。
いつの間にかアップロードした画像が出なくなったなーと思って調べてみたら、画像の出力元が i0.wp.com. i1.wp.com… に変わってました。
あ〜、Jetpackのどっかのアップデートで「wp.comから画像出力する？」みたいなこと聞かれたかも、かもかも。
CDNみたくしてくれるのねん、とOKしたなー。

う〜ん、でなんでheader画像はデフォルトのヤツだけなの？？？

if ( is_singular() &&
	current_theme_supports( 'post-thumbnails' ) &&
	has_post_thumbnail( $post->ID ) &&
	( $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) &&
	$image[1] >= HEADER_IMAGE_WIDTH
 ) :
 echo get_the_post_thumbnail( $post->ID , array(1102,350), array('class' => 'headerimage'));

$image = wp_get_attachment_image_src で取得した $image[1] に以前は画像幅（数値）が入ってて $image[1] >= HEADER_IMAGE_WIDTH 定数指定のサイズより大きかったらアップロードした画像を使う、ことになってたらしいす。

Jetpackを有効にすると $image[1] は常に false になります。
これじゃ出力できっこありません。

wp_get_attachment_image_src に Jetpack が何か細工をしてるようです。

探してみると class.photon.php, class Jetpack_Photon に記述を見つけました。
でもまだどうしたら良いのか見当もつきません。

Forumの“wp_get_attachment_image_src changed?”というトピックを見ると、やはり原因はJetpackでfilterを追加すると良いらしい。
回答者はJetpack作者なので間違いは無いと思うけど書かれてる方法では解決できません。

無い知恵しぼって考えた。

$jp_photon = Jetpack_Photon::instance();
remove_filter( 'image_downsize', array( $jp_photon, 'filter_image_downsize' ) );
 
if ( is_singular() &&
// 省略
 
endif;
 
add_filter( 'image_downsize', array( $jp_photon, 'filter_image_downsize' ), 10, 3 );

不細工だけど判定前にfilterをリムーブして判定後に元に戻しました。
header画像はwp.comからでは無くなったけど、しょうがないかなぁ。

もっとステキな方法があるはず。
教えて欲しいなー

WordPress, Category ArchiveでもStickyさせたい

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;

previous_post_link / next_post_link, 同じカテゴリの記事へリンク

WordPress, single.phpのナビゲーション、同一カテゴリの記事にリンクをはるテンプレートタグの記述方法で毎回右往左往するのでメモ。

previous_post_link('%link','%title', true);
next_post_link( '%link','%title', true);

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

テーマ内に置いた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つの方法

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;
 
// 投稿をリセット
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

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なグローバル変数

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

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

親テーマ 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

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">', 
    '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>

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