type-on-strap 2.2.1 → 2.3.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 96498e8bc639617b5a89ca28b272159ac6bbe0181cf06e4940a8d3e484ab3e9c
-  data.tar.gz: 1963b426197beb23d966e2e8de61abd2288b344d764cde9ece68636e8dddc68c
+  metadata.gz: af20f1836a082bd0742d769f57138a3a2267237bf1cf1e621170eeb9ff03170a
+  data.tar.gz: 30eb142a5b957b91a0c4ed33cc5b01220be570f41008bd98e6a9e21307bf8ba8
 SHA512:
-  metadata.gz: '09b6df42042eac5648af2d3606fe05dbf1cd811753e7a932ab62de701f999729f7dad969c99a1ca910ff490221648bba03706942395f3d439958d83080d99fd2'
-  data.tar.gz: db5215c5227cec136a7b9191040f2fbf06f550499804d03d99ef33b0d736aebbe906523fedaa18bff7f64c7aa26210e3c373448941247c6f7239e8ea7a961b6e
+  metadata.gz: b7eb62bcd9b159fbe6d2c86bf7d0b3e7954f8e7ebe7c5a45b63ec2a6cadf887556dedd506de070654a30ca234d1f1ff810bce8478caf385d248ddb1e4b9d6dec
+  data.tar.gz: de72eb027555e5ad7175937b1a9515d398084a5658de907c869520e910448e7a3497f680db582b1f45d26a4d4723353bcb73f31a09981fe8bbcd3191a91f4af8

data/README.md

@@ -1,25 +1,26 @@
-# Type on Strap 
+# Type on Strap 🎨
 
 [![Build Status](https://travis-ci.org/sylhare/Type-on-Strap.svg?branch=master)](https://travis-ci.org/sylhare/Type-on-Strap)
 [![Gem Version](https://badge.fury.io/rb/type-on-strap.svg)](https://badge.fury.io/rb/type-on-strap)
 [![Docker Pulls](https://img.shields.io/docker/pulls/sylhare/type-on-strap)](https://hub.docker.com/r/sylhare/type-on-strap)
 
-A free and open-source [Jekyll](https://jekyllrb.com) theme. Based on Rohan Chandra [type-theme](https://github.com/rohanchandra/type-theme) with a few new features:
+[![Default Type on Strap blog](https://github.com/Sylhare/Type-on-Strap/blob/master/screenshot.png?raw=true)](https://sylhare.github.io/Type-on-Strap/)
+
+A free and open-source [Jekyll](https://jekyllrb.com) theme. Based on Rohan Chandra [type-theme](https://github.com/rohanchandra/type-theme) packed with extra features and easily cusomizable:
 
-* Responsive design
-* Portfolio page for your projects
-* Tags compatibility
-* Bootstrap : [Get Bootstrap](http://getbootstrap.com/)
-* Search feature : [Simple-Jekyll-Search](https://github.com/christian-fei/Simple-Jekyll-Search)
+* Responsive design on all devices (🖥, 💻, 📱, ...)
+* Portfolio 🗂, Gallery 🖼 pages for your projects
+* Tags compatibility 🏷
+* Handle Bootstrap'ed pages: [Get Bootstrap](http://getbootstrap.com/)
+* 🔎 Search feature: [Simple-Jekyll-Search](https://github.com/christian-fei/Simple-Jekyll-Search)
 * Math Rendering : [KateX](https://github.com/Khan/KaTeX)
-* Nice fonts : [Font Awesome](https://fontawesome.com/), [Source Sans Pro](https://fonts.google.com/specimen/Source+Sans+Pro), [Pacifico](https://fonts.google.com/specimen/Pacifico?selection.family=Pacifico) 
-* Seo Tags : [Jekyll-seo-tag](https://github.com/jekyll/jekyll-seo-tag)
-* Syntax Highlighting: Easily customisable [Base16](https://github.com/chriskempson/base16)
-* Free of rights images from [pexels](https://www.pexels.com/)
+* Diagram Rendering: [Mermaid-js](https://github.com/mermaid-js/mermaid)
+* 🖋 Nice fonts: [Font Awesome](https://fontawesome.com/), [Source Sans Pro](https://fonts.google.com/specimen/Source+Sans+Pro), [Pacifico](https://fonts.google.com/specimen/Pacifico?selection.family=Pacifico) 
+* Seo Tags: [Jekyll-seo-tag](https://github.com/jekyll/jekyll-seo-tag)
+* 🛠 Syntax Highlighting: Easily customisable [Base16](https://github.com/chriskempson/base16)
+* Find free of rights images on [pexels](https://www.pexels.com/)
 
 > [Demo Site](https://sylhare.github.io/Type-on-Strap/)
- 
-[![Default Type on Strap blog](https://github.com/Sylhare/Type-on-Strap/blob/master/screenshot.png?raw=true)](https://sylhare.github.io/Type-on-Strap/)
 
 ## Table of Contents
 
@@ -33,11 +34,11 @@ A free and open-source [Jekyll](https://jekyllrb.com) theme. Based on Rohan Chan
 
 ## Usage
 
-### As a ruby gem
+### As a ruby gem 💎
 
 Check out this tutorial: [Use as Ruby Gem](https://github.com/Sylhare/Type-on-Strap#use-as-ruby-gem)
 
-### As a github page
+### As a github page 📋
 
 1. Fork and clone the [Type on Strap repo](https://github.com/sylhare/Type-On-Strap): `git clone https://github.com/Sylhare/Type-on-Strap.git`
 2. Install [Jekyll](https://jekyllrb.com/docs/installation/): `gem install jekyll`, check [#1](https://github.com/Sylhare/Type-on-Strap/issues/1) if you have a problem.
@@ -77,7 +78,7 @@ Type-on-Strap
 └── index.html                 # sample home page (blog page paginated)
 ```
 	
-## Configure Type on Strap
+## Configure Type on Strap 🛠
 
 Open `_config.yml` in a text editor to change most of the blog's settings.
 
@@ -85,16 +86,17 @@ If a variable in this document is marked as "optional", disable the feature by r
 
 
 ### Site configuration
-Configure Jekyll as your own blog or with a subpath in in `_config.yml`:
 
-Jekyll website *without* a subpath (such as a GitHub Pages website for a given username):
+Configure Jekyll as your own blog or with a "baseurl" in in `_config.yml`:
+
+Jekyll website *without* a "baseurl" (such as a GitHub Pages website for a given username):
 
 ```yml
 baseurl: ""
 url: "https://username.github.io"
 ```
 
-Jekyll website *with* subpath (like the Type on Strap [demo](https://sylhare.github.io/Type-on-Strap/) page):
+Jekyll website *with* "baseurl" (like the Type on Strap [demo](https://sylhare.github.io/Type-on-Strap/) page):
 
 ```yml
 baseurl: "/sub-directory"
@@ -117,7 +119,9 @@ description: My blog posts            # Short description, primarily used by sea
 favicon: assets/favicon.ico           # Icon displayed in the tab
 ```
 
-### Main configuration
+You can also customize the seo tags default option following the jekyll-seo-tag plugin [documentation](http://jekyll.github.io/jekyll-seo-tag/advanced-usage/).
+
+### Theme customization 🎨
 
 #### Footer and Header's text
 
@@ -159,7 +163,7 @@ to your project's `_config.yml` file:
 disqus_shortname: my_disqus_shortname
 ```
 
-### Math typesetting
+### Math typesetting with KateX
 
 When KateX is set in `_config.yml`:
 
@@ -184,17 +188,45 @@ $$
 $$
 ```
 
+You can find a cheat sheet of the compatible LaTex symbols [online](https://artofproblemsolving.com/wiki/index.php/LaTeX:Symbols).
+
+### Diagrams with Mermaid
+
+Enable the [mermaid-js](https://github.com/mermaid-js/mermaid) diagram rendering by setting mermaid to true in the `_config.yml`.
+This will load and init the [mermaid.min.js](https://mermaid-js.github.io/mermaid/getting-started/n00b-gettingStarted.html#4-calling-mermaid-from-a-relative-link).
+
+```yml
+mermaid: true # to Enable it
+```
+
+Find all the help you need on the official [mermaid documentation](https://mermaid-js.github.io/mermaid/).
+You can create with ease diagrams. Add your mermaid script inside two mermaid divs (default Kramdown does not yet support mermaid).
+With the `class="mermaid"` inside the `<div>`:
+
+```html
+<div class="mermaid">
+sequenceDiagram
+    Alice->>John: Hello John, how are you?
+    John-->>Alice: Great!
+</div>
+```
+
 ### Social icons
 
 In `_data/social.yml` you can customize the social icons from other wbesite you wish to display in the blog.
 The site icons come from [Font Awesome](https://fontawesome.com/).
 
+### Cookie consent
+
+You can add a cookie consent with a disclaimer if you use Google Analytics while respecting the [GDPR](https://en.wikipedia.org/wiki/General_Data_Protection_Regulation).
+Set to true, there will be a banner at the bottom of the page with the disclaimer and a approve button.
+Once the user clicks on "Approve" the cookies will be created for Google Analytics.
+
 #### Share in article
 
 The share icons are the one at the bottom of the blog page if enabled, 
 to share the article on those platform.
 
-
 #### Footer
 
 Display in the footer. 
@@ -212,23 +244,26 @@ youtube: UCqECaJ8Gagnn7YCbPEzWH6g  # Youtube token of your channel in the url
 
 You can update the RSS settings in `_data/social` to change the default feed path (generated by [jekyll-feel](https://github.com/jekyll/jekyll-feed)).
 
-### Customizing Posts
+### Personalize your Blog Posts 📝
 
 When writing a post, be sure in jekyll to:
  - Put it in the `_posts` folder
  - Name it with the date first like `2019-08-21-This-is-my-blog-post.md`
 
+Please refer to the [Jekyll docs for writing posts](https://jekyllrb.com/docs/posts/). 
+
 #### Layout: Post
 
 This are the basic features you can use with the  `post` layout.
 
 ```yml
+
 ---
 layout: post
 title: Hello World                                # Title of the page
 hide_title: true                                  # Hide the title when displaying the post, but shown in lists of posts
 feature-img: "assets/img/sample.png"              # Add a feature-image to the post
-thumbnail: "assets/img/thumbnail/sample-th.png"   # Add a thumbnail image on blog view
+thumbnail: "assets/img/thumbnails/sample-th.png"  # Add a thumbnail image on blog view
 color: rgb(80,140,22)                             # Add the specified color as feature image, and change link colors in post
 bootstrap: true                                   # Add bootstrap to the page
 tags: [sample, markdown, html]
@@ -236,7 +271,7 @@ tags: [sample, markdown, html]
 ```
 
 With `thumbnail`, you can add a smaller image than the `feature-img`. 
-If you don't have a thumbnail you can still use the same image as the feature one.
+If you don't have a thumbnail you can still use the same image as the feature one. Or use the gulp task to create it.
 
 The background used when `color` is set comes from `lineart.png` from [xukimseven](https://github.com/xukimseven) 
 you can edit it in the config file (`_config.yml > color_image`). If you want another one, put it in `/assets/img` as well. 
@@ -258,6 +293,7 @@ excerpt: true
 Then in your post, add the `excerpt separator`:
 
 ```yml
+
 ---
 layout: post
 title: Sample Page
@@ -287,15 +323,42 @@ Use it in any markdown file. There are two fields in the include you need to loo
     - `column=3` set 3 columns
     - `column="auto"` makes as many columns as images
 
-## Other Layouts
-Please refer to the [Jekyll docs for writing posts](https://jekyllrb.com/docs/posts/). 
+#### Code highlight
+
+Like all CSS variables in the theme, you can edit the color of the code highlight in _sass > base > _variables.scss.
+The code highlighting works with [base16](https://github.com/chriskempson/base16-html-previews/tree/master/css) you can find existing example 
+of your favourite highlight color scheme on this format.
+
+## Feature pages and layouts 
+
+All feature pages besides the "home" one are stored in the `page` folder, 
+they will appear in the navigation bar unless you set `Hide: true` in the front matter. 
+
+Here are the documentation for the other feature pages that can be added through `_config.yml`. 
+
 Non-standard features are documented below.
 
-### Layout: Page
+### Layout: Default
+
+This layout includes the head, navigation bar and footer around your content. 
+Unless you're making a custom layout you won't need it.
+
+### Layout: Home 🏡
+
+This page is used as the home page of the template (in the `index.html`). It displays the list of articles in `_posts`.
+You can use this layout in another page (adding a title to it will make it appear in the navigation bar).
+
+The recommended width and height for the home picture is width:`2484px;` and height:`1280px` 
+which are the dimensions of the actual picture for it to be rolling down as you scroll the page.
+
+If your posts are not displaying ensure that you have added the line `paginate: 5` to `_config.yml`.
+
+### Layout: Page 📄
 
 The page layout have a bit more features explained here.
 
 ```yml
+
 ---
 layout: page
 title: "About" 
@@ -310,33 +373,14 @@ tags: [sample, markdown, html]
 
 The hide only hides your page from the navigation bar, it is however still generated and can be access through its link. 
 
-### Layout: Default
-
-This layout includes the head, navigation bar and footer around your content.
-
-## Feature pages
-
-All feature pages besides the "home" one are stored in the `page` folder, 
-they will appear in the navigation bar unless you set `Hide: true` in the front matter. 
-
-Here are the documentation for the other feature pages that can be added through `_config.yml`.
-
-### Home
-
-This page is used as the home page of the template (in the `index.html`). It displays the list of articles in `_posts`.
-You can use this layout in another page (adding a title to it will make it appear in the navigation bar).
-
-The recommended width and height for the home picture is width:`2484px;` and height:`1280px` 
-which are the dimensions of the actual picture for it to be rolling down as you scroll the page.
-
-If your posts are not displaying ensure that you have added the line `paginate: 5` to `_config.yml`.
-
-### Portfolio
+### Feature: Portfolio 🗂
 
 Portfolio is a feature page that will take all the markdown/html files in the `_portfolio` folder to create a 3-columns image portfolio matrix.
 
 To use the portfolio, simply create a `portfolio.md` with this information inside:
+
 ```yml
+
 --- 
 layout: page
 title : Portfolio 
@@ -345,13 +389,14 @@ title : Portfolio
 {% include portfolio.html %}
 ```
 
-#### Portofolio posts
+#### Portfolio posts
 
 You can format the portfolio posts in the `_portfolio` folder using the `post layout`. Here are little explaination on some of the possible feature you can use and what they will do.
 
 If you decide to use a date, please be sure to use one that can be parsed such as `yyyy-mm-dd`. You can see more format example on the demo posts that are available for the theme:
 
 ```yml
+
 ---
 layout: post
 title: Circus				       # Title of the portfolio post
@@ -366,7 +411,6 @@ date: 2019-07-25		 	       # Not mandatory, however needs to be in date format t
 Make sure your `_config.yml` contains the following if you are using the theme as a gem:
 
 ```yml
-
 # PORTFOLIO
 collections:
   portfolio:
@@ -376,7 +420,7 @@ collections:
 
 This creates the collection for Jekyll so it can find and display your portfolio posts.
 
-### Gallery
+### Feature: Gallery 🖼
 
 You can create a gallery using [Masonry JS](https://masonry.desandro.com/) which will placing the pictures in optimal position 
 based on available vertical space. 
@@ -384,6 +428,7 @@ You need to specify the `gallery_path` which will be used to find the pictures t
 It will take all of the picture under that directory. Then use the `include` to add it in your page. 
 
 ```yml
+
 ---
 layout: page
 title: Gallery
@@ -394,7 +439,7 @@ gallery: "assets/img/pexels"
 ```
 
 
-### Search
+### Feature: Search 🔍
 
 The search feature is based on [Simple-Jekyll-search](https://github.com/christian-fei/Simple-Jekyll-Search) 
 there is a `search.json` file that will create a list of all of the site posts, pages and portfolios. 
@@ -404,6 +449,7 @@ Then there's a `search.js` displaying the formatted results entered in the `sear
 The search page can be hidden with the `hide` option. You can remove the icon by removing `icon`:
 
 ```yml
+
 ---
 layout: search
 title: Search
@@ -411,7 +457,7 @@ icon: "search"
 ---
 ```
 
-### Tags
+### Feature: Tags 🏷
 
 Tags should be placed between `[]` in your post metadata. Separate each tag with a comma. 
 Tags are recommended for posts and portfolio items.
@@ -419,6 +465,7 @@ Tags are recommended for posts and portfolio items.
 For example:
 
 ```yml
+
 ---
 layout: post
 title: Markdown and HTML
@@ -446,27 +493,35 @@ You can learn more about them on [shopify's doc](https://help.shopify.com/themes
 
 ### Minimizing and optimizing: css, js and images
 
-Before you need to have `node` and `npm` installed:
+Before you need to have *node* and `npm` installed:
+
 - Windows: https://nodejs.org/
 - Ubuntu/Debian: `apt-get install nodejs npm libgl1 libxi6`
 - Fedora (dnf) / RHEL/CentOS (yum): `dnf install node npm libglvnd-glx libXi`
 
 Then you need to install [`gulp-cli`](https://gulpjs.com/) and its dependencies:
-```shell
+
+```bash
 cd assets/
 sudo npm install gulp-cli -g
 npm install
 ```
 
-**Now, whenever you want to minify and optimize, run:**
-```shell
+You can run the default task that will compress the js, css and images and create the thumbnails for the supported image
+formats:
+
+```bash
 cd assets/
 gulp default
+gulp thumbnails-all # to create all of the images thumbnails
+gulp thumbnails     # to create thumbnails for the feature-img/ only
 # tip: run a git status to see the changes
 git status
 ```
 
-### Use as Ruby Gem
+You can find more about the gulp tasks in the [gulpfile.js](assets/gulpfile.js)
+
+### Use as Ruby Gem 💎
 
 You can use Type-on-strap as a [gem](https://rubygems.org/gems/type-on-strap). 
 
@@ -476,6 +531,7 @@ Add this line to your Jekyll site's Gemfile (or create one):
 ```ruby
 gem "type-on-strap"
 ```
+
 Add this line to your Jekyll site's `_config.yml` file:
 
 ```yml
@@ -504,5 +560,7 @@ remote_theme: sylhare/Type-on-Strap
 
 ## License
 
-There are some fonts and component on this theme going under the MIT licence as well in this theme.
-[The MIT License (MIT)](https://raw.githubusercontent.com/Sylhare/Type-on-Strap/master/LICENSE)
+This theme is licensed under the [The MIT License (MIT)](https://raw.githubusercontent.com/Sylhare/Type-on-Strap/master/LICENSE)
+
+- Pictures from [Pexels](https://www.pexels.com/) are under Creative Commons Zero (CC0) license
+- Fonts are licensed under the [SIL Open Font License (OFL)](https://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL) 

data/_data/language.yml

@@ -11,3 +11,6 @@ str_previous_post: "Previous post"
 str_next_page: "Next"
 str_previous_page: "Prev"
 str_javascript_required_disqus: "Please enable JavaScript to view comments."
+str_no_result_found: "No result found"
+str_cookie_approve: "Approve"
+str_cookie_disclaimer: "We would like to use third party cookies and scripts to improve the functionality of this website."

data/_includes/citation.html

@@ -0,0 +1,2 @@
+{%- assign citation = site.data.biblio | where:"key", include.key | first -%}
+<span class="cit-authors">{{citation.authors}}</span>, <span class="cit-title">{{citation.title}}</span>

data/_includes/head.html

@@ -3,7 +3,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 
     <!-- Main JS (navbar.js, katex_init.js and masonry_init.js)-->
-    <script defer=true src="{{ '/assets/js/main.min.js' | relative_url }}"></script>
+    <script defer src="{{ '/assets/js/main.min.js' | relative_url }}"></script>
     
     <!-- CSS -->
     <link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
@@ -11,16 +11,12 @@
     <!--Favicon-->
     <link rel="shortcut icon" href="{{ site.favicon | relative_url }}" type="image/x-icon">
 
-    <!-- Canonical -->
-    <link rel="canonical" href="{{ page.url | replace:'index.html','' | absolute_url }}">
-
     <!-- RSS -->
     <link rel="alternate" type="application/atom+xml" title="{{ site.title }}" href="{{ 'feed.xml' | absolute_url }}"/>
     
     {% if page.bootstrap %}
     <!-- Bootstrap-4.1.3 isolation CSS -->
     <link rel="stylesheet" type="text/css" href="{{ '/assets/css/vendor/bootstrap-iso.min.css' | relative_url }}">
-
     <!-- JQuery 3.3.1 -->
     <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
     <!-- Bootstrap 4.1.3 compiled and minified JavaScript -->
@@ -29,34 +25,58 @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
     {% endif %}
 
-    <!-- KaTeX 0.8.3 -->
-    <!-- if you have any issue check https://github.com/KaTeX/KaTeX -->
+    <!-- KaTeX 0.12.0 -->
     {% if site.katex or site.theme_settings.katex %}
-    <script src="{{ '/assets/js/vendor/katex.min.js' | relative_url }}"></script>
+    <script defer src="{{ '/assets/js/vendor/katex.min.js' | relative_url }}"></script>
+    <script defer src="{{ '/assets/js/vendor/auto-render.min.js' | relative_url }}" onload="renderMathInElement(document.body);"></script>
     {% endif %}
 
-    <!-- Google Analytics -->
-    {% if site.google_analytics %}
-    <!-- Global site tag (gtag.js) -->
-    <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
-    <script>
-      window.dataLayer = window.dataLayer || [];
-      function gtag(){dataLayer.push(arguments);}
-      gtag('js', new Date());
-      gtag('config', '{{ site.google_analytics }}');
-    </script>
-    
-    <!-- Page analysis (analytics.js) -->
-    <script async src='https://www.google-analytics.com/analytics.js'></script>
+    <!-- Mermaid 8.8.2 -->
+    {% if site.mermaid %}
+    <!-- <script src=”https://cdnjs.cloudflare.com/ajax/libs/mermaid/8.8.2/mermaid.min.js" onload="mermaid.initialize({startOnLoad:true});"></script> -->
+    <script defer src="{{ '/assets/js/vendor/mermaid.min.js' | relative_url }}" onload="mermaid.initialize({startOnLoad:true});"></script>
+    {% endif %}
+
+    <!-- Simple-Jekyll-Search 1.17.12 -->
+    <script src="{{ '/assets/js/vendor/simple-jekyll-search.min.js' | relative_url }}" type="text/javascript"></script>
+
+    <!-- Google Analytics / Cookie Consent -->
     <script>
-      window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
-      ga('create', '{{ site.google_analytics }}', 'auto');
-      ga('send', 'pageview');
+      const cookieName = 'cookie-notice-dismissed-{{ site.url }}';
+      const isCookieConsent = '{{ site.cookie_consent }}';
+      const analyticsName = '{{ site.google_analytics }}';
     </script>
+
+    {% if site.cookie_consent %}
+        <div id="cookie-notice"><span>{{ site.data.language.str_cookie_disclaimer | default: "We would like to use third party cookies and scripts to improve the functionality of this website." }}
+          </span><a id="cookie-notice-accept" class="button">{{ site.data.language.str_cookie_approve | default: "Approve" }}</a>
+        </div>
+    {% endif %}
+    {% if site.google_analytics %}
+        <!-- Global site tag (gtag.js) -->
+        <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
+        <!-- Page analysis (analytics.js) -->
+        <script async src='https://www.google-analytics.com/analytics.js'></script>
     {% endif %}
-    <!-- End Google Analytics -->
 
     <!-- seo tags -->
+    <meta property="og:image" content="{{ '/' | absolute_url }}{% if page.thumbnail %}{{ page.thumbnail }}{% else %}{{ page.feature-img | default: site.header_feature_image }}{% endif %}">
+    {% unless page.layout == post %}
+    <meta property="og:type" content="website" />
+    {% endunless %}
     {% seo %}
-    <meta property="og:image" content="{{ '/' | absolute_url }}{% if page.thumbnail %}page.thumbnail{% else %}{{ page.feature-img | default: site.header_feature_image }}{% endif %} " />
+
+    <!-- RSS -->
+    {% feed_meta %}
+
+    <!-- Twitter Cards -->
+    <meta name="twitter:title" content="{{ page.title | default: site.title }}">
+    <meta name="twitter:description" content="{{ page.content | strip_html | strip_newlines | truncate: 160 | default: site.header_text}}">
+    {% if site.data.social.twitter %}
+    <meta name="twitter:creator" content="@{{ site.data.social.twitter }}">
+    <meta name="twitter:site" content="@{{ site.data.social.twitter }}">
+    {% endif %}
+    <meta name="twitter:card" content="{% unless page.thumbnail %}summary{% else %}summary_large_image{% endunless %}">
+    <meta name="twitter:image" content="{{ '/' | absolute_url }}{% if page.thumbnail %}{{ page.thumbnail }}{% else %}{{ page.feature-img | default: site.header_feature_image }}{% endif %}">
+    <meta name="twitter:image:alt" content="{{ page.title | default: site.title }}">
 </head>