【Django初学者必見!】効率よくページタイトルとメタディスクリプションを設定する方法を解説!

Django

(最終更新月:2021年10月)

前回の記事では、開発した日報アプリをGoogleサーチコンソールへ登録する方法を解説しました

ただ、当アプリには適切なタイトルとメタディスクリプションが設定されていません

タイトルは検索エンジンが「どんなテーマでそのページが書かれているか?」を判断するために最重要項目と言われています

メタディスクリプションは検索結果でページの紹介として表示されますので、ユーザーの方が目を通し「どのページが自分の興味に近いか?」を判断するものになっています

つまり、タイトルとメタディスクリプションはとても重要!ということです

当記事では、

  • DjangoをベースとしたWebアプリでタイトルメタディスクリプションを設定する方法

を解説します

あくまでも一例としてではありますが、初心者の方へ参考になれば幸いです!

スポンサーリンク

コードの紹介

templates > base.html

HTMLテンプレート内、記載場所はheadタグ内になります

  <head>
  ...

    {% block meta_desc %}
      {% if meta_description %}
        <meta name="description" content={{meta_description}}>
      {% endif %}
    {% endblock %}
  ..
    
   <title>{% block head_title %}【日報アプリ】D-Repo{% endblock %}</title>
    ..
  </head>

タイトルはブロックタグメタディスクリプションはブロックタグとコンテキストを使い記述しています

このbase.htmlへどのように値を渡していくかをそれぞれ見ていきましょう

【コード】タイトルを渡す

templates > nippo > nippo-list.html

{% block head_title %}{{ block.super }} | 公開済み日報一覧{% endblock %}

{{ block.super }}でextends元を継承し、且つ、新たなタイトルを追記しています

もちろん、{{ block.super }}を省けば、新たなタイトルのみ表示されます

スポンサーリンク

【コード】メタディスクリプションを渡す

nippo > views.py

def get_context_data(self, **kwargs):        
    meta_desc = "..当ページで適用したいディスクリプション"
    ctx["meta_description"] = meta_desc

クラスベースビューであれば、get_context_dataメソッドを使い、HTMLテンプレートへ値を渡します

この場合受け取り側のキーは「meta_description」になります

ランディングページ

{% block meta_desc %}
    <meta name="description" content="ようこそ!簡易日報アプリ「D-Repo」へ!こちらは無料で使える日報アプリのデモサイトになります!「Webアプリはとてもカンタンで便利!」を感じてみよう!">
{% endblock %}

ランディングページは、views.pyを経由せずにurls.py上でTemplateViewにより直接表示しています

そのため、コンテキストを使用せず、ブロックタグにより記述をしています

まとめ

タイトル、メタディスクリプションを表示するために、

  • 記載場所はheadタグ内で、
  • メタディスクリプションはブロックタグ、もしくはコンテキストで渡す
  • タイトルはブロックタグで表示する

ことで効率よく、ページごとに異なった値を渡すことができます

他にもやりかたはいろいろとあるかと思いますので、あくまでも参考になれば幸いです

次回の記事では、問い合わせフォーム・ページを作る方法を解説します

✔当ブログは以下のような方に向けて書かれています

「Djangoでのアプリ開発を学びたい!」

「Djangoで開発したアプリをWebで公開するにはどうするの?」

✔当ブログ掲載の記事

  • Djangoで作る日報アプリ開発
  • WebアプリをWeb上に公開する方法
  • Webアプリ開発に必要なそのほかの情報
【Django】チュートリアル|日報アプリの開発から公開まで
Djangoのチュートリアルをお探しですか?具体的に「手を動かして作ってみたい!」という方へ向けて、誰でもできる簡易的な日報アプリの開発を通じて、Djangoの様々な機能に触れていくシリーズとなっています。PythonでWebアプリを作りたい方、必見の記事となります!

公式LINEも始めました。記事更新についてや、当ブログ内の人気記事などの情報を定期的に配信しています。

友だち追加

ITCブログにご協力いただける方は、以下もご検討いただけると嬉しいです。

ITCに投げ銭をする

タイトルとURLをコピーしました