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

子テーマでテンプレートURLが正しく指定できなかったとき

子テーマにいつも通りのタグを使ったら親テーマのテンプレートURLが吐き出されて困ってる、時のメモです。

親テーマでは、header.phpなどに、

<?php echo get_template_directory_uri(); ?>

などを使って、スタイルシートのURLなどを指定することが多いと思いますが、子テーマでは、こちらです。

<?php echo get_stylesheet_directory_uri(); ?>

▼参考にさせていただきました。
マイペースクリエイターの覚え書き「WordPress3.0子テーマで、パス指定にbloginfo(‘template_url’)は使えない」

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

カスタムフィールドを記事で表示(出力)する方法のメモ

カスタムフィールドを記事で表示(出力)する方法のメモといより、タグに関する備忘録。

普通にテキストや画像URLを表示(出力)したいとき

カスタムフィールドのCODEXはこちらにありますが、テキストなんかを普通に出力する場合は、

get_post_meta($post->ID, 'cli_q_img', TRUE)

フィールドに記入した値が生のまま表示されます。フィールドにHTMLタグを使っているときはそれもそのまま表示されるので改行タグの扱いに困りました。

画像URL

画像をアップする場合は、まずアップロードしたファイルのidを取得してからURLを取得する二段構え(参照:フォーラムの「カスタムフィールドからの画像URL取得方法」)。


$fileid = get_post_meta($post->ID, フィールド名, false);
$fileurl = wp_get_attachment_url($fileid);
print $fileurl;

プラグイン「Advanced Custom Fields」を使っている場合

公式プラグイン「Advanced Custom Fields」を使っている場合は、独自のタグがあります。

get_field('フィールド名)

get_field(”)タグは、Advanced Custom Fieldsで設定した入力枠に記入した値が設定したとおりに出力されます。

HTMLを有効にしておけば、HTMLが効いた状態で出力されるし、自動的に改行タグを入れるよう設定してれば改行が自動で入ります。

画像URLは?

先ほどの画像URLは、Advanced Custom Fieldsのフィールド設定で、URLを取得するよう設定します。そしたら、

get_field('フィールド名)

これだけでURLが出力される。簡単だ。

▼Advanced Custom Fieldsのコードサンプル
http://www.advancedcustomfields.com/resources/getting-started/code-examples/

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

WP-PostViewsでサムネイル画像を表示するには

WP-PostViewsは人気記事をカウントし、表示してくれるプラグインです。

このプラグインは記事名とカウント数を表示させるのはデフォルトでできます。しかし、サムネイル(アイキャッチ画像)が表示されない!

検索結果:プラグインの直接編集

WP-PostViewsでサムネイルを表示する方法は検索するとたくさん出てきます。WP-PostViewsのファイル自体に記述を書き足す方法です。

参考にしてたのは、こちらのサイト。記述が正確で、書いてくださっている通り記述したらサムネイルが表示できました。

▼rhasm.net「WP-PostViewsプラグインで、アイキャッチ画像をサムネイルとして表示させる方法」
http://blog.rhasm.net/wpp-postviews-how-to-display-eyecatch/

プラググインを編集しない方法

上記の方法でうまくいったんですが、プラグインを直接編集しない方法はないのかなーと。プラグインを直接編集するとバージョンアップのたびに書き直さないといけなくて面倒ですよね。

しかし!ぱっと検索したところ、プラグインを直接編集しない方法はない模様。残念!!

プラグインの編集は、私の場合は6か所書き換える必要がありました。うまく表示されなかった方で、1か所しか編集していない人がいたら、ぜひ確認を!

カテゴリー
設定、サーバー関連

wordpressサイトの削除方法【minibird(ミニバード)の場合】

wordpressで作ったサイトやブログを削除する方法の、minibird編です。簡単な作業なので不要or邪魔になったサイトはこれでスッキリ削除できます。

【注意】
投稿があるサイトやブログは、config.phpやデータベースをバックアップしておくなど、気が変わった場合や間違って削除した場合に備えておくと良いです。昔、間違ってデータベースを削除して後悔した経験があります。

minibirdでのwordpressサイト削除はめっちゃ簡単でした

今回は、ネットオウルが運営する格安レンタルサーバー「minibird」で作ったサイトを削除することにしました。サイトはこんな条件でした。

  • サブドメインのサイト1つ
  • データベースはこのサイト専用のものを単独で使っていた
  • wordpressは、マルチドメインではなく、単一サイト用

作業の流れ

  1. サーバーからwordpress関連ファイルを削除する
  2. サーバーからデータベースを削除する

【手順1】サーバーからwordpress関連のフォルダやファイルを削除する

wordpressのファイルをサーバーから削除します。FTPソフトで削除してもよいのですが、今回は、サーバーの管理画面からweb-FTPを使って削除しました(こちらが良い方法というわけではありません)。

まずminibirdの管理画面にログインし、FTPアカウント設定を選択。削除したいサイトのドメイン名の「選択」をクリック。
minibirdからwordpressサイトを削除する手順1

次の画面で「ログイン」をクリックします。
minibirdからwordpressサイトを削除する手順2

消したいwordpressファイルやフォルダを見つけて、ゴミ箱マークをクリックします。
minibirdからwordpressサイトのフォルダを消す方法

↑ この写真ではフォルダ名が「wp」となっていますがこれは間違ってアップしたため。普通は「wp-content」など3つフォルダとそのほかのファイルいろいろを削除することになります。

※ゴミ箱マークをクリックしてから削除が完了するまで、数分かかりかかりました。

※※この時点では、データベースが残っているのでサイトを復活させられます。wp-config.phpだけダウンロードして保存しておくと復活の手間が楽になります。

【手順2】データベースを削除します

次にwordpressサイトで使っていたデータベースを削除します。これも簡単。

サイドバーから「データベース設定」を選択して、削除したいデータベースの右端の「削除」をクリックします。
minibirdでworpressのデータベースを削除する方法

「削除されるとデータベース内のデータは復元できません」と表示されますので、削除してよければ「OK」をクリック。これでデータベースの削除作業もおわりです。

複数のwordpressで一つのデータベースを使っている場合はダメです

上記の方法は、1つのwordpressで一つのデータベースを使っている場合の手順です。複数のwordpressで一つのデータベースを使っている場合は、削除の仕方も違いますので、この記事の方法では削除しないでください。

カテゴリー
未分類

スマホに専用テーマを適用するプラグインとエラー

レスポンシブデザインでwordpressのテーマを作ることがありますが、
トップページの表示内容(特にテキストの分量)やサイドバーの構成を
スマホはスマホで作りたいので、スマホ専用のテーマを作ることも多いです。
※パソコン用に作ったテーマの子テーマとして作ります。

そして、スマホにだけ、専用テーマを使って表示させるのに、
Multi Device Switcherというwordpressプラグインを使っています。

が、このプラグイン、wordpressのプライグイン新規追加で入れたものは、
最新バージョンのため、古いバージョンのwordpressを使っているとエラーが出ます。
※プラグインのインストールと有効化ではトラブルはなし。外観>マルチデバイス、で設定しようとすると、エラー表示されます。

そこで調べたら、とってもとっても的確な解説の記事がありました。
WordPressプラグイン「Multi Device Switcher」で「Fatal error: Call to undefined function wp_get_theme()」エラー対処方法 – シングスブログ

新しいwordpressで非推奨になった記述があり、それが修正された最新バージョンのプラグインを使うから、旧バージョンのwordpressでエラーが出るとのこと。

解決策として、
⇒wordpressを最新バージョンにする
⇒古いバージョン( 1.0.3)のMulti Device Switcherを入れる

今回は、状況判断でMulti Device Switcherの古いバージョン( 1.0.3)を入れました。

古いバージョンのプラグインは、wordpressプラグイン公式サイトのdevelopersというタブのページにあります。ここにあったのかー、って感じです。ふう。
http://wordpress.org/extend/plugins/multi-device-switcher/developers/

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

ソーシャル用metaタグの書き方

備忘録として、ソーシャル用にheader.phpとfunction.phpに追加した情報をメモ。

header.phpに書いたのはフェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か – IT戦記と、WordPressでOGPを設定する方法 – NEX.FMを参考にさせていただいた以下のコード。



<meta property="fb:admins" content="--ここにfb:adminsを入れるーー" />
<meta property="og:title" content="<?php if ( is_home() ) {
 bloginfo('name');
 }else {
 echo wp_title('');
 } ?>"/>
<meta property="og:type" content="<?php if ( is_home() ) {
 echo "website";
 }else {
 echo "article";
 } ?>"/>
<meta property="og:url" content="<?php the_permalink() ?>"/>
<?php if(has_post_thumbnail()) { ?>
<meta property="og:image" content="<?php get_featured_image_url(); ?>" />
<?php } else { ?>
<meta property="og:image" content="<?php echo home_url( '/' ); ?>img/noimage.gif" />
<?php } ?>
<meta property="og:site_name" content="<?php bloginfo('name'); ?>"/>
<meta property="og:description" content="<?php if ( is_single() ) { //単独記事ページの場合 ?><?php echo $post->post_excerpt; ?>
<?php } else if (is_category()) { //カテゴリーの場合 ?><?php if ( category_description() ) : ?><?php echo  category_description(); ?><?php endif; ?>
<?php } else {// 単独記事ページ以外の場合 ?><?php bloginfo('description'); ?>
<? } ?>"/>

header.phpにこう書いておくと、以下のように表示されます。


<meta property="fb:admins" content="--ここにfb:adminsを入れるーー" />
<meta property="og:title" content="カスタムメニューの値を出力するコード"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="http://mycolor.ivory.ne.jp/customize/20120215222850.php"/>
<meta property="og:image" content="http://mycolor.ivory.ne.jp/wp-content/themes/SimpleNote2C/images/noimage.gif" />
<meta property="og:site_name" content="wordpress 今日のカスタマイズ記♪"/>
<meta property="og:description" content="wordpressを使ってカスタムメニューをトップページに表示させるためのタグです。"/>

ウェブサイトのトップではtypeがwebsiteになります(上記は個別記事での表示なのでarticleになっています)。titleのところもトップページではサイトタイトルを表示させます。descriptionも個別記事の概要・カテゴリー説明・サイト概要に対応させています。

[2012.11.20追記]1行目にfb:adminsの1行を足しました。Facebookでテストしたらエラーが出たため。フェイスブック用にOGPの設定してたら修正が必要な[いいね!]ボタンの警告? – ぷろめし|プログラミングよりも飯が好きを参考にさせてもらいました。

▼動作確認サイトはこちら
デバッガー – Facebook開発者

次にfunction.phpに以下の記述を追加。plantica – page:2をそのまま写させてもらってタイトル横の余白を消しています。


// 画像を表示させる用の記述
function get_featured_image_url() {
    $image_id = get_post_thumbnail_id();
    $image_url = wp_get_attachment_image_src($image_id,'large', true);
    echo $image_url[0];
}

//wp_titleの$sepが空文字または半角スペースの場合は余分な空白削除
function my_title_fix($title, $sep, $seplocation){
    if(!$sep || $sep == " "){
        $title = str_replace(' '.$sep.' ', $sep, $title);
    }
    return $title;
}
add_filter('wp_title', 'my_title_fix', 10, 3);

ひとまずこのサイトでは実装できました。

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

wordpressでログインユーザーのみ閲覧させるfunction.phpの書き方

新規サイトのテスト、テーマの検証などのために、非公開でwordpressサイトを運用したいことが多々あります。

  1. ⇒新規サイトのテスト
  2. ⇒新テーマのテスト
  3. ⇒仲間とだけ楽しみたいサイト
  4. ⇒会員制コミュニティーの運用

いままでは、設定>プライバシーで検索エンジンのインデックスを許可しないを選択していましたが、それではアクセスされたときには人の目に触れるんですよね。企業サイトの構築中などは、着替え中の試着室みたいなもので、開けられたらとっても困ります。

そこでためになったのが、TOKYO2012WordCampのたにぐちまことさんのセッション「テストサーバーで WordPressサイトを構築しよう!」です。
セッションの資料は公開されています

たにぐちさんのお話しでは、Basic認証、プラグインMaintenance Modeとfunction.phpを追加することで、他の人への非公開を徹底し、より確かなテストサーバーの運用が可能になるということでした。

そこで3つめのfunction.phpで非公開にする方法を導入しました。

このやり方はログインユーザーだけにサイトが見られるようにする方法で、導入も運用も簡単なのが嬉しいです。


/* ログインユーザーのみ閲覧させるための記述 */
function require_login() {
    if ( ! is_user_logged_in() && ! preg_match( '/^(wp-login.php|async-upload.php)/', basename( $_SERVER['REQUEST_URI'] ) ) && ! ( defined( 'DOING_AJAX' ) && DOING_AJAX )  && ! ( defined( 'DOING_CRON' ) && DOING_CRON ) ) {
        auth_redirect();
    }
}
add_action( 'init', 'require_login' );

▼参考にさせていただいたサイト
WordPressの表示をログインユーザーに限定する | Simple Colors

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

サイドバーに♪ 特定カテゴリーの記事一覧をサムネイル画像付きリスト表示するタグ

wordpressのオリジナルテンプレートを作るときに使う、表示用タグ そのままメモ・シリーズです。

サイドバーなどに、特定カテゴリーの記事一覧を表示するためのタグです。サムネイル画像も表示させられるのがポイント。

たとえば全個別記事のサイドバーに、ニュース速報というカテゴリーの新着記事リストを表示する場合などに使えます。


	<article>
	<h3>カテゴリー名前などを入れる</h3>
	<ul>
	<?php $posts = get_posts('numberposts=0&category=1');//category=のところに、カテゴリーIDを入れる
	global $post;
	?>
	<?php
	if($posts): foreach($posts as $post): setup_postdata($post); ?>
	<li>
<?php
    	if (has_post_thumbnail()):
      	$title = get_the_title();
      	the_post_thumbnail(array(64,64), array('alt' => $title, 'title' => $title));
    	else: //アイキャッチ画像がなかった場合の処理
    ?>
    <img src="<?php bloginfo('template_url'); ?>/images/no_thumb.png" title="<?php the_title(); ?>" alt="<?php the_title(); ?>" width="64" height="64" />
    <?php endif; ?>
	<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a><span><?php the_time('Y年m月d日(D)'); ?></span>
	</li>
<?php endforeach; ?>
<?php else : ?>
	<li><p>準備中</p></li>
<?php endif; ?>
	</ul>
	<!-- end//box2 --></article>
カテゴリー
WPカスタマイズ備忘録

カテゴリーページで記事一覧を表示するカスタムテンプレート

wordpressのオリジナルテンプレートを作るときに使う、表示用タグ そのままメモ。

カテゴリーページで記事一覧(サムネイル画像付き)を表示させるタグです。<li>タグを使っていて、そのカテゴリーへの投稿が1記事もない場合は「準備中」と表示するようにしています。


<article>
<h3><?php single_archive_title(); ?>情報</h3>
<ul>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); //記事概要を表示 ?>
	<li><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
	<?php
    	if (has_post_thumbnail()):
      	$title = get_the_title();
      	the_post_thumbnail(array(125,125), array('alt' => $title, 'title' => $title));
    	else: //アイキャッチ画像がなかった場合の処理
    ?>
    <img src="<?php bloginfo('template_url'); ?>/images/no_thumb.png" title="<?php the_title(); ?>" alt="<?php the_title(); ?>" width="125" height="125" />
    <?php endif; ?>
    <br /><?php the_title(); ?></a>
	<?php the_excerpt(); ?>
	</li>
<?php endwhile; ?>
<?php else; ?>
	<li><p>
<?php endwhile; ?>
<?php else; ?>
	<li>準備中</li>
<?php endif; ?></p></li>
<?php endif; ?>
</ul>

準備中 と表示させる理由は、投稿記事がない場合に<ul>を表示させない方法が分からなかったから。準備中 と表示させない場合は、以下の部分を <?php endwhile; endif; ?> と書くことができます。


<?php endwhile; ?>
<?php else; ?>
	<li><p>
<?php endwhile; ?>
<?php else; ?>
	<li>準備中</li>
<?php endif; ?></p></li>
<?php endif; ?>

ループとかいろいろ、自分では書けないPHPタグを人様のタグを参考にしながら書いているので、丸ごとメモしておかないとわからなくなるのです。

カテゴリー
WPな出来事・イベント

WordCamp Osaka 2012 の公式サイトがオープン。参加登録がスタートしました

2012年11月3日に大阪で行われるWordCamp Osaka 2012 の公式サイトがオープンしました。参加費無料、参加申し込みは公式サイトで”参加登録する”だけです♪

▼公式サイト
WordCamp Osaka 2012 〜めっちゃ気になるWordPress〜 | 2012年11月03日(土/祝) 天満研修センターにて開催!

▼公式ツイッター
WordCamp Osaka (WordCampOsaka)さんはTwitterを使っています

▼公式Facebookページ
WordCamp大阪 2012