個別投稿ページのdescpritonを本文内容を抜粋して記述する方法 | WordPress | Web関連

2018/02/10

Category :

WordPress

Tags :

カスタムフィールドを利用する方法もありますが今回は記事ごとに記述するのが面倒くさいので本文の内容を抜粋して作成する方法。
以下やりたい事です。

何もせずに本文の内容をdescriptionに入れると・・・

<meta name="description" content="                                <p class="fs-m mb-30-40">パンくずリストの修正は下層全ページに影響するので修正が入っても微動だにしない構成にする。<br>
                                一度あとから仕様変更が入り構造上cssのみの修正では対応不可で変な汗が出てTシャツがぐっしょりした経験あり。<br>
                                下記は今回のパンくずリストの仕様。</p>
                                <ul class="list-normal mb-40-60">
                                    <li>もちろんレスポンシブ対応</li>
                                    <li>JavaScriptは一切使わない。</li>
                                    <li>テキストが長い場合はスクロールバー表示</li>
                                    <li><span class="css-class">.no-scrollクラス</span>を付加するだけでテキストが折り返す仕様（スクロールバー非表示）に変更可能</li>
                                </ul>
                                <div class="link-btn icon icon-blank mb-40-60"><a href="/sample/sample-css-breadcrumb.html" target="_blank"><span>サンプルを見る</span></a></div>
<div class="pre-code-prism mb-20">
<pre class="" data-line="" data-language="HTML"><code class="language-html">&lt;nav class=&quot;breadcrumb&quot;&gt;
    &lt;ul&gt;
        &lt;li&gt;&lt;a href=&quot;/&quot;&gt;TOP&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=&quot;#&quot;&gt;ページ名01&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=&quot;#&quot;&gt;ページ名02&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=&quot;#&quot;&gt;ページ名03&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;span&gt;現在のページ名&lt;/span&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/nav&gt;
</code></pre>

〜〜〜〜 ダブルクォーテーションの中にダブルクォーテーションがあったり、てんやわんや状態なのでここでセコンドからタオル投入 〜〜〜〜〜〜〜〜

当たり前ですがセコンドからタオル投入状態です・・・

このままだと使い物にならないので下記を施します。

テキストのみを抽出したいのでHTMLタグを除去
その他取り除きたい文字列（改行、シングル、ダブルクォーテーション、空白文字）を除去
文字数が多すぎてもSEO的にダメなので制限したい。今回は90文字で。

$post = get_post();//個別投稿記事を取得
$content = $post->post_content;//個別投稿記事の本文を取得
$content = strip_tags($content);//文字列から HTMLタグを取り除く
$remove_str = array("\r\n", "\r", "\n", "'", '"', ' ','　',);//取り除きたい文字列（改行、シングル、ダブルクォーテーション、空白文字）を配列に格納
$content = str_replace($remove_str, "", $content);//文字列　置換
$content = mb_substr($content, 0, 90). '';//文字列の一部を抜粋　今回は90文字
$description=$content;

この$descriptionの値をmetaにecho！

<meta name="description" content="<?php echo $description; ?>">

〜〜〜〜 ついでにogのdescriptionもecho！ 〜〜〜〜〜〜〜〜

<meta property="og:description" content="<?php echo $description;?>">

すると・・・

なんという事でしょう。。。
あんなに汚くて不必要な物ばかりだったソースコードが・・・

加藤みどりさんもびっくりの・・・

<meta name="description" content="パンくずリストの修正は下層全ページに影響するので修正が入っても微動だにしない構成にする。一度あとから仕様変更が入り構造上cssのみの修正では対応不可で変な汗が出てTシャツがぐっしょ">

不必要な記述が全て削除されています。
ブラボーです。めっちゃ楽チンです♪

あとは個別投稿ページかどうかheader.phpで振り分けて

$home_description='ホーム専用のdescriptionの記述になります。'
if ( is_home() || is_front_page()) {
    //サイトトップページ
    $description=$home_description;
}else if(is_single()){
    //個別投稿ページ
    $post = get_post();
    $content = $post->post_content;
    $content = strip_tags($content);
    $remove_str = array("\r\n", "\r", "\n", "'", '"', ' ','　',);
    $content = str_replace($remove_str, "", $content);
    $content = mb_substr($content, 0, 90). '';
    $description=$content;
}

以上。
出来るだけ楽できる箇所は楽したいですね！

※企業サイトなどはテキストが途中で切れるのでカスタムフィールドで個別投稿ページ毎に記述した方がいいかもですね。

※ソースの流用、改変は自由ですが自己責任とさせていただきます。

トラックバック URL

https://keprate.com/web/wordpress/description/trackback/