ブログリンクの貼り方！リンク切れにも自動対応させる超簡単な方法

ブログでリンクの貼り方について悩んでいる皆さんに朗報です！

最近ではブログの文末に参考リンクとして内部リンク集を貼りつけるブロガーが増えましたよね？でも、リンク切れの管理が大変という声もよく聞きます。

本記事では、ワードプレスのテーマファイルエディタにコピーペーストするだけで、簡単に内部リンクの貼りつけが自動で出来るPHPプログラムについて解説します。

しかも、このプログラムを使えば、ソースコード側から一括して内部リンクの数を指定する事も、個別に数を指定する事も可能になります。

他にも、下書き・削除・非公開にしたときに消し忘れたリンク切れした内部リンクの自動差し替えにも対応しています。

プログラミングの難しい知識が無くても大丈夫！ワードプレスのテーマファイルエディタのfunctions.phpに張り付けるだけで、簡単に誰でも内部リンクを貼りつける事が出来ます。

プラグインは無駄な機能が多く、ページエクスペリエンスを悪化させる可能性があるし、リンク切れした内部リンクはSEOに悪影響！！

そんな内部リンクに纏わる問題はこの記事で全て解決します。

この記事は、元プログラマーの筆者が独自に制作した、ワードプレス用の内部リンク用PHPプログラムについて解説しています。

記事の要約とポイント

テーマファイルエディタに張り付けてショートコードで内部リンクのプログラムを読みだすだけで超簡単！
下書き・削除・非公開でリンク切れした記事を削除し、新しいリンクに自動差し替えします。
ソースコード側で表示する内部リンクの数を一括指定可。ショートコード側で個別指定も可能。
メリットは動作が軽い！シンプルなのでSEOやエクスペリエンスに影響を与えない所がポイントです。

ブログリンクの貼り方の基本と実際
ブログリンクの貼り方応用編！面倒な作業は全自動化

ブログリンクの貼り方の基本と実際

ブログを運営していると、リンクの扱いについて知る必要が出てきます。

このリンクは、例えるならば本のページをめるくボタンのようなものですが、これがかなり厄介です。

現実世界では、本自体(サーバ)やページ(記事)は無くなる事はありませんが、インターネットの世界ではこれが頻繁になくなります。

なんらかの原因でサーバ(本)がダウンして、本の本体自体がなくなったり、本のページ(つまり記事)を非公開にしたりすると、その部分の記事が読めなくなります。

読めなくても、ページをめくるという動作に値するボタンは存在する為、存在しない記事のページをユーザーに開かせるという無駄な行動が発生します。

ブログにはもう一つ厄介な点が存在します。

このような見えないはずのページが大量に存在すると、グーグルから低評価を受けて自身のブログ記事が検索エンジンに上位表示しにくくなるというデメリットが発生します。

本屋(グーグル)からしてみると、読めないページが大量に存在する本等、書店に置く意味がありませんよね？

つまり、目立つディスプレイにはレイアウトされずに、すみっこの方に雑におかれてしまうというわけです。

他のブログ記事では、テーマ別に対応したブログリンクの貼り方の解説はゴマンとされていますが、実際に切れたリンクをどのように対応するかなどの実践的な知識を解説していません。

以降の見出しでは、ブログ記事の張り方の基本から注意点、筆者が実際にブログで使用しているリンク切れ対策プログラムの解説まで詳しく解説しています。

ブログ記事が何千記事と公開されていると、それだけでリンク切れの対応をするのが大変です。

しかし、この記事を全て読めばリンク切れの問題は全て解決します。

ブログリンクの貼り方とは？

リンクの貼り方

ワードプレス

外部リンク

内部リンク

許可・禁止

ブログでリンクの貼り方については、ワードプレスではリンクを貼りつければURLとして認識され、自動でブログカード形式に変換されます。また、内部リンク・外部リンク共に同様です。ブログの外部リンクを貼るのに基本的に許可は不要です。禁止という事もありません。

Wordpress内部リンクの貼り方の基本
ワードプレス外部リンク張り方の基本
ブログにリンクを貼るのに許可は必要？「基本不要です」
スマホではてなブログやアメブロから内部・外部リンクの貼り方は？

WordPress内部リンクの貼り方の基本

基本的なリンクの貼りつけについては、有名なサーバであるコノハでも解説されています。

【WordPressにリンクを設定】基本から応用までを徹底解説！｜ワプ活

WordPressにリンクを設定する方法、リンクを貼る方法を解説します。通常のテキストリンクはもちろん、画像リンクやボタンリンクなども画像付きで解説。内部リンク、外部リンク、ページ内リンクの使い分けなども説明しています。

ワードプレスの内部リンクの貼り方に関しては、ブログ運営の基礎なので、解説しているサイトはゴマンとある為、詳しくは解説しませんが、おさらいだけ。

基本的にはURLをブログ記事に張り付ければ、Cocoonなどのよく使われているテーマであれば、自動でブログカードのような形式で認識されます。

ワードプレス外部リンク張り方の基本

リンクには内部リンクと外部リンクが存在しますが、内部リンクは自分のサイトの別記事へのリンクの事です。

外部リンクはよそのサイトを引用や参考サイトとして載せる時にしようしますが、特にサイトオーナーに許可を得る必要はありませんし、禁止もされていません。

張り方については、内部リンクと同様で、URLをブログに張り付ければブログカードのような形式で認識されます。

ただし、これはブロックエディタの話で、テキストエディタの場合は<a>タグが必要です。

ブログにリンクを貼るのに許可は必要？「基本不要です」

ブログにリンクを貼るのに許可は必要ないと書きましたが、張り方によっては著作権や商標権の侵害となる事があるので注意が必要です。

例えば、他人の画像を勝手に使用し、その画像にリンクを貼る行為は著作権の侵害に当たる為、不可です。

スマホではてなブログやアメブロから内部・外部リンクの貼り方は？

最近、noteやはてなブログやアメブロの勢いが凄く、SEOで上位表示されている記事が散見できます。

コロナもあってか、ブログで稼ごうという方も増えている気がします。

アメブロやはてなブログでは、HTML等の専門知識がゼロでも簡単にブログ運営ができ、かつ上位表示もしやすいので、手軽にブログ運営をしたい方には重宝されています。

スマホでもPCでも、無料ブログであるはてなブログやアメブロの操作方法は殆ど遜色ありません。

基本はエディターで文章を書いて、リンクを貼りたい部分を選択したら、リンクのアイコンを押下し、リンクのURLを張り付けるだけで作業は終了します。

ただ、リンクを貼りつけるに当たり、別ページに遷移するかどうかを考える必要があり、target属性で決めることが出来ます。

ブログリンクの貼り方応用編！面倒な作業は全自動化

これまでリンクの貼り方について、簡単に解説してきましたが、リンクにはただ貼りつけるだけでは管理上の問題が発生する事が理解できたと思います。

最近では、参考リンクとして記事の末尾にリンク集を貼りつけるブログをよく見かけます。

関連性のある内部リンク・外部リンクは共にSEO上とても重要な役割を果たすため、必ず入れなければいけない施策です。

しかし、本来SEO上有利に働くはずの内部リンクや外部リンクは、ひとたびリンク切れを起こすと凶器に変わります。

大量のリンク切れを放置すると、ユーザー体験の低下を招き、それだけで順位低下の原因となり、今度はSEOにおいて悪影響となります。

ですが、ブログ運営歴が長く、記事数が多いとリンク切れを管理するのはとても大変です。

おそらく多くのブロガーは、BrokenLinkChecker等のプラグインで、リンク切れを知る事になると思います。

このプラグインには切れたリンクを削除して差し替える機能までは存在しませんし、このようなプラグインは、定期的に実行されサーバで高負荷になりがちです。

サーバが高負荷になると、ユーザーのエクスペリエンスが低下し、SEOにも悪影響を及ぼします。

そこで、自分でいれた内部リンクだけでも自動で削除や下書きにされたことを検知し、有効なリンクへ差し替えるプログラムの出番となるわけです。

ブログリンクの貼り方応用編

ショートコード

functions.php

テーマファイルエディタ

PHP

ソースコード

ブログの内部リンクは張り付けた後に記事を削除したり非公開にすると、リンク切れが発生します。気が付かずに放置すると、SEO…つまり検索順位にも悪影響を及ぼすので、リンク切れしたURLを自動差し替えするソースコードを制作しました。

①リンク自動化プログラムの説明
②準備編：PHPプログラムの用意とテーマファイルエディタへの貼りつけ
③使い方編：ショートコードで好きな箇所にリンクを出力
ブログリンクの貼り方まとめ

①リンク自動化プログラムの説明

このプログラムは、プラグインではないのでワードープレスの外観＞テーマファイルエディタ＞functions.phpに張り付けて、ショートコードで読み出す必要があります。

ただし、サーバに負荷をかけずに軽く動作するというメリットがあります。

膨大な数張り付けた内部リンクを、記事側やプログラム側で制御することが出来ます。

プログラム利用の注意点

本ソースコードは、外部リンクをチェックするものではありません。また、チェック可能な内部リンクはショートコードで読み出した内部リンクのみが対象となり、ブログ全体のリンクを自動でチェックするものではありません。

プログラムの動作としては、記事のカテゴリーからブログ記事のタイトルとURLをランダムに取得して、参考リンク集として表示します。

削除・下書き・非公開にした記事は即座にリンク切れと判断され、新しい記事URLに差し替えられます。

記事一覧はショートコードを使用して読み出すことが出来ます。

[fixed_random_category_related posts="6"]

として、ショートコードブロックか、カスタムHTMLブロックに張り付ければ、functions.phpに書いたコードを読み出し、参考リンク一覧を生成します。

以下は、ダッシュボード＞外観＞テーマファイルエディタ＞functions.php

に張り付けるソースコードです。

// 固定関連記事ショートコード
// [fixed_related posts="6"]
function fixed_random_category_related_posts_shortcode($atts) {
    global $post;
	
	// [fixed_random_category_related posts="6"]のままで、コード側で10件に変更
	/*
    $atts = shortcode_atts(array(
        'posts' => 6,
    ), $atts, 'fixed_random_category_related');

    $required_posts = intval($atts['posts']);
	*/
	// 以下の数値を変更↓
	$required_posts = 10;
    $meta_key = '_fixed_related_posts_category';
    $saved_related = get_post_meta($post->ID, $meta_key, true);
    $saved_related = is_array($saved_related) ? $saved_related : array();

    $categories = wp_get_post_categories($post->ID);
    if (empty($categories)) {
        return '<p>関連記事はありません。</p>';
    }

    // 公開記事のみを抽出
    $public_related = array();
    if (!empty($saved_related)) {
        $query = new WP_Query(array(
            'post_type' => 'post',
            'post__in' => $saved_related,
            'orderby' => 'post__in',
            'post_status' => 'publish',
            'posts_per_page' => $required_posts,
        ));
        if ($query->have_posts()) {
            while ($query->have_posts()) {
                $query->the_post();
                $public_related[] = get_the_ID();
            }
        }
        wp_reset_postdata();
    }

    // 不足分を補充
    $remaining = $required_posts - count($public_related);
    if ($remaining > 0) {
        $exclude_ids = array_merge(array($post->ID), $public_related, $saved_related);
        $args = array(
            'post_type' => 'post',
            'posts_per_page' => $remaining,
            'post__not_in' => $exclude_ids,
            'category__in' => $categories,
            'orderby' => 'rand',
            'ignore_sticky_posts' => 1,
            'post_status' => 'publish',
        );
        $query = new WP_Query($args);
        if ($query->have_posts()) {
            while ($query->have_posts()) {
                $query->the_post();
                $public_related[] = get_the_ID();
            }
        }
        wp_reset_postdata();
    }

    // 投稿メタを更新して次回も固定化
    if (!empty($public_related)) {
        update_post_meta($post->ID, $meta_key, $public_related);

        $query = new WP_Query(array(
            'post_type' => 'post',
            'post__in' => $public_related,
            'orderby' => 'post__in',
            'posts_per_page' => $required_posts,
        ));

        if ($query->have_posts()) {
            $output = '<div class="fixed-related-posts">';
            while ($query->have_posts()) {
                $query->the_post();
                $output .= '<div class="related-post" style="align-items: center;">';
				$output .= '<i class="fa-regular fa-circle-check fa-1g" style="color: #c1b9b9;"></i> ';
                $output .= '<a href="' . get_permalink() . '" style="font-size:17px;">' . get_the_title() . '</a>';
                $output .= '</div>';
            }
            $output .= '</div>';

            wp_reset_postdata();
            return $output;
        }
    }

    return '<p>関連記事はありません。</p>';
}
add_shortcode('fixed_random_category_related', 'fixed_random_category_related_posts_shortcode');

以下のように$required_postsに代入した数値を変更する事で、デフォルト10件の参考リンク一覧が取得できます。

表示する参考記事一覧を全記事固定化する場合は、以下のコード(つまりデフォルトのまま)のままでよいでしょう。

	/*
    $atts = shortcode_atts(array(
        'posts' => 6,
    ), $atts, 'fixed_random_category_related');

    $required_posts = intval($atts['posts']);
	*/
	// 以下の数値を変更↓
	$required_posts = 10;

逆に、$required_posts = 10;を削除し、コメントアウトを解除する事で、ショートコード側で設定した数値が有効となります。

    $atts = shortcode_atts(array(
        'posts' => 6,
    ), $atts, 'fixed_random_category_related');

    $required_posts = intval($atts['posts']);

もし、リンクの文字やアイコンを整形したい場合は、fontawesomeを使ったアイコンをサーバに設置するか、CDN形式で読み出します。

cocoonであれば、デフォルトでfontawesomeを読み出す事が可能です。

リンク部分の表示はリストではなく、DIVタグでくくって出力しており、デザインも本来CSSを別に書きたいところですが、なるべく手間を減らすためあえてstyle内に書きました。

            $output = '<div class="fixed-related-posts">';
            while ($query->have_posts()) {
                $query->the_post();
                $output .= '<div class="related-post" style="align-items: center;">';
				$output .= '<i class="fa-regular fa-circle-check fa-1g" style="color: #c1b9b9;"></i> ';
                $output .= '<a href="' . get_permalink() . '" style="font-size:17px;">' . get_the_title() . '</a>';
                $output .= '</div>';
            }
            $output .= '</div>';