From 2025b6a6f2a36590ac6a882b4004045bf23036ef Mon Sep 17 00:00:00 2001
From: welpo <welpo@users.noreply.github.com>
Date: Sun, 17 Nov 2024 01:59:58 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20support=20relative=20path?=
 =?UTF-8?q?s=20in=20inherited=20social=20media=20card?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

When a page inherits social_media_card from its parent, look for the image
in the parent directory before trying the current page path. This fixes
the incorrect path resolution when social_media_card is set on a parent
page.

The template now tries paths in this order:
1. Current page directory
2. Parent directory
3. Absolute path
---
 templates/partials/header.html              | 31 +--------------
 templates/partials/social_media_images.html | 44 +++++++++++++++++++++
 2 files changed, 45 insertions(+), 30 deletions(-)
 create mode 100644 templates/partials/social_media_images.html

diff --git a/templates/partials/header.html b/templates/partials/header.html
index 3d3c56f..e07bcd8 100644
--- a/templates/partials/header.html
+++ b/templates/partials/header.html
@@ -102,36 +102,7 @@
     <meta property="og:type" content="article" />
 
     {# Image for social media sharing #}
-    {%- set social_media_card = macros_settings::evaluate_setting_priority(setting="social_media_card", page=page | default(value=""), section=section | default(value=""), default_global_value="") -%}
-    {% if social_media_card %}
-        {# Try to construct the image path relative to the current page #}
-        {% set colocated_path = page.colocated_path | default(value="") %}
-        {% set file_path = colocated_path ~ social_media_card %}
-
-        {# Fetch metadata to verify image existence at the relative path #}
-        {%- set meta = get_image_metadata(path=file_path, allow_missing=true) -%}
-
-        {# Check if relative path exists, else try absolute path #}
-        {% if meta %}
-            {% set final_path = file_path %}
-        {% else %}
-            {# If the relative path didn't work, try fetching metadata for the absolute path #}
-            {% set meta = get_image_metadata(path=social_media_card, allow_missing=true) %}
-            {% if meta %}
-                {% set final_path = social_media_card %}
-            {% else %}
-                {# Throw an error if the image doesn't exist at either path #}
-                {{ throw(message="Could not get metadata for the specified social media card image in page " ~ page.path ~ ". Attempted relative path: '" ~ file_path ~ "' and absolute path: '" ~ social_media_card ~ "'. Ensure the file exists at one of these locations.") }}
-            {% endif %}
-        {% endif %}
-
-        {# Generate the social media meta tags #}
-        <meta property="og:image" content="{{ get_url(path=final_path, cachebust=true) }}" />
-        <meta property="og:image:width" content="{{ meta.width }}" />
-        <meta property="og:image:height" content="{{ meta.height }}" />
-        <meta name="twitter:image" content="{{ get_url(path=final_path, cachebust=true) }}" />
-        <meta name="twitter:card" content="summary_large_image" />
-    {% endif %}
+    {%- include "partials/social_media_images.html" -%}
 
     {# Add og:locale and hreflang tags for multilingual sites #}
     {%- if config.languages | length > 0 and current_url %}
diff --git a/templates/partials/social_media_images.html b/templates/partials/social_media_images.html
new file mode 100644
index 0000000..a086ce7
--- /dev/null
+++ b/templates/partials/social_media_images.html
@@ -0,0 +1,44 @@
+{# Image for social media sharing #}
+{%- set social_media_card = macros_settings::evaluate_setting_priority(setting="social_media_card", page=page | default(value=""), section=section | default(value=""), default_global_value="") -%}
+{% if social_media_card %}
+    {# Try to find the image in current page, parent directories, and as absolute path #}
+    {% set page_path = page.colocated_path | default(value="") %}
+    {% set current_path = page_path ~ social_media_card %}
+
+    {# Try parent path by removing the last directory component #}
+    {% set parent_path = page_path | split(pat="/") | slice(end=-2) | join(sep="/") %}
+    {% if parent_path %}
+        {% set parent_path = parent_path ~ "/" %}
+    {% endif %}
+    {% set parent_relative_path = parent_path ~ social_media_card %}
+
+    {# Check all possible locations #}
+    {%- set current_meta = get_image_metadata(path=current_path, allow_missing=true) -%}
+    {%- set parent_meta = get_image_metadata(path=parent_relative_path, allow_missing=true) -%}
+    {%- set absolute_meta = get_image_metadata(path=social_media_card, allow_missing=true) -%}
+
+    {% if current_meta %}
+        {% set final_path = current_path %}
+        {% set meta = current_meta %}
+    {% elif parent_meta %}
+        {% set final_path = parent_relative_path %}
+        {% set meta = parent_meta %}
+    {% elif absolute_meta %}
+        {% set final_path = social_media_card %}
+        {% set meta = absolute_meta %}
+    {% else %}
+        {# Throw an error if the image doesn't exist at any path #}
+        {{ throw(message="Could not find social media card image. Tried:
+            1. Current page path: '" ~ current_path ~ "'
+            2. Parent page path: '" ~ parent_relative_path ~ "'
+            3. Absolute path: '" ~ social_media_card ~ "'
+            Please ensure the file exists at one of these locations.") }}
+    {% endif %}
+
+    {# Generate the social media meta tags #}
+    <meta property="og:image" content="{{ get_url(path=final_path, cachebust=true) }}" />
+    <meta property="og:image:width" content="{{ meta.width }}" />
+    <meta property="og:image:height" content="{{ meta.height }}" />
+    <meta name="twitter:image" content="{{ get_url(path=final_path, cachebust=true) }}" />
+    <meta name="twitter:card" content="summary_large_image" />
+{% endif %}