Intagrate Liteを使って改行ありでInstagramと連携する
こんにちは。羽柴玲です。
今日は、以前の投稿でコメントいただいていた、Intagrate Liteを利用して改行を反映させたい！という、ご要望にお応えするプラグインアップデート方法のご紹介をしたいと思います。
もともと、私のサイトでは、ある文字列をキーに改行を入れる。というアップグレードを入れていたのですが、商業系サイトには向かないモノでした。
なので、時間を見つけつついろいろ試行錯誤しまして、これだ！という対応にまとめてみました。
以前、ご紹介しているハッシュタグ削除関連の対応についても、再度このページでご紹介していこうと思います。
ただ、何度も言いますが、自己責任でお願いします。
どんなアップデートなの？
どんなアップデートかを説明する前に・・・
Intagrate Liteって何？って話を少しだけ。Intagrate Liteは、Instagramの投稿をWordPressへ投稿するためにプラグインです。
そのまま使うと、Instagramの投稿から、1枚目のイメージとキャプションの内容を改行なしでWordPressへ投稿します。
以前は、ハッシュタグを削除してWordPressへ投稿する方法と、特定のハッシュタグ以降のハッシュタグを削除してWordPressへ投稿する方法をご紹介していました。
今回は、特定のハッシュタグ以降のハッシュタグを削除する機能を保持しつつ、Instagramの投稿に含まれる改行を保持したままWordPressへ投稿する方法をご紹介しようと思います。
ご紹介する内容は、ざっくりまとめると以下の内容です。
- 特定のハッシュタグ以降のハッシュタグを削除
- Instagram投稿の改行情報を維持したまま投稿する
- Instagram投稿の最初の改行までの内容をタイトルとして投稿する
- イメージのマウスオーバー時に表示されるテキストはタイトルと同一の内容を設定する
今回は、Intagrate Liteの設定画面で以下の内容を設定していることを前提としています。
- Custom Title Textに「%%title%%」を設定している
- Custom Body Textに「%%title%%」を含めている
やることは、少し多いですが、ソースコードについては、なるべくコピペができるようにしておきます。
さっそくアップグレードしてみる
という事で、やることを順番にご紹介していきます。が、何をやっているかの詳細なご紹介は、今回は割愛します。
理由としては、私が恐らく力尽きるからです…(´・ω・)
用意するもの？
特にこれと言ってはないですが、サーバーへ変更したコードをアップロードする必要があります。
WordPressをインストールしているディレクトリへアップロード可能なツール（FFFTP等）や、レンタルサーバーが提供しているFTPツール等は必要になります。
このサイトは、WordPress用のレンタルサーバーを利用しているので、FFFTPというFTPツールを利用してアップロードしています。
利用している環境に合わせて、必要なものをそろえてください。
あと、コードの編集については、メモ帳等で問題ないですが、エクリプス等の開発環境やサクラエディタと言ったテキストエディタがあると、編集が楽になるかもしれません。
まぁ、メモ帳でも問題はないですが、アップロードする際にちょっと注意が必要かもしれません。
拡張処理用のPHPファイルを作成する
今回は、拡張処理用のPHPファイルを2つ用意します。
以前ご紹介した、ハッシュタグ削除用とタイトルや投稿内容の編集用です。
remHashTag.php – ハッシュタグ削除処理
まず、ファイルを新規作成し「remHashTag.php」というファイル名で保存します。
ファイルの内容は、以下の通り作成してください。
その際に、改行コードや文字コードを設定できるエディタをご利用の場合は「UTF-8」の「LF」で保存してください。
<?php
// ハッシュタグ除去
function remove_hashag($caption) {
$workCap = $caption;
$location = mb_strpos($workCap, "#ブルークリスタルデイジー");
// 最初のハッシュタグの位置を特定
if ($location !== false) {
// ハッシュタグが存在している場合
// ハッシュタグの手前の文字までを取得
$workCap = mb_substr($workCap, 0, $location);
}
return $workCap;
}
?>
mb_strpos($workCap, “#ブルークリスタルデイジー")
これが、特定のハッシュタグ以降を削除するために重要な処理です。ここでは、特定のハッシュタグを「#ブルークリスタルデイジー」としています。
ご自身の投稿に合わせて、違和感のないハッシュタグを指定しておくとよいと思います。
最初のハッシュタグ以降全てのハッシュタグを削除する場合は「#」を指定すれば問題ありません。
ただ、この場合は、文中にハッシュタグを含めるような投稿をしている場合は、投稿した内容が途中で切れてしまいますので、注意してください。
editTitle.php – タイトル・投稿内容編集処理
まず、ファイルを新規作成し「editTitle.php」というファイル名で保存します。
ファイルの内容は、以下の通り作成してください。
その際に、改行コードや文字コードを設定できるエディタをご利用の場合は「UTF-8」の「LF」で保存してください。
<?php
// 最初の改行までを取得
function getTitle($title_text) {
$workTitle = $title_text;
$keyIndex = mb_strpos($workTitle, "[改行]");
if ($keyIndex !== false) {
$workTitle = mb_substr($workTitle, 0, $keyIndex);
}
return $workTitle;
}
// 改行を「[改行]」へ変換
function convertEOF($title_text) {
$workTitle = $title_text;
$workTitle = str_replace(PHP_EOL, "[改行]", $workTitle);
return $workTitle;
}
// 「[改行]」を「<br>」へ変換
function edit_post_data($pos_data) {
$work_pos = $pos_data;
$work_pos = str_replace("[改行]", "<br>", $work_pos);
return $work_pos;
}
?>
このファイルの内容については、特に変更する必要ないです。
ただ、無いとは思うのですが、Instagramの投稿内容に「[改行]」というテキストが含まれている場合、WordPressへ記事を投稿した場合、改行されてしまいますので、注意してください。
何故そうなるかと言うと、Instagram投稿の改行を「[改行]」という文字列へ置換しているためです。特殊文字を除去する処理に改行コードがどうしても含まれてしまうので、手っ取り早い方法として採用しました。
Intagrate Liteのメイン処理を編集する
先ほど作成した拡張処理用のPHPファイルを読み込んだり、呼び出したりするための処理を追加・修正していきます。
instagrate-to-wordpress.phpの編集
以下に存在する「instagrate-to-wordpress.php」というファイルを編集します。
ファイルをダウンロードして編集するか、サーバー上のものを直接編集します。個人的には、ダウンロード⇒編集⇒アップロードの手順をお勧めします。
<WordPressのインストールディレクトリ>/wp-content/plugins/instagrate-to-wordpress/instagrate-to-wordpress.php
このファイルは、Intagrateのメイン処理ファイルです。バックアップを取得して編集をすると安全です。
ファイル読み込み処理の追加
まずは、先ほど作成したファイルを読み込む処理を追加します。
「require_once ITW_PLUGIN_PATH . 'php/emoji.php’」というキーワードを検索し、追加する場所を特定します。
Ver1.3.5では、ファイルの最後の方に記載がありました。
以下のハイライト部分が追加箇所です。（1375行目と1376行目の部分）
if ( version_compare( PHP_VERSION, '5.3', '<' ) ) {
add_action( 'admin_notices', 'intagrate_lite_compatibility' );
} else {
require_once ITW_PLUGIN_PATH . 'php/instagram.php';
require_once ITW_PLUGIN_PATH . 'php/emoji.php';
require_once ITW_PLUGIN_PATH . 'php/remHashTag.php';
require_once ITW_PLUGIN_PATH . 'php/editTitle.php';
require_once ITW_PLUGIN_PATH . 'lib/WPOAuth2.php';
require_once ITW_PLUGIN_PATH . 'lib/TokenManager.php';
require_once ITW_PLUGIN_PATH . 'lib/AdminHandler.php';
require_once ITW_PLUGIN_PATH . 'lib/AccessTokenInterface.php';
require_once ITW_PLUGIN_PATH . 'lib/AbstractAccessToken.php';
require_once ITW_PLUGIN_PATH . 'lib/AccessToken.php';
require_once ITW_PLUGIN_PATH . 'lib/class-http.php';
require_once ITW_PLUGIN_PATH . 'php/class-wpoauth-access-token.php';
// Load plugin
instagrate_to_wordpress::load_plugin();
}
タイトル編集メソッドの追加
次に、取得したキャプションを成形するための一次編集用の処理を追加します。
元々ある「strip_title」の拡張版の様な処理です。このメソッドを編集しない理由は、設定画面でも利用している処理のためです。
設定画面は、元々の処理で表示されるようにしています。
instagrate_to_wordpressのクラス内ならどこでもよいのですが、1363行目あたりに追加します。「settings_page」処理の後です。
以下では、ハイライト箇所が追加した処理です。
<!-- END Wrap -->
</div>
<?php
}
public static function edit_title( $title ) {
$clean = '';
$clean = convertEOF($title); // 改行コードを文字列「[改行]」へ変換
$clean = filter_var( $clean, FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW );
$clean = emoji_html_stripped( $clean );
$clean = remove_hashag( $clean ); // ハッシュタグ除去
$clean = trim( $clean );
return $clean;
}
}
}
if ( class_exists( "instagrate_to_wordpress" ) ) {
Instagram投稿内容の取得処理を編集
これは、Instagram投稿内容を取得している処理で、キャプションの一次編集処理を呼び出している箇所があります。
その処理を、先ほど作成したタイトル編集メソッドの呼び出しに変更します。
- 「“title" => ( isset( $image->caption ) ? self::strip_title( $image->caption ) : “" )」を検索します。
- 検索でヒットした場所の「strip_title」という記述を「edit_title」に変更します。
foreach ( $ig_images as $image ): $images[] = array( "id" => $image->id, "title" => ( isset( $image->caption ) ? self::strip_title( $image->caption ) : "" ), "image_small" => $image->media_url, "image_middle" => $image->media_url, "image_large" => $image->media_url, "created" => $image->timestamp, ); endforeach;
上記の内容を以下の様に変更できていれば問題ないです。
foreach ( $ig_images as $image ): $images[] = array( "id" => $image->id, "title" => ( isset( $image->caption ) ? self::edit_title( $image->caption ) : "" ), "image_small" => $image->media_url, "image_middle" => $image->media_url, "image_large" => $image->media_url, "created" => $image->timestamp, ); endforeach;
投稿記事本文の編集処理を追加
次は、投稿記事本文へ改行を反映する処理を追加します。
変更内容自体は、さほど難しくはないです。「blog_post」メソッド内の処理を1か所修正するだけです。
- 「$post_body = str_replace( “%%title%%", $orig_title, $post_body )」を検索します。
- 検索でヒットした場所の「$orig_title」という記述を「edit_post_data( $orig_title )」に変更します。
//check if %%title%% has been used
$pos = strpos( strtolower( $customtext ), '%%title%%' );
if ( $pos === false ) {
//no %%title%% found so put instagram title after custom title
$post_body = $post_body;
} else {
//%%title%% found so replace it with instagram title
$post_body = str_replace( "%%title%%", $orig_title, $post_body );
}
上記の内容を以下の様に変更できていれば問題ないです。
//check if %%title%% has been used
$pos = strpos( strtolower( $customtext ), '%%title%%' );
if ( $pos === false ) {
//no %%title%% found so put instagram title after custom title
$post_body = $post_body;
} else {
//%%title%% found so replace it with instagram title
$post_body = str_replace( "%%title%%", edit_post_data( $orig_title ), $post_body );
}
投稿記事タイトルの編集処理を追加
次は、投稿記事タイトルを反映する処理を追加します。
変更内容自体は、さほど難しくはないです。「blog_post」メソッド内の処理を1か所修正するだけです。
- 「$post_title = str_replace( “%%title%%", $post_title, $customtitle )」を検索します。
- 検索でヒットした場所の「$post_title」という記述を「getTitle( $post_title )」に変更します。
//Custom Post Title
if ( $customtitle != '' ) {
$pos = strpos( strtolower( $customtitle ), '%%title%%' );
if ( $pos === false ) {
//no %%title%% found so put instagram title after custom title
$post_title = $customtitle;
} else {
//%%title%% found so replace it with instagram title
$post_title = str_replace( "%%title%%", $post_title, $customtitle );
}
$debug .= "--------------Custom Ttle: " . $post_title . ' -- ' . Date( DATE_RFC822 ) . "\n";
} else {
if ( $post_title == '' || $post_title == null ) {
$post_title = $defaulttitle;
}
}
上記の内容を以下の様に変更できていれば問題ないです。
//Custom Post Title
if ( $customtitle != '' ) {
$pos = strpos( strtolower( $customtitle ), '%%title%%' );
if ( $pos === false ) {
//no %%title%% found so put instagram title after custom title
$post_title = $customtitle;
} else {
//%%title%% found so replace it with instagram title
$post_title = str_replace( "%%title%%", getTitle( $post_title ), $customtitle );
}
$debug .= "--------------Custom Ttle: " . $post_title . ' -- ' . Date( DATE_RFC822 ) . "\n";
} else {
if ( $post_title == '' || $post_title == null ) {
$post_title = $defaulttitle;
}
}
サーバーへアップロードする
最後にFTPを利用しサーバーへファイルをアップロードします。
まずは、以下の2ファイルです。
- remHashTag.php
- editTitle.php
これらはのアップロード先は、
<WordPressのインストールディレクトリ>/wp-content/plugins/instagrate-to-wordpress/php/
になります。
UTF-8のLFで保存している場合は、バイナリーモードでアップロードしてください。
メモ帳を利用している場合は、アスキーモードでアップロードしてください。
最後は、以下の1ファイルです。
- instagrate-to-wordpress.php
これのアップロード先は、
<WordPressのインストールディレクトリ>/wp-content/plugins/instagrate-to-wordpress/
になります。
サーバーのファイルを直接編集している場合は、アップロードは不要です。
そうでない場合は、忘れずアップロードしてください。
アップロードのモードは、ダウンロード時と同じモードでアップロードしてください。
ダウンロードに、バイナリモードでダウンロードしている場合は、バイナリモードでアップロードします。
アスキーモードでダウンロードしている場合は、アスキーモードでアップロードしてください。
最後は動作確認
アップロードが全て完了すれば、次回連携時からアップロード版で連携されるはずです。
ただ、タイミングが悪ければ、次々回になるかもしれません。
Instagramへ投稿し、思った通りの内容で連携されていれば問題ないです。
例えば、こんな感じです。
ご覧のブラウザによっては、WordPress投稿の埋め込みがうまく表示できていないかもしれないです。
その場合は、リンクをクリックしていただければ、投稿内容はご確認いただけるかと思います。
まとめ
いかがでしたでしょうか。
ちょっと、専門知識とかないと難しい箇所があるかと思いますが、わりといい感じにできていると思っています笑（自画自賛）
こちらで、ご紹介するかはわかりませんが、次はタグを追加した状態で連携したいな・・・と考えています。
ただ、ちょっと面倒そうなので、やるかはまだわかりませんが(´・ω・)
あと、Intagrateのプラグインは、最新にしていないとInstagramからちゃんと連携されなかったりします。
なので、プラグインをきちんとアップデートしつつ、拡張機能を都度取り込んでいく運用を頑張ってください！
目安としては、うまく連携されないな？ってときは、必ず確認するようにしてください。
気づかないと、当分の間連携されていないのだが？みたいなことになります(´・ω・)＜私はよくやるけれど・・・
多分、下の方に関連記事として、Intagrate Liteの他の記事が出ていると思うので、良ければそちらも確認してみてください。
と言うわけで、本日はこの辺で……
I will see you again…..