meta

WordPressで記事抜粋のdescriptionと記事タグをkeywordsに自動挿入する方法

通常、ヘッダに入るmetaタグのdescriptionとkeywordsは全ページ共通のことが多いが、SEOに適したヘッダにするためには、各ページ毎に合わせたmetaタグでdescriptionとkeywordsを設定しておくのが好ましい。

WordPressのプラグイン、All in One SEO Packは各記事に対して個別のdescriptionとkeywordsを設定することができるが、WordPress PDA & iPhoneのような特殊なテンプレートでは反映されないケースが生じる。

そういった場合に対応し、descriptionには記事の抜粋、metaタグのkeywordsには記事で設定したタグが自動で入るようにする。

以下のコードを既存のメタタグ部分と差し替え、または挿入する。
なお、前半、descriptionの部分にある「160」は抜粋(カット)する文字数なので、160文字も必要ないという人は適宜変更してもらいたい。
また、キーワードに関してはgoogleは一切評価しないとも言われているが、SEO全体としてkeywordsもきちんと記載することが好ましいと考える。
下記のコードではタグに設定したものを半角カンマ区切りで書き出し、タグが未設定のものはデフォルトのキーワードを書き出す。

<meta name="description" content="<?php
$descrip = mb_substr(ereg_replace("(\r|\n|\r\n)","",strip_tags($post->post_content)),0,160)."...";
if(is_single()){echo $descrip;}else{bloginfo('description');}
?>" />
<meta name="keywords" content="<?php
$tags = get_the_tags();
if($tags){
$total = count($tags); $count = 1;
foreach($tags as $tag){
if($total == $count){echo $tag->name;}else{echo $tag->name . ', ';}
$count++;
}
}else{echo 'デフォルトのキーワード';}
?>" />

 

iPhone対応サイトの作り方(その1)

同じページ、レイアウトも変更せず対応する方法

iPhoneでPC向けページを表示させた場合、デフォルトで横幅980pxを想定して表示するようになっている。

つまり、少し前に作られた横幅が750px等のサイトの場合、左右に無駄な余白ができ、さらに表示が小さくなる。

そういった場合、以下のメタタグを入れることにより、無駄な余白を無くすことが可能。

※サイトの左右が750pxの場合

<meta name=”viewport” content=”width = 750″ />

iPhoneサイトで上下に表示されるパネルを非表示にする方法。

iPhone 向けサイトにアクセスした場合、通常は上にURLを入力するエリア、
下部に「戻る、進む、ブックマーク」のボタンのついたパネルが常に表示される。

上部のURLエリアは、以下にjavascriptで簡単にスライドさせることができる。

■サンプルjavascript


<script type="text/javascript" charset="utf-8">
window.onload = function(){
setTimeout(function(){window.scrollTo(0,1);},100);
}
</script>

下部のパネルは以下のタグを入れる

<meta name="apple-mobile-web-app-capable" content="yes">

■サンプルサイト(iPhone用壁紙サイト)
Wallpapers@iPhoneStyle
http://iphone-sns.com/wallpaper/

ただし、下部パネルが非表示になるのは、ホーム画面に追加したもののみ。