Fix image meta tag issue

README.md

@@ -49,6 +49,7 @@ To customize your website, follow these steps:
 - `primary_color`: Specify your website's primary color using a hexadecimal color code (e.g., "#00897b")
 - `text_align`: Specify the text alignment for your website: "right", "left" or "center" (e.g., "center")
 - `gtag_id`: Your Google Analytics tracking ID (e.g., "G-33WB8LVHR6")
+- `base_url`: The base URL for your website, mentioned in **1. Create a Repository** step (e.g., https://thevahidal.github.io/jake)
 
 #### Sections
 

data.toml

@@ -6,6 +6,7 @@ theme = "dark"
 primary_color = "#d81b60"
 text_align = "center"
 gtag_id = "G-33WB8LVHR6"
+base_url = "https://thevahidal.github.io/jake"
 
 [[sections]]
 title = "Movies"

script.py

@@ -48,12 +48,20 @@
         # OG
         h("meta", property="og:title", content=data.get("name")),
         h("meta", property="og:description", content=data.get("description")),
-        h("meta", property="og:image", content=f"img/{data.get('image')}"),
+        h(
+            "meta",
+            property="og:image",
+            content=f"{data.get('base_url')}/img/{data.get('image')}",
+        ),
         # Twitter / X
-        h("meta", property="twitter:title", content=data.get("name")),
-        h("meta", property="twitter:description", content=data.get("description")),
-        h("meta", property="twitter:image", content=f"img/{data.get('image')}"),
-        h("meta", property="twitter:card", content="summary_large_image"),
+        h("meta", name="twitter:title", content=data.get("name")),
+        h("meta", name="twitter:description", content=data.get("description")),
+        h(
+            "meta",
+            name="twitter:image",
+            content=f"{data.get('base_url')}/img/{data.get('image')}",
+        ),
+        h("meta", name="twitter:card", content="summary_large_image"),
     )
 
     head = frag(