WordPressで投稿したブログ記事を、Facebookに表示して連動させる。
ブログ記事を、Facebookに表示して連動させるには、Wordbookerというプラグインを使用。
FaceBookにログイン。
手順1 Wordbookerプラグインをインストール
まずは、ブログの管理画面
「プラグイン」の中の「新規追加」をクリック。
Wordbookerと入力して検索。
Wordbookerが表示されたら、「いますぐインストール」。
「プラグインを有効化」。
管理画面の左メニューの「設定」から「Wordbooker」を設定。
「Connect with Facebook」という青いボタンをクリック。
FaceBookの画面が自動で表示され「アプリへ移動」。
アプリを「許可する」。
WordPressのWordbookerの設定画面が表示され、「Reload Page」という青いボタンをクリック。
手順2 Wordbooker詳細設定の手順
1. 「Blog Level Settings」 一番上の「Default Publish Post to Facebook」にチェック。 「Save Blog Level Options」という青いボタンで保存。
2.「User Level Settings」 「Default Publish Post to Facebook」を「Yes」。 「Default Publish Page to Facebook」を「No」。 「Post to the following Wall」でブログの記事を表示したいFacebookページを選択。 チェックボックスにチェック。 「Post Attribute」 に【ブログを更新しました】 【ブログ記事の更新】など。 「Show Status for」という所で、プロフィール情報を表示したいFacebookページを選択。
設定終了。
まずはこの「DD_belatedPNG.js」自体をダウンロード
http://dillerdesign.com/experiment/DD_belatedPNG/#release0.0.8a
2012.0224 現在バージョン0.0.8a.js
ファイル名前「DD_belatedPNG.js」として保存。
以上
2.全体的な基本設定と使用方法
htmlのheadに下記を記述
<!--[if IE 6]>
<script src="○○○/DD_belatedPNG.js"></script>
<script>
DD_belatedPNG.fix('img, .png_bg');
</script>
<![endif]-->
4行目にDD_belatedPNG.jsを反映させる要素名やid名、クラス名を指定。
img要素全て+png_bgというクラス名の要素に対してDD_belatedPNG.jsが適用。
以上でie6用透過pngが実装できる。
スマートフォンの画面サイズに合わせたい時は、こちらの一行をheadに追加してみる。 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
initial-scale=初期状態のスケール地 maximum-scale=最大スケール値 user-scalable=拡大縮小ができるか
webサイトとスマートフォンの画面幅を合わせる事が出来る。
ロリポップのレンタルサーバーで、htmlのままphpを使うには
「.htaccess」内に
「AddHandler php5.2-script html」
*20120511 追記
PHP5.3バージョンを選択した場合は、
「AddHandler php5.3-script html」
インクルードを使うには
htmlファイル内に「<?php include(“ファイル名.php”); ?>」
ついでに書いておくと、さくらインターネットの場合は
「.htaccess」内に
「AddType text/x-server-parsed-html .html」
インクルードを使うには
htmlファイル内に「<!–#include virtual=”ファイル名.php”–>」
基本的なパッケージ
まず、汎用に使える便利なパッケージ
HTTP_Request2
url を渡してリモートのテキストを取ってこれるモジュール。細かなHTTPの制御が可能。外部WEBサービスのAPIを使う場合に使えます。
HTTP_Request というモジュールがありましたが、メンテナンスが終了し、HTTP_Request2 が公開されています。
MDB2
MySQL等のデータベース操作用のモジュール。
データベース操作というと PEAR::DB が主流でしたが、このパッケージはメンテナンスされておらず、MDB2を使おうということになっています。
PEARモジュールを使わずともPDOを直接使ってもヨシ。
XML_Serializer
連想配列形式の変数をXMLに変換したり、逆にXMLを連想配列に変換できるもの。WEBサービスAPIは基本XMLを扱うことが多いので便利に使えます。
デフォルトのsimpleXMLを使ってもOK。simpleXMLがオブジェクトなのに対して連想配列ということで利用が簡単。
Cache_Lite
データをファイルにキャッシュしてページの表示を高速化
WEBサービス
最近ではサービス公開というとソーシャルサイトや外部サイトとの連携モジュール一覧。
OpenID
とりあえずOpenIDでログインする機能をサイトに実装したい場合の1つの選択肢として使えます。
HTTP_OAuth
OAuthを使った認証サイトも増えてきていますが、OAuthによる認証を比較的容易に扱えるモジュールです。
Services_Twitter
Twitter の API を呼び出すモジュールです。基本的に全てのTwitter API に対応しています。
Twitter 連携のサイトが流行っていますが、このライブラリで比較的容易にTwitter API を叩けます。
Services_Amazon
Amazon API を呼び出すモジュールです。amazon のアフィリエイト機能をサイトに入れたい場合に使えます。
Services_Hatena
はてなブックマークや、ブックマーク数の取得、自動リンクといった各種APIを叩くことが出来ます。
Services_ShortURL
bit.ly や tinyurl 等のURL短縮サービスに対応したPEARモジュール。長いURLを短縮する機能はTwitter連携なんかでは必要ですが、これを簡単に行なえます。
XML_RSS
RSSパースのモジュールは色々ありますが、PEARで公開されているのはこのXML_RSS。
外部サイトのRSSをサイトに表示したりする際に使います。
HTML/表示関連
HTML_TagCloud
ページ内にタグクラウドを表示させるために便利なライブラリ
Pager
アイテムが多くなって1 2 3 という具合にページを分ける際のタグを作れるモジュール
セキュリティ
それなりに使えるセキュリティ関連のモジュール。
Crypt_Blowfish
データを暗号化・復号化することが出来るモジュール。データをサーバ上に平文で保存するのは問題だったりするのでそうした場合に使えます。
mcrypt でもOK
Text_CAPTCHA
ユーザ登録やコメントを書きこむ際に表示される画像のテキストを作成するモジュール。
圧縮ファイル操作
ファイルの圧縮や解凍操作をPHPで行うためのモジュール
Archive_Tar
Archive_Zip (メンテナンス停止中)→代替のpecl版zip
tar.gz ファイルやzip ファイルの圧縮・解凍に使える便利クラス。
ファイルを利用者にダウンロードしてもらう時なんかにも使えます。
開発
開発に関して便利に使えるモジュール。
PHP_Beautifier
汚いコードを綺麗に整形してくれるモジュール。
PhpDocumentor
PHPのソースコードからドキュメントを生成してくれるライブラリ。PEARサイト内に収録されていたので紹介。
携帯・絵文字
Net_UserAgent_Mobile
モバイルのユーザエージェントを扱うにはコレ
Net_UserAgent_Mobile_GPS
携帯の位置情報を得るためのモジュール。位置連動型のサイトに組み込むには必須
HTML_emoji
ガラケーからiPhoneまで絵文字を扱えるクラスライブラリ。絵文字を扱う場合は、速度的な問題でこれ以外に選択肢はありません。
IE6はCSSの解釈がおかしい
CSSの解釈がおかしいためレイアウトが崩れ
div#box{
width:100px;
border:1px solid black;
padding:5px;
}
ボックス全体の幅は112px→IE6では全体で100pxとなります。
【対策】widthとpadding、borderを一緒に使わない
div#box1{
width:100px;
}
div#box2{
border:1px solid black;
padding:5px;
}
例えば分けて指定
div#box{
float:right;
margin-right:20px;
}
通常は20pxが、IE6の場合40pxとなる
【対策】 marginとfloatを使うときはdisplay:inline;を忘れずに
div#box{
float:right;
margin-right:20px;
display:inline;
}
floatでボックスを回りこませてmarginで間隔を開けるときはdisplay:inline;をお忘れなく。
IE6のCSS対策の最終手段CSSハック
.sample{
width: 100px;
_width : 120px;
}
この場合、IE6以下のみ120pxとなり、他のブラウザでは100px
.sample{
width: 100px;
}
* html .sample{
width : 120px;
}
こちらも同じで、IE6以下のみ120pxとなり、他のブラウザでは100px
parallelsで拡張子htmlのままPHPを動かす
FTPを使ってアップロードすると.htacessが表示されないので
コントロールパネルからファイルマネージャーを使って作成
AddType application/x-httpd-php .php .html
を記述すれば動作しました。
こちらのサーバー
CGIの標準設置ディレクトリはcgi-binディレクトリとなります
cgi-binディレクトリではそのディレクトリ内のファイルやディレクトリ全てがCGIとして判断される為、.cgi以外のファイルやディレクトリは使用する事が出来ませんので、.cgiのみをcgi-binディレクトリに設置する必要があります。
CGIをデフォルトディレクトリのhttpdocs以下で稼動させたい場合、CGIを設置するディレクトリに.htaccessを設置する事でご利用頂けます。
テキストエディタにてhtaccess.txtを作成し、下記の内容を記入します。
Options +ExecCGI
AddType text/html .cgi
AddHandler cgi-script .cgi
そのまま、FTPにてCGIを設置するディレクトリにASCIIでUPし、.htaccessにリネームします。
これにより、CGIを設置したディレクトリにCGIの実行権限が与えられ、CGIが稼動するようになります。
RSSパーサーsimplepieは、rss2.0にも対応しているとの事なので使ってみた。
1,simplepieからダウンロード
中身のsimplepie.incファイルだけ使用する。
2,RSSを表示するphpを作成する。ここではindex.php拡張子はphpでないと動作しません。
3,cacheフォルダを作成する。(ファルダを書き込める属性にパーミッションを変更)
以上を同じディレクトリにアップロードする。
simplepieファイルは、そのまま使用。
index.phpファイルを作成します。
下記のwordpress note様から引用させて頂きます。
<ul>
<?php
include('simplepie.inc'); // simplepie.inc を読み込む
$feed=new SimplePie; // インスタンス生成
$feed->set_cache_location('cache'); // Cache ディレクトリ
$feed->set_feed_url('http://www.********.com/feed/'); // フィードしたいRSSのURL
$feed->init(); // パースを実行
$feedItems=$feed->get_items(0,5); // 表示件数を指定(この場合5個)
foreach($feedItems as $item){
$date = $item->get_date('(Y/m/d)'); // 各記事の日付
$title = $item->get_title(); // 各記事のタイトル
$link = $item->get_link(); // 各記事のURL
$author = $item->get_author()->get_name(); // 各記事の投稿者名
echo "<li>";
echo "<a href='$link'>$title</a>";
echo "<span>";
echo "$author";
echo "さん";
echo "$date";
echo "</span>";
echo "</li>";
}
?>
</ul>
こちらを作成し、phpで保存して下さい。
同じ階層のフォルダに入れるのであれば、フィードしたいURLだけの変更とcssの修正だけで
そのまま使用可能です。
日時の取得も1970/1/1にならずに、正常に取得致します。
MagPieは、rss2.0には対応していないらしく、文字化け問題や日時の取得が上手くいかない事が多いです。
参考URL
SimplePieとは
PHPのテクメモ
ロリポップの場合、拡張子htmlのままPHPを動作させるには
「.htaccess」内に
AddHandler php5.2-script html
さらに、ロリポップのコンパネのphp.iniの設定で
ショートオープンタグをオフに設定すると
xhtmlで作成されたファイルでもXML宣言をしたままPHPを使えます。
php_flag short_open_tag Off
■ .htaccessに記述
AddType application/x-httpd-php .php .html
C:\xampp\xampp\htdocs\test
私の場合htdocs以下のディレクトリには、サイト別になってます。
testフォルダ内の、htmlファイルでPHPを動作させたい場合は、
testフォルダに、.htaccessを配置して下さい。