美川の山里暮らし

還暦を過ぎ、岡山県南西部の山間地で文明の利器を活用しながら田舎生活を満喫したいと思っています ゲンノショウコの写真

ワードプレスにフェイスブックの「いいね」を付けました

Filed under: WordPress — タグ: , — daii @ 9:48 PM
2011年10月10日

app_idを取得してから、「いいね」ボタンのコードを作成します

フェイスブックの デベロッパーズサイトのアプリ作成画面にアクセスします。この画面で、サイト名とURLを入力します。セキュリティチェックが済んだら、「Create an App」のアプリIDの作成完了画面が表示されます。このアプリID(app_id)を念の為メモしておきます。

フェイスブックの「いいね」ボタンの生成ページからコードを作成することができます。やり方はフェイスブックの「いいね」ボタンの設置の仕方を参照してください。iframe版を作成してください。

この時、設置するウェブページのURLを入力する と、次のようなアプリID(app_id)が入ったコードが生成されます。これをウェブページの表示させたい位置にコピーと貼付けするだけです。

<iframe src="//www.facebook.com/plugins/like.php?app_id=123456789012345&amp;href=http//example.jp/&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

ワードプレスではURL部分をパーマリンク「<?php the_permalink(); ?>」にすれば、すべての記事で同じコードを使えます。

フェイスブックの「いいね」ボタンのW3Cエラーを回避する方法

上記の方法では、allowTransparency=”true” の部分で、XHTML1.0ではW3C Markup Validation Service のチェックでエラーになります。

このエラーを回避するには、allowTransparency=”true” の部分を削除してやります。この部分はIE用で透過させるかどうかの設定です。これを削除すると、IEでは背景が白くなります。

最終的に、フェイスブックの「いいね」ボタンのコード(タグ)は次のようになりました。

<iframe src="http://www.facebook.com/plugins/like.php?app_id=123456789012345&amp;href=<?php the_permalink(); ?>&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" title="Like button">Like button</iframe>

上記以外に変更したところは、「//www.facebook.com」の前に「http:」を追加しました。また、「title=”Like button”」を追加したのと、インラインフレームタグ間に「Like button」を追加したことです。これはHTML文法に忠実にする為です。もし、英語ページ等で「いいね」の表示を強制的に英語の「Like」にするには、「like.php?」の後に「locale=en_US&amp;」を追加します。

スポンサーリンク

WordPressブログをルートからサブディレクトリに移動する方法

Filed under: WordPress — タグ: , , , — daii @ 1:10 PM
2010年11月15日

私は今まで、WordPress のブログをドメインのルートディレクトリに作っていました。しかし、このままだと、ルートファイルがゴチャゴチャして見にくいのです。また、将来ホームページスペースとして使う場合にも使いにくいのです。

そこで、ブログをルートからサブディレクトリに移動することにしました。ブログはMySQLというデーターベースを使っています。この為、ブログの移動はホームページの移動のように簡単にはできません。やり方を間違えるとブログが消えてしまうことが考えられます。

まず、ブログのデーターベースのバックアップをします。これは、Coreserver の管理画面でデーターベースの保存をします。public_html のひとつ上の階層に mysql_.**********.dump という18MB程度のファイルができました。

次にブログの管理画面のツールから、データーのエクスポートをします。これはパソコンの中にデーターをダウンロードします。wordpress.2010-11-15.xml のようなファイル名で500kB程度のファイルでした。

念の為に、ワードプレスのフォルダもFTPソフトでミラーリングダウンロードしておきます。画像ファイルは、これでダウンロードできます。

ブログをサブディレクトリに移動する手順は次の所にもあります。

http://wpdocs.sourceforge.jp/Giving_WordPress_Its_Own_Directory

ここでは簡単にできるように書いてありますが、実は色々な所でつまずきます。自信がない人はやめた方が良いでしょう。私もさんざん迷いましたが、結局やってみることにしました。次に私が経験した方法を記述します。

ルートディレクトリにインストール済みの場合に root/wp/ に移動する方法

WordPress をルートディレクトリにインストール済みの場合、WordPress ファイルを専用ディレクトリwpへ移動するには次のようにします。

ブログの管理パネルで 設定 > 一般設定パネルを開きます。WordPress のアドレス (URL)欄を、新しい WordPress の URL に変更します。

WordPress のアドレス (URL): http://hogehoge.com/wp

ブログのアドレス (URL)欄も、新しい WordPressの URL に変更します。同じにした方が後々問題がありません。

変更を保存(Update Options)をクリックします。 (この時点でエラーメッセージが出ても気にしません)

WordPressファイルを、作成した新ディレクトリ(WordPress address)へ移動します。ここでは、コピーでなくて移動します。

WordPressディレクトリの index.php ファイルをテキストエディタで開きます。次の修正を行ない、ファイルを保存します。
修正前:require(‘./wp-blog-header.php’);
修正後:require(‘./wp/wp-blog-header.php’);

新しい URL からログインします。例、http://hogehoge.com/wp/wp-admin/

パーマリンクを設定している場合、パーマリンク設定パネルを開き、パーマリンク構造を更新してください。.htaccess に適切なパーミッションを設定してあれば、WordPress が自動で .htaccess を更新します。

これだけではありません。各フォルダやファイルのパーミッションの見直しをしてください。また、テーマの中のPHPファイルを変更している場合はこの中のアドレスの変更も必要です。

ページの永久移転の設定

http://hogehoge.com/ からhttp://hogehoge.com/wp/ へ移転したので、今までのアドレスのままでも転送して表示されるようにします。ルートのhtaccessファイルに次の行を追加します。私は追加ではなく、この2行だけにしました。

RewriteEngine on
RewriteRule ^(.*)$ /wp/$1 [L,R=301]

このままでは永久ループの可能性があるので、hogehoge.com/wp/のディレクトリのhtaccessファイルに次の行を追加します。

RewriteEngine Off

永久ループしない安全な方法は、ルートに index.php ファイルを作って、内容を次のように設定します。つまり、/wp/へ転送するだけです。この場合はhttp://hoge.jp/にアクセスがあった時だけ/wp/へ転送されます。直接ブログの中にアクセスがあっても転送はされません。

<html>
<head>
<meta HTTP-EQUIV="Refresh" CONTENT="0;URL=http://hoge.jp/wp/">
</head>
</html>

画像を表示するように変更する方法

このままでは画像が表示されないので、次に画像を表示するように変更します。画像はhttpからの絶対アドレスになっています。

先程、ブログの管理画面のツールから、データーのエクスポートをした、データーwordpress.2010-11-15.xml の内容をエディターで修正します。エディターはTeraPadのようなutf-8の文字コードに対応したものを使います。メモ帳ではできません。

修正する内容は次のように置換を行ないます。
http://hogehoge.com/ を http://hogehoge.com/wp/ に置換します。

次にブログの管理画面の投稿から、投稿を全て削除して、ゴミ箱からも削除します。これをしないとデーターの上書きができません。カテゴリーも削除した方が良いのかも知れません。私はカテゴリーを削除しなかったので、カテゴリーが2重に登録されました。

次にブログの管理画面のツールから、データーのインポートをします。これでたぶんうまくいくはずです。

WordPressのデーターベースが不具合です

Filed under: WordPress — タグ: , , — daii @ 8:24 AM

私が使っているcoreserver.jpが突然不具合になり、2日程前からワードプレスのブログが真っ白に表示されるようになりました。ワードプレスを daii.jp から daii.jp/wp/ に変更したばかりだったので、それが原因かと思いましたが違うようです。

コアサーバーの PhpMyAdmin にログインしてデーターベースの状態を見ると、「INDEX というキーがカラム`comment_approved` に複数作成されました。」というエラーが表示されています。これを削除してやるとエラーは消えましたが、ブログは表示されません。

ワードプレスのルートのhtaccessファイルに

AddHandler application/x-httpd-phpcgi .php

と記述してセーフモードのPHPをCGIで動かすと、次のようにheader.php のXML宣言がエラーになっていると表示されました。

<?xml version="1.0" encoding="utf-8"?>
php_flag short_open_tag Off

が無効になっているようです。仕方がないので、XML宣言を次のように書き換えると、ブログがやっと表示されました。

<?php echo '<?xml version="1.0" encoding="utf-8"?>'."\n"; ?>

スタイルシートが効かないのと、画像が表示されないのを除くと、一応使えるようです。コアサーバーの復帰を待つしかありません。エクスレア、コアサーバーのサポートボードはメンテナンス中となっていて表示されません。困ったものです。

スポンサーリンク

英語ページをサブディレクトリに移動しました

Filed under: Home Page — タグ: , , — daii @ 7:20 PM
2010年11月12日

約1ヶ月前から英語ページをサブドメインで作り始めましたが、SEO上でサブドメインは不利なので、サブディレクトリに移動しました。アドレスは http://as76.net/en/ です。これは以前からあった英語ページと同じアドレスです。

約1ヶ月で約300ページできました。毎日平均10ページを翻訳したことになります。ウェブの翻訳を使うので簡単といえば簡単なのですが、うまく翻訳してくれない時は手間が掛かります。

また、英語のページから内容が同じ日本語ページに行けるようにリンクも付けました。その反対に、日本語のページを英語に翻訳したページがあれば、そのページに行けるようにもしました。未翻訳の場合は、自動的に英語にウェブ翻訳ができるようにしました。このリンクはメインページの最下行にあります。

これは、PHPを使って自動的に行なっています。まだ慣れないPHPですが、うまくいったと思っています。

Older Posts »

Powered by WordPress