【コピペ一発】ブログの内部リンク構造を可視化するWordPressカスタマイズ

VISUALIZE

内部リンクはSEO的に大事だから可視化して最適化しないとね。

・・・という、プロクラシストさんのこちらの記事に触発されました。

SEO対策!自分のブログの内部リンクを自動で可視化する - プロクラシスト
こんにちは!ほけきよです。 今日は自動化第三弾!! SEO対策ってしてますか? ブログの検索流入をあげるために、Googleには媚を売っていかなければいけないじゃないですか~。 そんなわけで、前回は表示スピード向上にむけた画像圧縮のために、全画像をぶっこ抜いてくる方法を紹介しました。 www.procrasist.co...

上記ははてなブログ向けの方法ですが、WordPressならPCに何かインストールせずにできるかなと思い、突貫で作ってみました。

条件つきですが、コピペ一発で導入できます。

スポンサーリンク
スポンサーリンク

なにがどうなるか

記事の中に貼られた自ドメイン内の記事へリンクが、グラフとして可視化されます。
(ウィジェットやサイドバー等は対象外です)

こちらのページで実際に動いているところが見られます。(PC推奨)

WordPressで記事本文中の内部リンク構造を可視化するデモ
記事本文内の内部リンクを、記事をノード、リンクをエッジとしてグラフ化するデモです。当ブログの記事データをPHPで取得、aタグを解析し...

カスタマイズの方法

子テーマのfunction.phpの最後に以下のコードをコピペします。

動作確認はしていますが、必ずバックアップを取ってください。

使い方

  1. 新しい固定ページか記事を準備する
  2. 本文にshow_article_mapというショートコードを書く
  3. プレビューもしくは公開してページを見る
  4. マップが出てくる
  5. 記事のスラッグをダブルクリックすると記事に飛ぶ

マップが出てくるまで気長に待ってください。JavaScriptで可視化させてるので、少し時間がかかります。

表示する時点で記事の中身を分析しているため、内部リンクを修正したあとにリフレッシュすれば最新の状況が反映されます。

スポンサーリンク

注意点

注意点は以下のとおりです。

  • 投稿IDを使ったショートコードによるブログカード(AFFINGERやSTINGERなど)は内部リンクとして識別できません。記事内にべた書きしたaタグのみ識別可能です → ショートコードも展開するようにしました
  • 事前にカテゴリが階層化されている&1記事に1つのカテゴリが付加されていることを前提に作っています(複数のカテゴリがついている場合、片方だけ反映されます)
  • カテゴリの色分けはトップレベルのみ対応です(当ブログでいう「仕事術」とか)
  • パフォーマンス度外視で動くものを作っています。300記事くらいのこのブログならまだ動きますが、1000記事レベルだとパソコンが悲鳴を上げるかもしれません
  • ダブルクリックで記事に飛ぶところでjQueryを使っています。脱jQueryしている方はお気をつけください
スポンサーリンク

まとめ:内部リンク構造を最適化しよう

というわけで、突貫工事でひとつ作ってみました。

内部リンク構造の最適化にお役立てください。

もう少し内部処理を最適化したり、可視化のやりかたを選べるオプションをつけられたら(やる余裕があったら)プラグイン化してみようと思います。

この記事が役に立ったら
いいね!をどうぞ

ブログで言えない話はTwitterにて
スポンサーリンク
スポンサーリンク
スポンサーリンク
おすすめ記事

こんな記事も読まれています