WPショートコードの書き方メモ

 

ロリポップ!に設置していあるWPが軒並み乗っ取られている件で、やっぱり投稿とかページでPHP動かせるようにするのはやめました。
代わりにショートコードを使います。

ということでショートコードの書き方メモ。

function.phpにショートコードの定義を追記。

例 パーマリンク取得

function geturl() {
	return get_permalink(); 
}
add_shortcode('url', 'geturl');

add_shortcodeというのが、WPの関数で、この第一引数に呼び出しに使う名前(投稿やページに記述する名前)、第二引数にFunctionで定義した、実行したい挙動を書いた関数の名前を記述します。

ウィジェットでショートコードを使う

ウィジェットでもショートコードを使いたい場合は以下をfunction.phpに追加。

add_filter('widget_text', 'do_shortcode');

で、HTML側での記述(呼び出し)は第一引数を書く。

[url]

リンク貼りたいときは↓

<a href="[url]">

こっちはプラグインで使ったことある人も多いはず。
sitemap作成系とかフォーム作成系のプラグインとかで呼び出したいところで書いてますよね。

もちろん中にif文とか書くこともできるし、ショートコードの中にショートコードを書くこともできます。

テンプレ内でショートコードを呼び出す

テンプレート内でショートコードを呼び出したい時は以下で呼び出せます。

<?php echo do_shortcode('[url]'); ?>

ショートコードのネスト(入れ子)

ショートコードをネストさせたい場合は、「do_shortcode();」を使います。

私の場合、特定ページや投稿を、パーツとして呼び出すというようなショートコードや、画像パスやルートのURLを呼び出すようなショートコードを割とよく使うのですが、
「ショートコードで呼び出したいページの中に、画像パスをショートコードで書いてある」
とかいう【ショートコードのネスト】状態は、このままでは機能しません。

ショートコードをネストさせたい場合は、「do_shortcode();」を使います。

function 関数名() {
   return do_shortcode(処理内容);
}
add_shortcode('呼び出し用名前', '関数名');

こんな感じです。

WPテンプレートタグメモ

 

良く使うWPのテンプレートタグを自分用にメモ。使うものから順次追加。
※順不同。解説が欲しい方は⇒テンプレートタグcodex

Wp-contentディレクトリのパス取得

<?php echo content_url();?>

テーマディレクトリのパス取得

<?php echo get_template_directory_uri(); ?>

ドメインをパスで取得

 <?php echo home_url; ?>

↑の応用特定URL

<?php echo home_url( '/第2階層/第3階層/' ); ?>

⇒テンプレートタグcodex

【WordPress3.6】ヴァージョンアップに耐えられなかったプラグイン

 

WPをバージョンアップしました。
2013年8月時点で最新は3.6です。
3.5.2以前で改ざんリスクが注意喚起され、サクラインターネットとかヘテムルとか各サーバからも最新バージョンにせよとのお達しがありましたので、3.5.2以前をお使いの方は早急にバージョンアップされることをお勧めします。
因みに、知人にも改ざん被害者がいました。結構広範囲に被害が出てるみたいです。

いまやWordPressのバージョンアップはワンポチでできるので、やり方とか何も書くことはありませんが、
利用していたプラグインで、一つ使えなくなったものがあったのでご報告がてら記載します。

【WP3.6.2で不具合のでたプラグイン】
Wp-lightpop

画像とかをクリックしたときに、画面遷移せず、背景色を落として画像を浮かび上がらせる、ご存知lightbox系のプラグインです。
FireFoxとChromeでは問題ありませんでしたが、IEではヴァージョンに関わらず、ヘッダー画像が固定(fixed)されてしまいました。
※このサイトはもともとヘッダ画像ありませんので問題ありませんでしたが、他のサイトで、スクロールすると記事部分ヘッダー画像が重なるようになっちゃいました。

IEの開発者用ツール(F12押すと出てくるやつ)で確認すると、どうやら、勝手に<body>タグが改造されていました。
こんな具合に⇒<body style=”background-attachment: fixed;”>と勝手にスタイルを追加してました。
もちろんテンプレートにはそんな記述ないし、他ブラウザは問題ない。

ということでプラグインを停止していってみると、Wp-lightpopを停止したところで直った。
見てみると、このプラグイン、もう2年も更新されていなかった。
どうやらこれのjsが影響しているようだとのこと。

代替にはWP jQuery Lightboxを入れてみた。
3.6ではテストされていないみたいだけど、3.5.2は対応済だし、最終更新が2か月前なので、多分今後も更新されると期待を込めて・・・。

WP jQuery Lightboxを有効化すると、管理画面左メニューの設定箇所に「jQuery Lightbox」が追加され、ここで設定ができます。
が、デフォルトで一般的な設定がされているみたいで、有効化だけで問題なく動いた。

尚、フォーラムで聞いたのだけど、WP3.6では、WP本体に同梱のjQueryがアップデートされたらしいので、他にも古いプラグインには影響があるかも?
今回みたいにアップデート自体がされなくなっちゃうと、なかなか気づかないので気を付けられたし。

 

エックスサーバーで、htmlのままphpを動かしたい・・・

 

エックスサーバーで、htmlのままphpを動かしたかったのだけど・・・どうしてもできなかった。
公式には.htaccessを以下のように編集すれば可能となっている。

—————————-
AddHandler x-httpd-php .html
—————————-

しかし、これだと真っ白になる。
もちろん、xml宣言にも配慮して<?php echo ‘<?xml version=”1.0″ encoding=”utf-8″?>’.”\n”;?> に書き換えたりもしたけど、変わらず。

サポートに問い合わせても、(X)おかしなところはない、それでできるはず⇒(Me)ならないよ⇒(X)これ以上のサポートはやってないからググって・・・ということで見はなされた。

何回もググってるんだけど・・・。

AddHandler x-httpd-php5.3 .php .phps .html
AddType application/x-httpd-php .php .html

AddHandler x-httpd-php .php .html

AddHandler x-httpd-php5 .php .phps .html

AddHandler application/x-httpd-php .php .html

とか、ぐぐって、出てくる限りのタイプを試したけどダメだった。
文字コードや改行コードもいろいろ試したけど甲斐なし・・・
さくらインターネットもヘテムルもできたのに、エックスサーバだけどうやっても無理・・・。

仕方ないので、結局拡張子を.phpにして.htmlを.phpに301リダイレクトした。
1ページだけだから初めからこうしておけばよかった・・・とも思うけど、できればリダイレクトしないで対応したかった・・・。

 

 

 

 

OGPの設定方法とFBでの確認方法

 

OGPの設定方法とFBでの確認方法メモ。

<meta property="og:title" content="タイトル" />
<meta property="og:description" content="ディスクリプション" />
<meta property="og:url" content="URL" />
<meta property="og:image" content="画像の絶対パス" />

 

FBのデベロッパーツールで、正しく設定ができているか確認できるデバッガーというツールが便利。
URL入力して「デバッグ」ボタンを押すだけ。

※2015/3/3追記
デバッガーの仕様が変更になっており、この方法だけではキャッシュクリアできない場合も。
詳細はFacebookデバッガーでキャッシュクリアできない。仕様変更対応。にて。

デバッグボタンを押すと、それまで保持されていたキャッシュがクリアされるので、OGP設定したのに、上手く行かない場合は、まずこれを試すと吉。

【2013/8/22追記】
Facebookの投稿で、サムネイルとして読み込める画像にはサイズに決まりがあるみたい。
200px×200px~1500px×1500px 容量5Mまで。
が許されているサイズらしい。
150px四方の画像を指定して、何度デバックボタン押しても表示されなくて悩んでたところ、
http://webtan.imohei.com/facebookに投稿したページのサムネイル画像が表示され
で見つけました。
多謝。

 

 

【WP プラグイン】「Trust Form」をカスタマイズしてアナリティクスのコンバージョンに設定する方法

 

————-【注意】————-
2016年10月現在、Trust Formは、脆弱性のためWPの公式リポジトリから取り下げられているそうです。
開発者の方のFBにて脆弱性についてご対応中との記載がありました。
復活を期待しております。
※ご利用中の方はご注意ください。
—————————————

WPのフォーム作成プラグイン「Trust Form」のカスタマイズ。
問合わせ完了ページをアナリティクスで目標としてコンバージョン設定がしたかったのだけど、
cgiとかでも良くあるように、確認画面→完了画面でURLが同じため、カスタマイズ。

————-【追記】———————
※プラグインファイルはあまり直接弄るべきものではない。
ということで、Trust Formはカスタマイズできるようにつくられているようなので、直接trust-form-tpl-.phpはいじらないほうが良いようです。
trust-form-tpl-.phpをコピーして「trust-form-tpl-777.php」(777の部分は、フォームのID)と言う名前で保存⇒テーマファイル直下にアップ(プラグインフォルダじゃなくて、テーマフォルダ直下。)。
これで、trust-form-tpl-777.phpを優先してくれるらしいのでtrust-form-tpl-777.phpの方をいじりましょう。
参考⇒FormのHTMLを直接カスタマイズする
———————————————-

プラグインの中身を見たら、テンプレっぽい名前のファイル「trust-form-tpl-.php」がある。
この中で、デフォルトのパラメータ「#trust-form」を検索したら、ちょうど2つ見つかったので、ここを変更してみる。
具体的には↓
1行目からはじまるfunction trust_form_show_input() が入力画面。
この中にある form action=”#trust-form” method=”post”

が確認画面にパラメータを渡しているところっぽいので、ここを変更してみる。

<form action="#trust-form" method="post" >

<form action="?confirm#trust-form" method="post" >

※confirm のところはkakuninでもなんでも任意で。

同様に、確認画面は46行目あたりからはじまるfunction trust_form_show_confirm() の中。
55行目あたりに完了画面に渡すパラメータが設定されているのでここを変更。

<form action="#trust-form" method="post" >

<form action="?thanks#trust-form" method="post"></form>

———-2014/9/11 追記————
コージさまよりご指摘いただきました。お尻の</form>は不要です。trust-form-tpl-.phpにもそもそもこのお尻部分はついてませんね・・・。
ご指摘ありがとうございました。
————————————

これで、確認画面と完了画面のURLにパラメータがつくはず。
それぞれのページにアクセスし、パラメータがついていたら、そのままの状態でアナリティクスのリアルタイム解析を確認。
すると、確認画面?confirm= 完了画面?thanks= となっていたので、これを目標に設定して完了。

因みに初めは、送信ボタンにイベントを仕込もうとしていたのだけど、アナリティクスがまた「Universal Analytics 」なるベータ版をリリースしてる・・・。
これはあとで変更しなくちゃならなくなったら嫌だな・・・と思い、確認画面や完了画面のURLにパラメータをつける方法に思考チェンジして、↑のように。

Googleの検索結果やナレッジグラフに企業ロゴを表示する方法

 

企業やショップ、団体など組織のロゴマークをGoogleの検索結果やナレッジグラフに表示してもらうためのマークアップ方法。

今すぐやろうとは思わないけど(所属組織のロゴが変わるかもしれないといこともあり)、そのうち必要になると思うのでメモ。

このブログでロゴに当たる部分は、↓

<h1><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="https://wp-etc.navich.net/wp-content/uploads/2013/05/logo.png"></a></h1>

こんな感じ?にするのかな・・・?

<h1 itemscope itemtype="http://schema.org/Organization"><a itemprop="url" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img itemprop="logo" src="https://wp-etc.navich.net/wp-content/uploads/2013/05/logo.png"></a></h1>

赤字が変更箇所。
テーマ変更してみたけど表示崩れはないみたい。
これで(本来は)ナレッジグラフに出るようになるらしい。
そもそもこのブログじゃナレッジが集まらないだろうから、表示されることはないとおもうけど。

因みに、ナレッジグラフというのは、ちょっと前に検索結果の右側に出てくるようになったキーワードの関連情報のこと。
これ↓。
Googleナレッジグラフ
詳しくはGoogleのナレッジグラフ解説ページをどうぞ。

これ試すために、ロゴ画像(持ってた素材に文字並べただけ…だけど)を上げてみたけど、ヘッダ領域に高さは要らないと思ってたし、本当は元のテキストのが気に入ってる・・・。
時間があるときに、せっかくだからきちんとロゴっぽいものを作りたいな。

参考:組織のロゴの schema.org マークアップのサポートを開始しました

tumblrを触ってみた。

 

Yahooによる買収で話題になってるtumblr
tumblrからWPへのエクスポートが急増しているというニュースを見て、ちょっと興味が湧いたので、tumblr弄ってみた。
Tumblr 入口

登録してちょこちょこーと見ただけなので全くよく理解していないのだけど、感想は・・・
・ブログとRSSリーダーとSNSをくっつけたみたいな感じ。
・フォローしたブログはGoogle+みたいな感じのタイムラインで見えるっぽい?
・テーマのイメージはWordPressと似ていると思う。
無料でもHTMLがカスタマイズできるっぽくて、CSSは?と思ったら、別ファイルでなくての中に直接cssを記述しているので、cssも弄れるっぽい。 これだけでも、wordpress.comよりずいぶん自由度は高そう。
tumblrはcssカスタマイズ可能っぽい

独自ドメインも使えるらしい。
tumblrは独自ドメインも使えるっぽい

節約するとき、wordpress.comじゃなくてtumblrにしとけばよかったかなと思ったり。
phpが使えるかとかプラグインみたいな便利なものがあるかとかってところはまだわかって(見つけて)いないけど、デザインが好きに弄れるだけwordpress.comよりも随分優れていると思う。
※勿論有料テーマもあるけど、基本は無料で使えるのはwordpress.comもtumblrも同じっぽい。

情報収集としてチェックしてるブログがあるなら、ブログをフォローしたら更新情報がタイムラインみたいに流れるっぽいし、tumblr内でメッセージのやり取りができるっぽい。

Facebookやtwitterとも連携できる、ようなのでなんやかんやをまとめて管理するプラットフォームとしてはとても使い勝手が良いかもしれない。

しかし・・・・とても良さ気に見えるのだけど、なぜか私的には積極的に触手が伸びない・・・。

多分「慣れ」のせいと、個人的にFacebookとかtwitterとかをあんまり使っていないせい。
それにブログをフォローできることと、それがタイムラインに流れる仕組みはとても素敵だと思うけど、当然フォローできるブログはtumblrで作られたブログで、
その中に日本語のブログをほとんど見つけることができなかったから・・・
でも仮に日本語のブログが増えたとしても、結局tumblr以外で書かれているブログもチェックしなくちゃいけないから、やっぱりブログからの情報収集にはRSSリーダーを使うんだと思う。

ということで、やっぱりWordPress.org 万歳!

微ペナっぽいサイトが復活したので記念カキコ

 

微ペナルティを頂いていたっぽいサイトが復活したので、記念に経緯を記録。

2012年3月初旬 某サイトのSEOを見るようになる。このサイトは姉妹サイトが「複製」で量産されており、重複対策一切なしという危険な状態。
しかし、システムの仕様で個別にnoindexもcanonicalも設定できないことを知る。
2012年3月中旬 某SEO業者に発注していたキーワードを一部変更
2012年4月下旬 変更したキーワードが300位圏外→70~60位くらいになる
2012年5月初旬  再び300位圏外に吹っ飛ぶ
 2012年5月下旬  依頼ページが、ページタイトルで検索しても300位圏外であることに気付く。(←…遅い)
「これおかしくない?ぺなってない?」と業者に詰め寄るも、ウェブマスターツールに警告が来ていなければ大丈夫と言われる。
ウェブマスターツールで被リンクを調べる⇒ワードサラダを大量複製という糞リンクが大量であることを知る。
この業者はマズイと判断。他キーワード(メイン)が2位だったので、フェードアウトすることにする。この頃、システム変更の稟議が通る。
 2012年6月中旬  業者に問題のキーワードのリンクを全て外させるも、ヨミサーチの管理パスワードを紛失したことを白状される。
で大量の糞ヨミサーチが放置される。
 2012年7月中旬  上がっていたキーワードが50位程度に下落。解約スピードを急ぐ。全リンク削除を依頼。
 2012年9月上旬 上がっていたキーワードも圏外に。 
外せないヨミサーチを残してリンク削除完了。
この業者とさようなら。
システム変更にコンテンツ大量追加(真面目に作るきちんとしたコンテンツ)とサイトデザインを含めた大幅リニューアルすることになる。
 2012年10月17日  Googleからリンク否認ツールがリリースされる。
しかし、ここまで一切Googleからの警告メッセージなし。
 2012年11月~12月  複数の業者に見せるも、「リンクペナルティは多分受けていない。多分重複コンテンツのせい」と言われる。
ページタイトルで検索して圏外だったページが25位くらいと圏外を行ったり来たりするようになる。
業者に依頼していたキーワードが25位~110位くらいをウロウロしはじめる
2013年3月  1サイト、システム改修とコンテンツ追加が完了。重複が一部クリアになる。
 2013年5月12日  ページタイトルで検索して圏外だったページが、ページタイトルで1位に。
同時にSEO業者に依頼していたキーワードが5位に急浮上。

システムの入れ替えがけっこう大変な作業で、現状も重複コンテンツは大量にのこっているのだけど、この状態でここまで回復した。
糞リンクに重複コンテンツと思い当たることがありまくりな上に、すぐに解消ができない都合がいろいろあり・・・まだまだ苦しい道程だけど、ちょっと嬉しい。

重複が解消されていないのに回復したということは、やっぱりリンクが原因だったのか。
だとしたらマイナス評価回復まで8カ月かかったということか。
それとも、最近耳にするようになった単なる「ペナルティの期限切れ」とかなのか?(そうじゃないことを望む)

因みに、Googleから警告メッセージが来ていないので、リンク否認ツールは使わなかった。
目視されたら、逆に悪いこと(重複コンテンツが見つかったり)が起こりそうで怖かったので・・・。

年内には全重複対策ができるようになる予定。そして業者に頼らないですむサイトを作るために、今コンテンツ作成にもかなりコストを割いているので、しばらくこのままでいさせて下さい。

背景をフルサイズの動画にする 【mb.YTPlayer for background videos 】

 

サイト背景をフルサイズの動画にするプラグイン。

背景を動画にするのはBigVideo.jsっていうjQueryでできる。
BigVideo.js - The jQuery Plugin for Big Background Video
⇒⇒⇒BigVideo.jsのデモページ

このjQueryの使い方は、colissさんの記事が参考になる。

で、これと同等のプラグインをいくつか調べていたら、mb-ytplayerというのがあって、これにはWPのプラグインがあるみたいなので入れてみる。
公式プラグインなので、←のリンクからでも、WPの管理画面>プラグイン>新規追加からキーワド入力でも簡単に見つかります。
私が入れた時点では、プラグイン新規追加画面の評価は★5つでした。

使い方は、説明するまでもなく超簡単。
プラグイン新規追加>有効化>左メニューの「設定」内に「mb.YTPlayer」というのが追加されているので、ここで設定するだけ。
日本語化されていなくても、やさしい英語で書かれてるので、多分普通の人であれば問題ないはず。
(chromeが勝手に翻訳した日本語の方が意味不明だった。)

「home video: url」ってとこに、YoutubeのURLを入れるだけ。
「home video: start at」ていうのが、デフォルトだとfalseになってるので、適当な数字を入れてあげる。
「0」だと動かなかった。0.1でも0.01でも動いた。
あとはコントロールを付けるかとか、透過度とか、ループとかが簡単に設定できるのでお好みで設定して完了。

尚、オリジナル動画を使いたければ、一度Youtubeにアップする必要あり。
現状、動画はYoutubeしか対応していないみたいなので、自サーバに動画上げて・・・ってことはできないみたい。

とりあえず無料映像素材でググったら、羽の動画を設定してみる。
元の背景画像がリリアン・ギッシュだからちょっとデザインちぐはぐだけど、ひとまず実験ということで・・・。
良い無料素材、Youtubeにないかなー・・・・

 

【2013/9/3 追記】
素敵な動画素材を探す暇もなかったので、プラグイン停止しました。