関連記事を表示させるブログパーツ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
  • このエントリーをはてなブックマークに追加

関連記事

_rtm0919_tp_v

スマホ向け幅固定サイトの回転時の幅対応方法

幅固定サイトでのスマホ回転時Webサイトの横幅を合わせる方法のメモ。 下記2点の設定が必要です。

記事を読む

zipimage

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

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

記事を読む

PAK12_10naname500-thumb-500xauto-3071

さくらとロリポップのcronについての比較

私は今さくらのレンタルサーバーとロリポップのレンタルサーバーを両方試してみているのですがそのcron

記事を読む

git_fetch

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

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

記事を読む

RSS-Icon-Image

相互RSSサービスのまとめ

ブログやサイトを作ると相互RSSという名前を聞くことがあると思います。相互RSSとはざっくりいうと他

記事を読む

zenbackcomment1

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

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

記事を読む

capturefullpageimg1

指定URLのWebサイトの画面全体をキャプチャする方法

Webサイトのスクリーンショットを撮る方法としてはいくつかありますが、各方法ごとに調べたものを紹介し

記事を読む

encodingtype

【PHP】headerでContent-Typeを指定したのに効かない場合の対処法

PHPでサイトマップを作ろうと思い、XML形式のファイルを出力しようとしてheaderを指定したのに

記事を読む

41e9FqN1XjL._AA180_

人気記事表示ブログパーツの忍者レコメンドを使ってみる

忍者レコメンドとは 今回は忍者レコメンドという人気記事表示のブログパーツを紹介します。忍者レコメン

記事を読む

sliderimage

【jQuery UI】Sliderのオプション変更やイベントを取得をする方法

jQuery UIを使ってスライダー(トラックバー)を作ります。その際に起こるイベントとしてスライダ

記事を読む

encodingtype
【PHP】headerでContent-Typeを指定したのに効かない場合の対処法

PHPでサイトマップを作ろうと思い、XML形式のファイルを出力しようと

_rtm0919_tp_v
スマホ向け幅固定サイトの回転時の幅対応方法

幅固定サイトでのスマホ回転時Webサイトの横幅を合わせる方法のメモ。

rssimage
【PHP】特定のURLからそのAtomやRSSのフィードを抽出する方法

特定のURLからRSSやATOMのフィードを抽出する方法をメモ。 流

rssimage
フィード抽出ツール(RSS1.0、RSS2.0、atom)

任意URL サイト名 サイトURL RSS1.0

computer_server
格安プラン限定レンタルサーバー機能比較表(2016年)

はじめに  最近新しい共用サーバーをレンタルしようと思い調査およびそ

school_toshokan_hondana
kindle unlimitedが便利だったのでお勧めの使い方など感想メモ

 kindle unlimitedというサービスが8/3からAmazo

TAKEBE055122558_TP_V
寝る前にスマホを見ると斜視になる可能性とその対策

はじめに  寝る前などスマホを横になりながら見続けると斜視になる可能

→もっと見る

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