カテゴリー
WPカスタマイズ備忘録

カテゴリーのURLから「category/」を削除するプラグイン

私はほとんどのwordpressサイトで、パーマリンクの設定をーーーとしています。HTMLでサイトを作っていた頃の名残。。。

ところがwordpressではカテゴリーページ(category/index.html)のURLが、home/category/カテゴリースラッグ/index.html となるんですね。category/ が余計です。

htmlサイトをwordpressサイトに移行するときに、これが妨げになりプラグインで対応することにしました。

WP No Category Baseは最新のwordpressに対応していない

category/ を削除するプラグインとして有名なのが「WP No Category Base」です。私もずっと使っていました。

でも2012年のいつごろから、最新のwordpressのバージョンで使用できなくなりました。有効にしていても不具合はありませんが、category/ が削除されなくなったのです。

「WP No Category Base」はアップデートされていないので、wordpressのバージョンを落すか代わりを見つけないといけない。そこで知人が教えてくれたのが「WP No Category Base – WPML compatible」というプラグインです。

WordPress › WP No Category Base – WPML compatible « WordPress Plugins

「WP No Category Base」を停止して、「WP No Category Base – WPML compatible」をインストール、有効化するだけでOKです。

カテゴリー
WPカスタマイズ備忘録

画像の投稿への挿入でwidth、heightが自動挿入されないようにする方法

wordpressでは、画像をアップロードして、そこから簡単に記事に画像表示タグを貼りつけることができます。

とっても便利な機能ですが、スマホ対応のレスポンシブデザインにする際に一つ面倒なことがあり、それがwidthとheightの自動挿入でした。

いままでチマチマ手で消していましたが、忘れたり記事を書く担当の人がタグに詳しくなかったりするとちょっとした手間です。

function.phpに追記する方法にしました

そこで自動挿入されないようにする方法を取り入れました。

以下のコードをfunction.phpに追加するだけOKでした。


function remove_hwstring_from_image_tag( $html, $id, $alt, $title, $align, $size ) {
    list( $img_src, $width, $height ) = image_downsize($id, $size);
    $hwstring = image_hwstring( $width, $height );
    $html = str_replace( $hwstring, '', $html );
    return $html;
}
add_filter( 'get_image_tag', 'remove_hwstring_from_image_tag', 10, 6 );

※function.phpの最下行ではなく、「?>」の上に追加します。function.phpはバックアップしてからカスタマイズします。

wp-admin/includes/media.phpファイルを書き換える方法もあるそうですが(試していない)、wordpressのバージョンアップごとに書き換えないといけないのが面倒なので、function.phpに追記する方法にしました。

▼こちらのサイトからコードを貼りつけさせてもらいました。
WordPressの画像挿入時にwidthとheight指定が入らないようにする | Simple Colors

画像のHTMLソースにwidthが入らなくなったー♪

こちら、確認画像です。うれしー。

カテゴリー
WPカスタマイズ備忘録

カテゴリーごとに違うテンプレートを表示させる条件分岐の書き方

wordcamp東京2012で株式会社ベクターの鳥山優子さんが、企業サイトではカテゴリーごとに表示させたい内容が違うので、個別のテンプレートを用意するとよいと話されていました。

▼wordcamp東京2012のタイムテーブル
タイムテーブル | WordCamp Tokyo 2012

▼スライドはこちらで公開されています。
WordCamp Tokyo 2012 登壇しました | データベースに接続できません

手書きのHTMLサイトの場合はカテゴリートップページの内容が違っていることがあるので、これからwordpressに移行しようと思っている方なら、個人サイトの運営者であっても参考になる方法だと思いました。

【2012年9月20日 追記】最初に紹介した方法よりシンプルな方法を知りましたので、そちらを使うことにしました。

▼参考にさせていただいたサイト
WordPressテンプレートを各カテゴリ等で別々に使い分ける | フリーランスWebデザイナーの日記

デフォルトのカテゴリテンプレートは「category.php」ですが、特定のカテゴリ専用のカテゴリテンプレートのファイル名には「category-8.php」のように、ハイフンとカテゴリIDの数字をつけて保存するだけです。

とってもシンプル!

カテゴリーIDの調べ方

wordpress管理画面>投稿>カテゴリー で調べたいカテゴリーにマウスオーバー。

下にID=と表示された数字がカテゴリーIDです。

下に表示されない場合は、カテゴリーをクリックすると、URLに表示されます!

arcive.phpかcategory.phpに書くこと

【2012年9月20日 訂正】以下のやり方より簡単な方法を知りましたので、そちらに差し替えます。以下のやり方だと別に用意したテンプレートだけが読みこまれヘッダーやフッターが書けてしまうなどの不具合が出て(しかも一部のカテゴリーにだけ)しまったことも変更の理由です。

そこでさっそく作成中のサイトのwordpress以降で、カテゴリーごとに違うテンプレートを表示させる方法を取り入れました。

【作業1】
カテゴリーごとのテンプレートを用意する
⇒テキストファイルで表示させたい部分内容を書いて、category-css.php などの名前で保存する。保存するときの文字コードに注意(たいていutf8のはず)

【作業2】
arcive.php(category.phpがあるならそちらに)に違うカテゴリーテンプレートを読み込ませる記述をする。
⇒コードは以下の通りです

<?php
if ( in_category('★') ) {
	include(TEMPLATEPATH . '/category-css.php');
} else if ( in_category('★') ) {
	include(TEMPLATEPATH . '/★★★★');
} else {
	include(TEMPLATEPATH . '/category-base.php');
}
 ?>

WordPressのテンプレートをカテゴリ別に切り替える | webOpixelから引用させていただきました。

★の部分にはカテゴリーIDが入ります。
★★★★には作ったカテゴリーテンプレート名が入ります。

一つだけ違うテンプレートを表示させたい場合は、不要な行を消して書けばOK.

<?php
if ( in_category('★') ) {
	include(TEMPLATEPATH . '/category-css.php');
} else {
	include(TEMPLATEPATH . '/category-base.php');
}
 ?>

逆にもっと増やしたい場合は、

<?php
if ( in_category('★') ) {
	include(TEMPLATEPATH . '/category-css.php');
} else if ( in_category('★') ) {
	include(TEMPLATEPATH . '/★★★★');
} else if ( in_category('★') ) {
	include(TEMPLATEPATH . '/★★★★');
} else {
	include(TEMPLATEPATH . '/category-base.php');
}
 ?>
カテゴリー
WPカスタマイズ備忘録

カスタムテンプレートパーツを表示させるタグ

single.phpやarcive.phpに同じ内容で表示させているところがあるなら、テンプレートパーツにして、更新作業しやすくしたいもの(見やすいので楽になる)。

自分でカスタムテンプレートを増やすのは簡単で、好きな名前のphpファイルを作り、themesフォルダにアップロードするだけです。

自分で作ったテンプレートパーツを他のテンプレートsingle.phpやarcive.phpで読み込むには以下のタグを使います。

<?php include (TEMPLATEPATH . '/adspace.php'); 広告テンプレートの引用 ?>

▼以下の記事を参考にしました。
テンプレート入門 – WordPress Codex 日本語版

カテゴリー
WPカスタマイズ備忘録

the_excerpt()タグに<p>タグを表示させない方法

function.phpに以下を追記するだけで良いそうです。
※function.phpを書き換えるときはfunction.phpをバックアップしてからやる!

<?php
    // pタグ自動挿入解除
    remove_filter('the_excerpt', 'wpautop');
?>

▼参考にしたサイト
the_excerpt(抜粋・概要)タグでpタグを除外する方法。 | WordPress | H.I. Art Works [ Web Technology ]

カテゴリー
WPカスタマイズ備忘録

wordpressのトップぺージにRSS情報を表示する

wordpressのindex.php(トップページ)などに、他の運営サイトのRSSを利用したコンテンツを掲載するための基本コードをメモします。

コンテンツというよりは、新着記事情報を載せるだけ。
サイドバーに載せる場合は、RSSのURLを入れるだけでウィジェット表示できます。


<?php include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed(array(
'http://tabi.w-review.com/feed',
//RSSフィード1 フィードURLは改行して追記できます。

));
if (!is_wp_error( $rss ) ) :
    $rss->set_cache_duration(1800);
    $rss->init();
    $maxitems = $rss->get_item_quantity(10);
    $rss_items = $rss->get_items(0, $maxitems);
    date_default_timezone_set('Asia/Tokyo');
endif;
?>

    <?php if ($maxitems == 0) echo '<h2>No items.</h2>';
    else
    foreach ( $rss_items as $item ) : ?>
    <h2><a href='<?php echo $item->get_permalink(); ?>' target="_blank"><?php echo $item->get_title(); ?></a>
</h2>
<?php echo mb_substr(strip_tags($item->get_description()), 0, 100); ?>・・・<a href='<?php echo $item->get_permalink(); ?>' target="_blank">続きを読む</a>


<p class="postinfo">(<?php echo $item->get_date("Y-n-j H:i:s"); ?>)</p>
<?php endforeach; ?>

参考にさせてもらったサイトはこちらです。
複数外部RSSフィードをWordPressで表示 | 簡単ホームページ作成支援-Detaramehp

カテゴリー
未分類

iPhoneやandroidに別のテーマを表示させるプラグイン

WP-touchというプラグインでiPhoneに表示させていましたが、
WPtouchを卒業!!iPhoneに最適化されたテーマと簡単なカスタマイズ方法など[wordpress] | nori510.comで書かれているとおり、両端のスペースがもったいないし、何だか目障りなんですよね。

そこで、上記記事で紹介されていたWordPress ›WPtap Mobile Detectorという
iPhone、iPad,androidなどのテーマ設定・変更が可能なプラグインというのを導入することにしました。
※いまから作業するので、まだ使っていません。

とりあえず、WordPress › Ari « Free WordPress Themesというテーマを入れて、
それをiPhone用に使ってみることにします。

カテゴリー
未分類

WPの投稿一覧画面にサムネイルも表示しちゃう!

毎日ちょっとずつちょっとずつ、新しいこと試していくのは、やっぱり楽しい。
新しいこと(テクニックや方法)を知るきっかけは以外にも「検索」。

WPでトップページに、個別記事で使っている写真を表示する方法を調べたくて
「wp サムネイル」で検索したら、知った新しいことが
↓ ↓ ↓
投稿一覧にポストサムネールを表示させるんだ【WPハック】 | KRUZ-GRAPHIX

このサイトではなく、他の、自分でテーマを作っているサイトで試したら
無事成功しました。WP3.3.0ぐらいだったと思います。

以下のコードはそのまま貼らせてもらいました。


if ( !function_exists('fb_AddThumbColumn') && function_exists('add_theme_support') ) {

    // for post and page
    add_theme_support('post-thumbnails', array( 'post', 'page' ) );

    function fb_AddThumbColumn($cols) {

        $cols['thumbnail'] = __('Thumbnail');

        return $cols;
    }

    function fb_AddThumbValue($column_name, $post_id) {

            $width = (int) 35;
            $height = (int) 35;

            if ( 'thumbnail' == $column_name ) {
                // thumbnail of WP 2.9
                $thumbnail_id = get_post_meta( $post_id, '_thumbnail_id', true );
                // image from gallery
                $attachments = get_children( array('post_parent' => $post_id, 'post_type' => 'attachment', 'post_mime_type' => 'image') );
                if ($thumbnail_id)
                    $thumb = wp_get_attachment_image( $thumbnail_id, array($width, $height), true );
                elseif ($attachments) {
                    foreach ( $attachments as $attachment_id => $attachment ) {
                        $thumb = wp_get_attachment_image( $attachment_id, array($width, $height), true );
                    }
                }
                    if ( isset($thumb) && $thumb ) {
                        echo $thumb;
                    } else {
                        echo __('None');
                    }
            }
    }

    // for posts
    add_filter( 'manage_posts_columns', 'fb_AddThumbColumn' );
    add_action( 'manage_posts_custom_column', 'fb_AddThumbValue', 10, 2 );

    // for pages
    add_filter( 'manage_pages_columns', 'fb_AddThumbColumn' );
    add_action( 'manage_pages_custom_column', 'fb_AddThumbValue', 10, 2 );
}
カテゴリー
WPカスタマイズ備忘録

カスタムメニューの値を出力するコード

index.phpをカスタマイズするのに、かなり参考になったコードなので、メモ


<?php
$menu_items = wp_get_nav_menu_items('×××');
foreach($menu_items as $menu) :
    echo '[title] ' . $menu->title . ' (ID: '. $menu->object_id . ')<br />';
endforeach;
?>

×××のところに、メニューの名前を書く。

参考にさせていただいたサイト
wp_nav_menu:WordPress私的マニュアル

カテゴリー
WPカスタマイズ備忘録

カスタムメニューをindex.phpなどに表示する方法

wordpress3.XX以降に対応したというカスタムメニューは、けっこう便利です。

いままで、親カテゴリー、子カテゴリーって分けていました。わかりやすいように。

好きな食べ物(親カテゴリー)
 └納豆(子カテゴリー)
好きな本(親カテゴリー)
 └紫式部 源氏物語(子カテゴリー)
好きな旅行先(親カテゴリー)
 └離島(子カテゴリー)

それを、子カテゴリーだったのを親カテゴリーにして親カテゴリーは無しにする。そして、カスタムメニューを作っておいて、それをウィジェットで表示する。ウィジェットで表示するときに、ウィジェットのタイトルをいままでの”親カテ”にあたる名前にすればよいというわけです。

納豆(親カテゴリー)
紫式部 源氏物語(親カテゴリー)
離島(親カテゴリー)
  ↓ カスタムメニューで次の3つのメニューを作成
メニューの名前”foodmenu”
納豆(親カテゴリー)
メニューの名前”bookmenu”
紫式部 源氏物語(親カテゴリー)
メニューの名前”islandmenu”
離島(親カテゴリー)
  ↓ ウィジェットでカスタムメニューを使って
好きな食べ物(タイトル)
 └納豆(親カテゴリー)
好きな本(タイトル)
 └紫式部 源氏物語(親カテゴリー)
好きな旅行先(タイトル)
 └離島(親カテゴリー)

こんな感じです。

で、それをもっと使いまわそうと思って、wp_nav_menuの出番。

<?php wp_nav_menu( array('menu' => '×××' )); ?>

×××、のところは、カスタムメニューで設定した”メニューの名前”です。

これをたとえばindex.phpの好きなところに追記してやれば、そこにメニューが表示できるということです。

参考にしました。
WordPress のよくあるカスタマイズコード functions.php 多め
WordPress3.xでメニューをカスタマイズする(wp_nav_menu の出力を変更する方法) – [[ ist ]] mac,windows,ipod パソコン周辺機器 etc…

出力されるdivなどのクラス設定も可能なようです。
wp_nav_menu:WordPress私的マニュアル