Giunsa I-publish ang Imong Shopify Blog Feed Sa Imong Klaviyo Email Template

Giunsa I-publish ang Imong Shopify Blog Feed Sa Imong Klaviyo Email Template

Nagpadayon kami sa pagpauswag ug pag-optimize sa among Shopify Plus mga paningkamot sa pagpamaligya sa email sa kliyente sa fashion gamit ang Klaviyo. Ang Klaviyo adunay lig-on nga panagsama sa Shopify nga nagtugot sa usa ka tonelada nga komunikasyon nga may kalabotan sa e-commerce nga natukod na ug andam na.

Katingad-an, ang pagsulod sa imong Mga Post sa Blog sa Shopify ngadto sa usa ka email DILI usa kanila, bisan pa! Ang paghimo sa mga butang nga mas lisud… ang dokumentasyon alang sa paghimo niini nga email dili hingpit ug wala gani magdokumento sa ilang pinakabag-o nga editor. Busa, Highbridge kinahanglan nga mohimo sa pipila ka mga pagkalot ug mahibal-an kung giunsa kini buhaton sa among kaugalingon… ug dili kini kadali.

Ania ang pag-uswag nga gikinahanglan aron kini mahitabo:

  1. Blog Feed - Ang atom feed nga gihatag sa Shopify wala maghatag bisan unsang pag-customize o wala kini naglakip sa mga imahe, mao nga kinahanglan namon nga maghimo usa ka naandan nga XML feed.
  2. Klaviyo Data Feed – Ang XML feed nga among gitukod kinahanglang i-integrate isip data feed sa Klaviyo.
  3. Klaviyo Email Template - Kinahanglan namon nga i-parse ang feed sa usa ka template sa email diin ang mga imahe ug sulud husto nga naporma.

Paghimo ug Custom Blog Feed Sa Shopify

Nakapangita ako usa ka artikulo nga adunay pananglitan nga code aron matukod ang usa ka kostumbre nga feed sa Shopify alang sa Mailchimp ug naghimo ug ubay-ubay nga mga pag-edit aron malimpyohan kini. Ania ang mga lakang sa pagtukod sa usa ka naandan nga RSS feed sa Shopify para sa imong blog.

  1. Pagdala ngadto sa imong Online Store ug pilia ang tema nga gusto nimong ibutang ang feed.
  2. Sa Actions menu, pilia Pag-edit sa Code.
  3. Sa Files menu, navigate sa Templates ug i-klik Pagdugang og bag-ong template.
  4. Sa Add a new template window, pilia Paghimo og bag-ong template alang sa blog.

Pagdugang likido nga feed sa blog sa Shopify para sa Klaviyo

  1. Pilia ang matang sa Template sa liquid.
  2. Alang sa ngalan sa File, kami misulod klaviyo.
  3. Sa editor sa code, ibutang ang mosunod nga code:

{%- layout none -%}
{%- capture feedSettings -%}
  {% assign imageSize = 'grande' %}
  {% assign articleLimit = 5 %}
  {% assign showTags = false %}
  {% assign truncateContent = true %}
  {% assign truncateAmount = 30 %}
  {% assign forceHtml = false %}
  {% assign removeCdataTags = true %}
{%- endcapture -%}
<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" 
  xmlns:content="http://purl.org/rss/1.0/modules/content/"
  xmlns:media="http://search.yahoo.com/mrss/"
  >
  <channel>
    <title>{{ blog.title }}</title>
    <link>{{ canonical_url }}</link>
    <description>{{ page_description | strip_newlines }}</description>
    <lastBuildDate>{{ blog.articles.first.created_at | date: "%FT%TZ" }}</lastBuildDate>
    {%- for article in blog.articles limit:articleLimit %}
    <item>
      <title>{{ article.title }}</title>
      <link>{{ shop.url }}{{ article.url }}</link>
      <pubDate>{{ article.created_at | date: "%FT%TZ" }}</pubDate>
      <author>{{ article.author | default:shop.name }}</author>
      {%- if showTags and article.tags != blank -%}<category>{{ article.tags | join:',' }}</category>{%- endif -%}
      {%- if article.excerpt != blank %}
      <description>{{ article.excerpt | strip_html | truncatewords: truncateAmount | strip }}</description>
      {%- else %}
      <description>{{ article.content | strip_html | truncatewords: truncateAmount | strip }}</description>
      {%- endif -%}
      {%- if article.image %}
      <media:content type="image/*" url="https:{{ article.image | img_url: imageSize }}" />
      {%- endif -%}
    </item>
    {%- endfor -%}
  </channel>
</rss>

  1. I-update ang custom variables kung gikinahanglan. Usa ka pahinumdom niini mao nga among gitakda ang gidak-on sa imahe sa labing taas nga gilapdon sa among mga email, 600px ang gilapdon. Ania ang usa ka lamesa sa mga gidak-on sa imahe sa Shopify:

Ngalan sa Imahe sa Shopify LAMAS
pico 16px x 16px
Icon 32px x 32px
kumagko 50px x 50px
gamay nga 100px x 100px
compact 160px x 160px
medium 240px x 240px
dako 480px x 480px
dako 600px x 600px
1024 X 1024 1024px x 1024px
2048 X 2048 2048px x 2048px
agalon Labing dako nga hulagway anaa

  1. Anaa na karon ang imong feed sa adres sa imong blog nga gidugtong ang querystring aron makita kini. Sa kaso sa among kliyente, ang feed URL mao ang:

https://closet52.com/blogs/fashion?view=klaviyo

  1. Ang imong feed andam na nga gamiton! Kung gusto nimo, mahimo ka nga mag-navigate niini sa usa ka window sa browser aron masiguro nga wala’y mga sayup. Atong siguroon nga kini ma-parse sa husto sa atong sunod nga lakang:

Idugang ang Imong Blog Feed Sa Klaviyo

Aron magamit ang imong bag-ong blog feed sa Klaviyo, kinahanglan nimong idugang kini isip Feed sa Data.

  1. Pagdala ngadto Mga Pagpamuhi sa datos
  2. Pagpili Idugang ang Web Feed
  3. Pagsulod Ngalan sa Feed (walay espasyo ang gitugutan)
  4. Pagsulod sa Feed URL nga imong gibuhat.
  5. Pagsulod sa Pamaagi sa Paghangyo ingon GET
  6. Pagsulod sa Type sa Content isip XML

Klaviyo Idugang ang Shopify XML Blog Feed

  1. I-klik Pag-update sa Data Feed.
  2. I-klik Talan-awon aron masiguro nga ang feed nag-populate sa husto.

I-preview ang Shopify Blog Feed sa Klaviyo

Idugang ang Imong Blog Feed Sa Imong Klaviyo Email Template

Karon gusto namong itukod ang among blog sa among email template sa Klaviyo. Sa akong opinyon, ug ang rason nganong nagkinahanglan kami og custom feed, ganahan ko og split content area diin ang hulagway naa sa wala, ang titulo ug excerpt naa sa ubos. Adunay usab kapilian si Klaviyo nga i-collapse kini sa usa ka kolum sa usa ka mobile device.

  1. Pag-drag a Gibahin nga Block sa imong email template.
  2. Ibutang ang imong wala nga kolum sa usa ka Image ug ang imong tuo nga kolum sa a Teksto block.

Klaviyo Split Block alang sa Shopify Blog Post Artikulo

  1. Alang sa imahe, pilia Dinamikong Imahe ug ibutang ang bili sa:

{{ item|lookup:'media:content'|lookup:'@url' }}

  1. Ibutang ang Alt Text sa:

{{item.title}}

  1. Ibutang ang Link Address aron kung ang email subscriber mag-klik sa imahe, kini dad-on sa imong artikulo.

{{item.link}}

  1. Pilia ang tuo nga kolum aron itakda ang sulod sa kolum.

Klaviyo Blog Post Titulo ug Deskripsyon

  1. Idugang ang imong sulod, siguroha nga magdugang ug link sa imong titulo ug isulod ang imong post excerpt.

<div>
<h3 style="line-height: 60%;"><a style="font-size: 14px;" href="{{ item.link }}">{{item.title}}</a></h3>
<p><span style="font-size: 12px;">{{item.description}}</span></p>
</div>

  1. Pilia ang Mga Setting sa Split tab.
  2. Ibutang sa a 40% / 60% nga layout sa paghatag ug dugang nga lawak alang sa text.
  3. makapahimo Stack sa Mobile ug gibutang Tuo ngadto sa Wala.

Klaviyo Split Block para sa Shopify Blog Post nga Mga Artikulo nga na-stack sa Mobile

  1. Pilia ang Pagpili sa Pagpakita tab.

Klaviyo Split Block para sa Shopify Blog Post nga Mga Artikulo sa Pagpakita sa mga Opsyon

  1. Pilia ang Content Repeat ug ibutang ang feed nga imong gibuhat sa Klaviyo isip tinubdan sa Balika Para uma:

feeds.Closet52_Blog.rss.channel.item

  1. Ibutang ang alyas sa butang as butang.
  2. I-klik Pag-preview ug pagsulay ug makita na nimo ang imong mga post sa blog. Siguroha nga sulayan kini sa desktop ug mobile mode.

Klaviyo Split Block Preview ug pagsulay.

Ug, siyempre, kung kinahanglan nimo ang tabang Shopify optimization ug Klaviyo implementasyon, ayaw pagpanuko sa pagtabang sa Highbridge.

Pagpadayag: kauban ako sa Highbridge ug gigamit nako ang akong mga kaakibat nga link para sa Shopify ug Klaviyo niining artikuloha.