Add social graphs for Facebook and Twitter

laike9m · laike9m · commit c88c752524b6 · 2023-11-19T14:55:06.000-08:00
diff --git a/templates/base.html b/templates/base.html
@@ -2,8 +2,25 @@
 <html lang="en" data-theme="light">
   <head>
     <meta charset="UTF-8">
+    {% set title = "Python Type Challenges - Master Python Typing with Interactive Exercises" %}
+    {% set description = "Join to learn and master Python typing (type hints) with interactive online exercises today!" %}
     {% block head %}{% endblock %}
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <!-- Open Graph  -->
+    <meta property="og:type" content="website" />
+    <meta property="og:url" content="https://python-type-challenges.zeabur.app/" />
+    <meta property="og:title" content="{{title}}" />
+    <meta property="og:description" content="{{description}}" />
+    <meta property="og:image" content="https://github.com/laike9m/images/assets/2592205/11e7cb79-caad-4be4-8b15-2732cbc698f3" />
+    <!-- Twitter -->
+    <meta name="twitter:card" content="summary" />
+    <meta name="twitter:url" content="https://python-type-challenges.zeabur.app/" />
+    <meta name="twitter:title" content="{{title}}" />
+    <meta name="twitter:description" content="{{description}}" />
+    <meta name="twitter:image" content="https://github.com/laike9m/images/assets/2592205/2012b6cc-7748-4708-b5aa-671dc27cfc18" />
+    <meta name="twitter:creator" content="@laike9m" />
+    <meta name="twitter:site" content="@laike9m" />
+
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/picocss/1.5.10/pico.min.css">
     <style type="text/css">
     /* override some style in picocss */
diff --git a/templates/challenge.html b/templates/challenge.html
@@ -4,7 +4,7 @@
   {{ super() }}
 
   <title>Python Type Challenge - Level: {{level}}, Topic: {{name}}</title>
-  <meta name="description" content="Join Python Type Challenges to learn and master Python typing (type hints) with our comprehensive and interactive exercises.">
+  <meta name="description" content="{{description}}">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.15/codemirror.min.css" />
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.15/theme/material-darker.min.css" />
   <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.15/codemirror.min.js"></script>
diff --git a/templates/index.html b/templates/index.html
@@ -2,8 +2,8 @@
 
 {% block head %}
   {{ super() }}
-  <title>Python Type Challenges - Master Python Typing with Interactive Exercises</title>
-  <meta name="description" content="Join Python Type Challenges to learn and master Python typing (type hints) with our comprehensive and interactive exercises.">
+  <title>{{title}}</title>
+  <meta name="description" content="{{description}}">
   <meta name="google-site-verification" content="IB8oI3WkbGLDND4SMC6m_EiPmREdddxly_JUS-lbM_A" />
   <link href="https://fonts.loli.net/css2?family=IBM+Plex+Mono:wght@300;500;700&family=Poppins&display=swap"
         rel="stylesheet">
