関連記事を表示させるブログパーツLinkWithinの導入方法

公開日: : 最終更新日:2014/08/14 サイト制作, 関連記事等

スポンサーリンク

LinkWithinについて

ブログに関連記事を表示するパーツ『LinkWithin』を紹介します。

LinkWithinはブログの関連記事を紹介することができるのですが長所は導入が簡単なことです。本ブログで使っているものですが次のようになります。

逆にLinkWithinの短所はカスタマイズ性がほとんど無いということです。上の例では画像のリンクが表示されていましたが、FAQページによるとリンク先のページに画像がなければ(おそらく全て)テキストリンクになってしまうようです。

もし一貫してテキストで表示したかったり、画像で表示したかったりという場合は『Outbrain』や『Zenback』という同様の関連記事表示のブログパーツを使用することをお勧めします。

その場合はこちらの記事を参考にしてみてください。

LinkWithinの導入

LinkWithinのサイトを開いたらメールアドレス、ブログのリンク、ブログの種類を選んでボタンを押すだけです。ブログの種類はWordPress、Bloggerなどありますが、FC2ブログやライブドアブログなどはOtherを選択します。

あとは「Get Widget!」ボタンを押せばおしまいです。コードが出てくるので</body>の前に貼りつけると末尾など適当な場所に関連記事が表示されるようになります。

その他設定

任意の場所に貼りつける

上記のコードを貼りつけただけですと適当なところに関連記事が紹介されてしまいます。そこで、任意の位置にLinkWithinの関連記事を表示させたい場合は以下のようにします。

<div class=”linkwithin_div”></div>

と書いたDIV要素を貼りつけたいところに記述するだけです。ページロード時にDOM操作で追加してもOKです。(このブログではそうしています。)

You mayalso like these stories:の文字を変更する

<script>linkwithin_text=’Your custom text:'</script>

貼りつけたコードに上のコードを足してください。’Your custom text:’を自分の好きな言葉で書き換えればOKです。

<script>
var linkwithin_site_id = ○○○○○;//自分のID
linkwithin_text="関連記事";
</script>

こんな感じにすると『関連記事』という文字に書き変わります。

関連記事が同じものしか表示されない場合

設置してしばらくたっても同じ記事しか表示されない場合があるようです。そのときはサポートに問い合わせることで解決しましょう。

Otherを選んで毎回同じ記事しか表示されない趣旨のメッセージを英語で送りましょう。LinkWithinで同じ記事しか表示されない!?どうすればいいの?』という記事に詳細が載っており、非常に参考になりました。感謝!!

スポンサーリンク
Amazon
  • このエントリーをはてなブックマークに追加

関連記事

関連記事を表示させるブログパーツOutbrainの導入方法

関連記事を表示させるブログパーツOutbrainの紹介です。 このOutbrainの長所は

記事を読む

【TortoiseGit】複数のリポジトリを統合する

やりたいこと 最近WindowsにTortoiseGitを導入してリポジトリを作ったり、履歴をプッ

記事を読む

人気記事・ランダム記事等紹介の忍者レコメンドが大幅にパワーアップした件

以前このブログにて忍者レコメンドの紹介記事を書きました。その際にこのブログにも忍者レコメンドを設置し

記事を読む

さくらサーバーにフォルダをアップロードする方法

さくらサーバーにフォルダをアップロードする…という機能は無いみたいで個別にFTPソフトを使う必要があ

記事を読む

YoutubeのURLリンクを外部プレイヤーのものに正規表現で置換する

Youtubeのアドレスを正規表現を使って抽出して外部プレイヤーのフレームに変換・置換するスクリプト

記事を読む

関連記事を表示するブログパーツまとめ

これまでいくつか関連記事を表示させる方法について記事を3つの記事投稿してきましたが、ここで簡単にまと

記事を読む

ニコニコ動画やYoutubeのRSSフィードもサムネ付きで手軽に表示できるブログパーツ

通常サイトのRSSだけでなく、ニコニコ動画やYoutubeの動画サイトのRSSを読み込んでサムネ画像

記事を読む

Windows7でVirtualBoxとVagrantを使ってローカル開発環境を構築する

Vagrant(ベイグラント)とは http://www.vagrantup.comで入手できる仮

記事を読む

ブログのコメント欄をTwitterやFacebook、はてなのコメントで代用する方法

最近になってコメント欄にスパムっぽいものが大量に飛んでくるようになったのでどうにかしないと、と思い一

記事を読む

任意URLのTweetボタンを複数設置する

TwitterのTweetボタンをWebサイトやブログに複数設置する方法です。複数設置するということ

記事を読む

NVIDIA DIGITSをSupervisorを使って自動起動する

はじめに 先日Ubuntu14.04にDIGITS 5をGPUなしP

【2017年度】GeForce 1080 Ti搭載BTOパソコン比較

はじめに 最近ディープラーニング用にGPUのないPCにDIGITSを

Windows用のシンプルなストップウォッチソフト紹介

Windows(10)でも使える使いやすいKAZAMITimerという

MNISTをDIGITS 5のCPUのみで試す(GPUなし)

はじめに DIGITSを使えばGUI操作で簡単にディープラーニングが

Windowsユーザが初めてMacBookを購入したときの注意点や感想

最近12インチのMacBookを購入しました。今までWindowsしか

Redmine3.2をUbuntu14.04にインストールして躓いた所についてメモ

はじめに Ubuntu14.04 ServerにRedmine3.2

UWSCを使ったソフト自動立ち上げ【SoftEther VPN Server】

やりたいこと 最近SoftEtherという筑波大学発のベンチャー企業

→もっと見る

  • Author : ががんぼ
    プログラミングやWeb関係で気付いたことについてメモしていく予定。だいたいが備忘録ですが、自分でサンプルを作って動かしてみたりしています。
PAGE TOP ↑