Add more meta-tags for articles

Author: rossta

app/assets/images/articles/custom-color-schemes-with-ruby-on-rails/screenshot.jpg

@@ -1,7 +1,22 @@
-<%= set_meta_tags(
+<% set_meta_tags(
   title: current_page.data.title!,
   description: current_page.data.description,
-  keywords: "Rails, Hotwire"
+  keywords: %w[rails hotwire],
+  index: true,
+  icon: "/favicon.ico",
+  og: {
+    title: :title,
+    description: :description,
+    type: "article",
+    url: current_page.url,
+    site_name: "Joy of Rails",
+    locale: "en_US",
+    image: current_page.data.meta_image && asset_url(current_page.data.meta_image)
+  },
+  twitter: {
+    card: current_page.data.meta_image ? "summary_large_image" : "summary",
+    site: "@joyofrails",
+  }
 ) %>
 <%= render "application/skip_to_content" %>
 <%= render_layout "application" do %>

app/assets/images/articles/introducing-joy-of-rails/screenshot.jpg

@@ -6,6 +6,7 @@ description: You can edit the color scheme of this website right in content of t
 summary: You can edit the color scheme of this website right in content of this blog post. Play with the controls while we highlight the benefits of Rails, Hotwire, and CSS variables.
 published: 2024-07-15
 image: articles/custom-color-schemes-with-ruby-on-rails/rainbows.jpg
+meta_image: articles/custom-color-schemes-with-ruby-on-rails/screenshot.jpg
 uuid: d99f045b-f3f7-4408-811e-9701b1a13ce8
 tags:
   - Rails

app/content/layouts/article.html.erb

@@ -8,6 +8,7 @@ published: '2024-05-02'
 toc: false
 uuid: 4106248b-ae8f-40a3-9853-48b91d815a71
 image: articles/introducing-joy-of-rails/adventure-world.gif
+meta_image: articles/introducing-joy-of-rails/screenshot.jpg
 tags:
   - Rails
 ---