From 9583d74d708f68392f6f184c29c6d4dcc00bcc4b Mon Sep 17 00:00:00 2001 From: "Mr. Senko" Date: Thu, 31 Mar 2016 23:11:12 +0300 Subject: [PATCH] Refactor Twitter cards support Remove the TWITTER_HANDLE variable and use the 'twitter' value from SOCIAL. This eliminates duplicate settings! Remove closing slash for meta tags, not required by HTML5, see http://stackoverflow.com/a/21898502 In article.html Twitter images were specified twice - once as relative URL and once as full site URL. Now only a single full URL is used instead. Also stripped HTML tags from description. The default card type is summary_large_image which better displays with high-res images and the default header images. ``twitter_image`` article metadata is now supported, similar to ``og_image``. Documentation is updated. --- README.md | 25 +++++++++++++----------- templates/article.html | 43 +++++++++++++++++++++--------------------- templates/base.html | 16 ++++++---------- 3 files changed, 41 insertions(+), 43 deletions(-) diff --git a/README.md b/README.md index 5f38b81..5cd726d 100644 --- a/README.md +++ b/README.md @@ -103,13 +103,6 @@ Accept many analytics: - Gauges: ``GAUGES`` - Piwik: ``PIWIK_URL`` and ``PIWIK_SITE_ID``. -### Twitter cards - -Twitter cards are automatically generated if TWITTER_HANDLE is set: -```python -TWITTER_HANDLE = "myprofile" -``` - ### Other configuration - If ``ADDTHIS_PUBID`` is defined sharing buttons from AddThis will appear @@ -122,10 +115,18 @@ TWITTER_HANDLE = "myprofile" ### Articles -To customize header cover to articles, insert the metadata ``header_cover``. -To customize OpenGraph images, insert the metadata ``og_image``, otherwise -``header_cover``, ``HEADER_COVER`` or a default image is used. You can also -use absolute URLs for ``og_image``. Example: + - To customize header cover to articles, insert the metadata ``header_cover``. + - To customize OpenGraph images, insert the metadata ``og_image``, otherwise + ``header_cover``, ``HEADER_COVER`` or a default image is used. + - To customize Twitter card images, insert the metadata ``twitter_image``, + otherwise ``header_cover``, ``HEADER_COVER`` or a default image is used. + Twitter cards are automatically generated if the ``twitter`` icon is configured + in ``SOCIAL``! + +All image paths are relative from the site root directory. You can also use +absolute URLs for ``og_image`` and ``twitter_image``. + +Example: - To RST @@ -142,6 +143,7 @@ My super title :summary: Short version for index and feeds :header_cover: /images/posts/super-title/cover.png :og_image: /images/posts/super-title/facebook_cover.png +:twitter_image: /images/posts/super-title/twitter_cover.png ``` - To Markdown @@ -156,6 +158,7 @@ Authors: Alexis Metaireau, Conan Doyle Summary: Short version for index and feeds Header_Cover: /images/posts/super-title/cover.png Og_Image: http://example.com/facebook_cover.png +Twitter_Image: http://example.com/twitter_cover.png This is the content of my super blog post. ``` diff --git a/templates/article.html b/templates/article.html index 3474864..55ca2aa 100755 --- a/templates/article.html +++ b/templates/article.html @@ -26,34 +26,33 @@ {% endblock %} {% block twitter_card %} - {% if TWITTER_HANDLE %} - {% if article.header_cover %} - - - {% elif HEADER_COVER %} - - - {% else %} - - - {% endif %} - - - {% if description %} - - {% elif article.headline %} - - {% else %} - - {% endif %} - {% if article.header_cover %} + {% for name,link in SOCIAL if name in ['twitter'] %} + + + + + {% if article.twitter_image %} + {% if article.twitter_image|lower|truncate(4, True, '') == "http" %} + + {% else %} + + {% endif %} + {% elif article.header_cover %} {% elif HEADER_COVER %} {% else %} {% endif %} - {% endif %} + + {% if description %} + + {% elif article.headline %} + + {% else %} + + {% endif %} + {% endfor %} {% endblock %} {% block opengraph %} {{ super() }} diff --git a/templates/base.html b/templates/base.html index 7c41da0..fd34f5c 100644 --- a/templates/base.html +++ b/templates/base.html @@ -81,21 +81,17 @@ {% endblock opengraph %} {% block twitter_card %} - {% if TWITTER_HANDLE %} - - - - {% if SITESUBTITLE %} - - {% else %} - - {% endif %} + {% for name,link in SOCIAL if name in ['twitter'] %} + + + + {% if HEADER_COVER %} {% else %} {% endif %} - {% endif %} + {% endfor %} {% endblock twitter_card %}