直訳すると単語出版社。ども、WordPressフレッシュマンのオレっち（@yashiki55）です。

みなさん、ブログで関連記事の表示をしてますか？オレっちはWordPressプラグインを利用して「LinkWithin」←なんて読むのかわからん(；ﾟдﾟ)を使ってます。

今日はそのLinkWithinのお話。 

自動でスマートフォン用の表示にしてくれるプラグイン「WPtouch」でもデフォルトでは対応してくれない。

ブログの各記事の下には、関連記事もサムネイル付で紹介しちゃおうか。ってな思いでLinkWithinを使わせていただいておるんです。←実際には「お願いだから他の記事も見て。」ってキモチです。|дﾟ)ﾁﾗｯ

 

 

パソコンで見てみると「こんな記事もいかがですか？」つって、4つほどご紹介しております。紹介する記事はLinkWithinさんが勝手に選んでくれております。

 

 

だがしかーし！これをWPtouchを介してiPhoneで見てみると(；ﾟдﾟ)ｺﾞｸﾘ…

 

 

き、き、切れてる…( ꒪⌓꒪)

 

こんなの、何とかしたいですよね。

そこで。ググりました。ググってなんぼ。探しましたよ。

そしたらアナタ、見つけました。見つかりましたよ。

こちらのやよこぶろぐさんにお世話になりました。(*´∀｀*)ｱｻﾞｰｽ
LinkWithinのスマートフォンビュー(WPtouch)がはみ出るので直してみました！ | やよこぶろぐ

しかし、やよこぶろぐさんの記事に全身全霊でしたがって、身を粉にしつつ涙を流しながらやってみた結果、3つ目の切れてた記事が消えて、2つ表示になっただけでした。

でしたーー。（笑）

ま、そのことはやよこぶろぐさんも触れてらっしゃったので、そんなに驚きゃしなかったのですが、そこはやよこぶろぐさん、頑張っておられました。
LinkWithinがWPtouchで見るとはみ出るその後☆scroll&タイトル☆ | やよこぶろぐ

記事によると・・・なんと横スクロールで全て表示ができるとな！

もうかなりの興奮状態で鼻をフンッフンッとさせながらやってみました。

CSSをイジってスクロール指定してやったぜ。

 

一応、その方法を備忘録。

作業としてはWPtouchのstyle.cssに、横スクロールできるようにするんだよ、というコードを追記するというコトになります。

しかし、WordPressの管理画面から入って探しても、もちろんプラグインの編集を探してもWPtouchのstyle.cssファイルにはたどり着けないんです。

 

そこで、サーバーにアップしてるファイルの中から探して直接編集しちゃいます。次のように探してみてね。

サーバーの中でWordPressをインストールしてあるディレクトリ＞wp-content＞plugins＞wptouch＞themes＞default＞style.css

んで、見つけたstyle.cssファイルをテキストエディタで開きます。

 

そして一番下の方へ行きます。2580行目くらいですかね。なんしか一番下の方です。

そこに、「/* @group Social Share */」と記述された箇所がありますので、その中に次の赤字で記したコードを追記します。

 

/* @group Social Share */
.leftcontainerBox {
display: none !important;
}
div.linkwithin_outer {
width:237px;
overflow:hidden;
}

/* @end */

で、overflow:hidden;のところをoverflow:scroll;に変えると横スクロールが出来るようになっちゃうんです。φ(ﾟДﾟ )ﾌﾑﾌﾑ…

追記をしたらWPtouchのstyle.cssを上書き保存します。

 

検証。iPhoneで見てみませう。

(:.;ﾟ;Д;ﾟ;.:)ﾄﾞｷﾄﾞｷ

 

お！う、うごく。動いてるよ。

 

 

なんて爽快なんでしょう。ヾ(´▽｀*)ゝﾜｰｲ♪

iPhoneユーザーの皆さん、ぜひ見てみてくだせぇ。やってみてくだせぇ。

 

 

やよこぶろぐさん、本当にありがとうございました。( ^ω^ )ｵｵｷﾆ♪

 

ちゃお。