diff --git a/README.md b/README.md
index b74dc4d..20455f4 100644
--- a/README.md
+++ b/README.md
@@ -101,6 +101,24 @@ Example:
caption_style="font-weight: bold; font-style: italic;") }}
```
+## OpenGraph
+
+To add an image to a post, set the `og_image` extra option to the desired image
+in the same directory of the markdown file:
+
+```toml
+[extra]
+og_image = "colocated_image.png"
+```
+
+Additionally, for the section pages and for posts to have a fallback image, add
+`default_og_image` to the `[extra]` section:
+
+```toml
+[extra]
+default_og_image = "static/ocean.jpg"
+```
+
## Configuration
### Colors
@@ -358,7 +376,7 @@ This theme has been forked from https://github.com/panr/hugo-theme-terminal
- Prism.js syntax highlighting is not supported (you can use
[Zola's](https://www.getzola.org/documentation/content/syntax-highlighting/)).
-- All references to social media (e.g. Twitter, OpenGraph) have been removed.
+- All references to social media (e.g. Twitter) have been removed.
- All references to external URLs (e.g. Google CDN) have been removed.
This theme's static assets are meant to be served from where it's hosted.
diff --git a/config.toml b/config.toml
index 80337c9..cfcceca 100644
--- a/config.toml
+++ b/config.toml
@@ -96,3 +96,8 @@ use_full_hack_font = false
#
# Note that the main (index) page only has the main title.
page_titles = "main_only"
+
+# Optional: default image to use for OpenGraph.
+# If the page doesnt set og_image, use this one as fallback. Usefull
+# for indexes and taxonomies' pages.
+#default_og_image = "static/ocean.jpg"
diff --git a/templates/404.html b/templates/404.html
index b081fbc..cc2ba6e 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -1,7 +1,7 @@
{% extends "index.html" %}
{% block title %}
-404
+404 | {{ config.title }}
{% endblock title %}
{% block header_menu %}
diff --git a/templates/index.html b/templates/index.html
index 86cb0cd..94d668d 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -11,6 +11,8 @@
{%- block title %}{{ config.title }}{% endblock title -%}
{{ head_macros::head(config=config) }}
+ {%- block open_graph %}{{ head_macros::open_graph(config=config) }}{% endblock open_graph -%}
+
{%- if config.generate_feed %}
{%- if "rss" in config.feed_filename %}
{% set feed_type = 'rss+xml' %}
diff --git a/templates/macros/head.html b/templates/macros/head.html
index 187c57c..d882e0c 100644
--- a/templates/macros/head.html
+++ b/templates/macros/head.html
@@ -1,3 +1,5 @@
+{% import "macros/title.html" as title_macros -%}
+
{% macro head(config) %}
@@ -24,3 +26,69 @@
{% endif -%}
{% endmacro head %}
+
+
+{# Extra Meta tags for OpenGraph and Twitter cards #}
+{% macro open_graph(config) %}
+{%- if page %}
+ {%- set permalink = page.permalink %}
+ {%- set title = title_macros::title(page_title=page.title, main_title=config.title) %}
+ {%- set description = page.description %}
+ {%- set type = "article" %}
+ {%- if page.extra and page.extra.og_image %}
+ {%- if page.colocated_path %}
+ {%- set og_image = page.path ~ page.extra.og_image %}
+ {%- else %}
+ {%- set og_image = page.extra.og_image %}
+ {% endif %}
+ {%- elif config.extra.default_og_image %}
+ {%- set og_image = config.extra.default_og_image %}
+ {%- endif %}
+{%- elif section %}
+ {%- set permalink = section.permalink %}
+ {%- set title = title_macros::title(page_title=section.title, main_title=config.title) %}
+ {%- set description = section.description | default(value=config.description) %}
+ {%- set type = "website" %}
+ {%- if section.extra and section.extra.og_image %}
+ {%- set og_image = section.extra.og_image %}
+ {%- elif config.extra.default_og_image %}
+ {%- set og_image = config.extra.default_og_image %}
+ {%- endif %}
+{%- else %}
+ {# For 404 and taxonomy pages #}
+ {%- if taxonomy %}
+ {% if term %}
+ {%- set permalink = term.permalink %}
+ {%- set title = title_macros::title(page_title=term.name, main_title=config.title) %}
+ {%- set description = "All posts tagged " ~ term.name %}
+ {% else %}
+ {%- set permalink = config.base_url ~ "/" ~ taxonomy.slug %}
+ {%- set title = title_macros::title(page_title=taxonomy.name, main_title=config.title) %}
+ {%- set description = "All " ~ taxonomy.name %}
+ {% endif %}
+ {%- else %}
+ {%- set permalink = config.base_url %}
+ {%- set title = title_macros::title(page_title="404", main_title=config.title) %}
+ {%- set description = "Page not found" %}
+ {%- endif %}
+ {%- set type = "website" %}
+ {%- if config.extra.default_og_image %}
+ {%- set og_image = config.extra.default_og_image %}
+ {%- endif %}
+{%- endif -%}{# #}
+
+
+
+
+
+
+{% if og_image %}
+
+
+{% endif %}
+
+
+
+
+
+{% endmacro open_graph %}
diff --git a/templates/shortcodes/figure.html b/templates/shortcodes/figure.html
index b9de271..e014068 100644
--- a/templates/shortcodes/figure.html
+++ b/templates/shortcodes/figure.html
@@ -2,7 +2,7 @@
{% endif %}