diff --git a/content/images/fi.png b/content/images/fi.png
new file mode 100644
index 0000000..14b9169
Binary files /dev/null and b/content/images/fi.png differ
diff --git a/pelicanconf.py b/pelicanconf.py
index 6b2806d..7b2457f 100644
--- a/pelicanconf.py
+++ b/pelicanconf.py
@@ -4,9 +4,11 @@ from __future__ import unicode_literals
 
 AUTHOR = 'rra'
 SITENAME = 'Wtt�F'
-SITEURL = ''
+SITEURL = 'https://roelof.info/~r/wttf/'
 SUBTITLE=" a project about federated social media and open source design"
 
+FEATURED_IMAGE = SITEURL + 'images/fi.png'
+
 PATH = 'content'
 THEME = 'theme/wttf'
 THEME_STATIC_DIR = 'theme/'
diff --git a/theme/wttf/static/main.css b/theme/wttf/static/main.css
index 47ddb77..c54f798 100644
--- a/theme/wttf/static/main.css
+++ b/theme/wttf/static/main.css
@@ -108,7 +108,7 @@ header{
 		line-height: 1.35;
 		color:white;
 		background-color: #fb4817;
-		background: linear-gradient(to bottom, #7e2502, #ff4800, #e2dede);
+		background: linear-gradient(to bottom, salmon, #ff7f4d, #e2dede);
 	}
 		#menu.main{
 			position: relative;
diff --git a/theme/wttf/templates/base.html b/theme/wttf/templates/base.html
index 85b8ae7..3978258 100644
--- a/theme/wttf/templates/base.html
+++ b/theme/wttf/templates/base.html
@@ -8,6 +8,9 @@
 		<link rel="stylesheet" type="text/css" href="{{SITEURL}}/{{ THEME_STATIC_DIR }}{{ CSS_FILE }}" />
 	<!-- <link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/arima-koshi" type="text/css"/>  -->
 	<!-- <link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/liberation-serif" type="text/css"/>  -->
+		{% from 'syndication.html' import syndication with context %}
+		{{ syndication(article) }}
+
 		<link rel="icon" href="{{ SITEURL}}/favicon.ico" type="image/x-icon">
 	{% if FEED_ALL_ATOM %}
 		<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
diff --git a/theme/wttf/templates/syndication.html b/theme/wttf/templates/syndication.html
new file mode 100644
index 0000000..ea55fb6
--- /dev/null
+++ b/theme/wttf/templates/syndication.html
@@ -0,0 +1,63 @@
+{#This template is for syndicating across the fucked up part of the  web. It implements Open Graph and Twitter Card metadata to display links to HBSC well on social media
+# This code is mostly taken from Talha Mansoor's Elegant pelican theme https://github.com/talha131/pelican-elegant
+#}
+
+{# Thumbnail image to show when homepage is shared on social media. It also
+serves as the default image for posts whose featured_image is not set. #}
+{% if not FEATURED_IMAGE %}
+{% set FEATURED_IMAGE = 'https://roelof.info/~r/wttf/images/fi.png' %}
+{% else %}
+{% set FEATURED_IMAGE = FEATURED_IMAGE %}
+{% endif %}
+
+
+{% macro syndication(article) %}
+{% if article %}
+<meta property="og:title" content="{{ article.title|striptags|e }} {%if article.subtitle %} - {{ article.subtitle|striptags|e }} {% endif %}"/>
+<meta property="og:url" content="{{ SITEURL }}/{{ article.url }}" />
+<meta property="og:description" content="{% if article.summary %}{{article.summary|striptags}}{% endif %}" />
+<meta property="og:site_name" content="{{ SITENAME|striptags|e }}" />
+<meta property="og:article:author" content="{{ article.author }}" />
+{% if article.date %}
+<meta property="og:article:published_time" content="{{ article.date.isoformat() }}" />
+{% endif %}
+{% if article.locale_modified and article.modified %}
+<meta property="" content="{{ article.modified.isoformat() }}" />
+{% endif %}
+<meta name="twitter:card" content="summary_large_image">
+<meta name="twitter:title" content="{{ article.title|striptags|e }} {%if article.subtitle %} - {{ article.subtitle|striptags|e }} {% endif %}">
+<meta name="twitter:description" content="{% if article.summary %}{{article.summary|striptags}}{% endif %}">
+{% if article.featured_image %}
+    {% if I18N_SUBSITES %}
+    {% for lang, url in I18N_SUBSITES.items() %}
+        {% if lang == 'en' %} 
+<meta property="og:image" content="{{SITEURL}}{{article.featured_image}}" />
+<meta property="og:image:secure_url" content="{{SITEURL}}{{article.featured_image}}" />
+<meta name="twitter:image" content="{{SITEURL}}{{article.featured_image}}" >           
+        {% endif %}
+    {% endfor %}
+{% endif %}
+{% else %}
+{% if FEATURED_IMAGE %}
+<meta property="og:image" content="{{FEATURED_IMAGE}}" />
+    <meta name="twitter:image" content="{{FEATURED_IMAGE}}" >
+    {% endif %}
+{% endif %}
+{% endif %}
+{% if not article %}
+<meta property="og:title" content="{{ SITENAME|striptags|e }}"/>
+<meta name="twitter:title" content="{{ SITENAME|striptags|e }}">
+<meta name="twitter:card" content="summary" />
+<meta property="og:url" content="{{ SITEURL }}" />
+<meta property="og:description" content="{{ SITESUBTITLE }}">
+<meta property="twitter:description" content=" {{ SITESUBTITLE }}">
+<meta property="og:site_name" content="{{ SITENAME|striptags|e }}" />
+<meta property="og:article:author" content="{{ AUTHOR }}" />
+{% if FEATURED_IMAGE %}
+<meta property="og:image" content="{{FEATURED_IMAGE}}" />
+<meta name="twitter:image" content="{{FEATURED_IMAGE}}" >
+{% endif %}
+{% endif %}
+{% endmacro %}b
+
+