diff --git a/config.toml b/config.toml
index 1a71e257..d7091efd 100644
--- a/config.toml
+++ b/config.toml
@@ -222,8 +222,11 @@ favicon = "img/seedling.png"
 # Compatibility: https://caniuse.com/link-icon-svg
 favicon_emoji = "🌱"
 
-# This header image is used for SEO. For example if you were to share an image via Messenger/Instagram/Twitter a preview picture is also presented
-headerImage = ""
+# Path to the fallback image for social media cards (the image shown when sharing a link on WhatsApp, LinkedIn…).
+# Read more: https://nikitahl.com/html-meta-tags-for-social-media
+# Using an image representative of each post is recommended. You can do so by setting this variable in the [extra] section of a post's front matter.
+# If a post doesn't have a social media card, the site's default, below, will be used.
+social_media_card_path = ""
 
 menu = [
     { name = "blog", url = "blog", trailing_slash = true },
diff --git a/templates/partials/header.html b/templates/partials/header.html
index 927abd75..94703bee 100644
--- a/templates/partials/header.html
+++ b/templates/partials/header.html
@@ -73,9 +73,11 @@
     <meta property="og:title" content="{{ config.title }}">
     <meta property="og:type" content="article" />
 
-    {% if config.extra.headerImage %}
-        <meta property="og:image" content="{{ config.extra.headerImage }}">
-        <meta name="twitter:card" content="{{ config.extra.headerImage }}">
+    {# Image for social media sharing #}
+    {%- set social_media_card = macros_settings::evaluate_setting_priority(setting="social_media_card", page=page | default(value=""), default_global_value="") -%}
+    {% if social_media_card %}
+        <meta property="og:image" content="{{ get_url(path=social_media_card) }}">
+        <meta name="twitter:card" content="{{ get_url(path=social_media_card) }}">
     {% endif %}
 
     {% set current_url = current_url | default(value="/") %}
diff --git a/theme.toml b/theme.toml
index e8f8d56d..e54e05b1 100644
--- a/theme.toml
+++ b/theme.toml
@@ -107,8 +107,11 @@ separator = "•"
 # Compatibility: https://caniuse.com/link-icon-svg
 # favicon_emoji = "🌱"
 
-# This header image is used for SEO. For example if you were to share an image via Messenger/Instagram/Twitter a preview picture is also presented
-# headerImage = ""
+# Path to the fallback image for social media cards (the image shown when sharing a link on WhatsApp, LinkedIn…).
+# Read more: https://nikitahl.com/html-meta-tags-for-social-media
+# Using an image representative of each post is recommended. You can do so by setting this variable in the [extra] section of a post's front matter.
+# If a post doesn't have a social media card, the site's default, below, will be used.
+# social_media_card_path = ""
 
 menu = [
     { name = "blog", url = "blog", trailing_slash = true },