django django-meta で、OGP タグ を埋める


OGP タグを設定してなかったのですが、
どうせなら、django plugin で何かないか探したところ、
nephila/django-meta: Pluggable app to allow Django developers to quickly add meta tags and OpenGraph, Twitter, and Google Plus properties to their HTML responses.
というdjango plugin を見つけました。

下記のtemplateタグの実装を見る限り、大概のタグがなんとかなりそうでしたので、
こちらをインストールして、タグの設定をしていきたいと思います。
django-meta/meta.py at develop · nephila/django-meta


前提

python, django の version は以下になります。

  • python

    python2.7 -V
    ================
    Python 2.7.8
    ================
    

  • django

    pip list | grep Django
    ================
    Django (1.10.6)
    ================
    


インストール と 設定

django-meta をインストールして、
settings.py に追加します。

  • pip install

    pip install django-meta
    =======================
    Successfully installed django-meta-1.3.2
    =======================
    

  • settings.py に追記

    INSTALLED_APPS = (
        ....
        'meta',
    )
    


テンプレートにタグを記述

View support — Django Meta 1.1.post1 documentation
を見る限り、meta という辞書を作って、必要なkey, value を設定、
テンプレート内で、{% include "meta/meta.html" %} を記述すると、
いい感じで書き出してくれるようです。
現在の状況だと、うまくmeta を生成して、設定しておくポイントがないので、
meta.html に記載されているタグを直接使うようにしました。

必要そうなタグは、Facebook・TwitterのOGP設定方法まとめ|ferret [フェレット]
を参考に設定しました。

  • template の抜粋
    {% spaceless %}                                                                                                                    {% autoescape off %}
        {% og_prop 'title' blog_post.title %}
        {% og_prop 'url' blog_post.get_absolute_url %}
        {% og_prop 'description' blog_post.description %}
        {% og_prop 'type' "article" %}
        {% if settings.SITE_TITLE %}{% og_prop 'site_name' settings.SITE_TITLE %}{% endif %}
        {% facebook_prop 'app_id' "YOUR_APP_ID" %}
        {% twitter_prop 'card' "summary" %}
    {% endautoescape %}
    {% endspaceless %}
    

その他 django-meta の インストール作成中に気づいたこと

TemplateSyntaxError: Could not parse the remainder: '"' from '"' エラー

{% facebook_prop 'app_id' "YOUR_APP_ID" %}  
{% facebook_prop 'app_id' "YOUR_APP_ID"" %}  
と、ダブルクォートを1つ余計に打って記載していたところ、このエラーが発生しました。

autoescape off しないで記載すると

以下 StackOverFlow の 記事に記載があります。
render - rendered script display inside body template django - Stack Overflow

head 内で、エスケープされたタグが存在すると、
ブラウザ が text だと判断して、それをbodyタグ内に移動すると
実際移動されていて、どこで誰が介入しているかわからなかったのですが、
ブラウザ がやっているようです。


使ってみた感想

{% include "meta/meta.html" %} を使って、サーバー側で、meta 情報を設定することが、
できたら、記載もまとまっていい感じになりそうに思いました。
中のテンプレートタグだけ取り出して、記載していくのは、
正直、直書きするのとあんまり変わらないかもしれません。

以上です。

コメント