add open graph and twitter card meta tags
Product pages get og:type=product, og:url, og:image (hero image), and twitter:card=summary_large_image. All other shop pages get og:type=website and twitter:card=summary. og:title and og:description mirror the existing page title and meta description. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
c6da3b3d2b
commit
b11f7d47d0
@ -14,6 +14,31 @@
|
|||||||
<.live_title suffix={" · #{@theme_settings.site_name}"}>
|
<.live_title suffix={" · #{@theme_settings.site_name}"}>
|
||||||
{assigns[:page_title]}
|
{assigns[:page_title]}
|
||||||
</.live_title>
|
</.live_title>
|
||||||
|
<% og_title =
|
||||||
|
if assigns[:page_title],
|
||||||
|
do: "#{assigns[:page_title]} · #{@theme_settings.site_name}",
|
||||||
|
else: @theme_settings.site_name
|
||||||
|
|
||||||
|
og_description =
|
||||||
|
assigns[:page_description] ||
|
||||||
|
@theme_settings.site_description ||
|
||||||
|
"Welcome to #{@theme_settings.site_name}" %>
|
||||||
|
<meta property="og:site_name" content={@theme_settings.site_name} />
|
||||||
|
<meta property="og:title" content={og_title} />
|
||||||
|
<meta property="og:description" content={og_description} />
|
||||||
|
<meta property="og:type" content={assigns[:og_type] || "website"} />
|
||||||
|
<%= if assigns[:og_url] do %>
|
||||||
|
<meta property="og:url" content={assigns[:og_url]} />
|
||||||
|
<% end %>
|
||||||
|
<%= if assigns[:og_image] do %>
|
||||||
|
<meta property="og:image" content={assigns[:og_image]} />
|
||||||
|
<meta name="twitter:card" content="summary_large_image" />
|
||||||
|
<meta name="twitter:image" content={assigns[:og_image]} />
|
||||||
|
<% else %>
|
||||||
|
<meta name="twitter:card" content="summary" />
|
||||||
|
<% end %>
|
||||||
|
<meta name="twitter:title" content={og_title} />
|
||||||
|
<meta name="twitter:description" content={og_description} />
|
||||||
<!-- Preload critical fonts for the current typography preset -->
|
<!-- Preload critical fonts for the current typography preset -->
|
||||||
<%= for preload <- Berrypod.Theme.Fonts.preload_links(
|
<%= for preload <- Berrypod.Theme.Fonts.preload_links(
|
||||||
@theme_settings.typography,
|
@theme_settings.typography,
|
||||||
|
|||||||
@ -52,6 +52,9 @@ defmodule BerrypodWeb.Shop.ProductShow do
|
|||||||
socket
|
socket
|
||||||
|> assign(:page_title, product.title)
|
|> assign(:page_title, product.title)
|
||||||
|> assign(:page_description, meta_description(product.description))
|
|> assign(:page_description, meta_description(product.description))
|
||||||
|
|> assign(:og_type, "product")
|
||||||
|
|> assign(:og_url, BerrypodWeb.Endpoint.url() <> "/products/#{slug}")
|
||||||
|
|> assign(:og_image, og_image_url(all_images))
|
||||||
|> assign(:product, product)
|
|> assign(:product, product)
|
||||||
|> assign(:all_images, all_images)
|
|> assign(:all_images, all_images)
|
||||||
|> assign(:gallery_images, gallery_images)
|
|> assign(:gallery_images, gallery_images)
|
||||||
@ -216,6 +219,9 @@ defmodule BerrypodWeb.Shop.ProductShow do
|
|||||||
"""
|
"""
|
||||||
end
|
end
|
||||||
|
|
||||||
|
defp og_image_url([%{url: "/" <> _ = path} | _]), do: BerrypodWeb.Endpoint.url() <> path
|
||||||
|
defp og_image_url(_), do: nil
|
||||||
|
|
||||||
defp meta_description(nil), do: nil
|
defp meta_description(nil), do: nil
|
||||||
|
|
||||||
defp meta_description(text) do
|
defp meta_description(text) do
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user