Kiel Eldoni Vian Shopify Blogo Fluon En Via Klaviyo Retpoŝta Ŝablono

Ni daŭre plibonigas kaj optimumigas nian ShopifyPlus retpoŝtajn merkatajn klopodojn de moda kliento uzante Klaviyo. Klaviyo havas solidan integriĝon kun Shopify, kiu ebligas multon da elektronika komerco-rilataj komunikadoj, kiuj estas antaŭkonstruitaj kaj pretaj.

Surprize, enmetante vian Shopify Blogaj Afiŝoj en retpoŝton NE estas unu el ili, tamen! Farante aferojn eĉ pli malfacilaj... la dokumentado por konstrui ĉi tiun retpoŝton ne estas ĝisfunda kaj eĉ ne dokumentas ilian plej novan redaktilon. Do, Highbridge devis fari iom elfosi kaj eltrovi kiel fari ĝin mem... kaj ĝi ne estis facila.

Jen la evoluo necesa por ke tio okazu:

1. Bloga Fluo – La atoma nutrado provizita de Shopify ne provizas ajnan personigon nek inkluzivas bildojn, do ni devas konstrui kutiman XML-fluon.
2. Klaviyo Datumfluo – La XML-fluo, kiun ni konstruis, devas esti integrita kiel datumfluo en Klaviyo.
3. Klaviyo Retpoŝta Ŝablono – Ni tiam devas analizi la fluaĵon en retpoŝtan ŝablonon, kie la bildoj kaj enhavo estas konvene formatitaj.

Konstruu Propra Bloga Fluo En Shopify

Mi povis trovi artikolon kun ekzempla kodo por konstrui a kutima nutrado en Shopify por MailChimp kaj faris kelkajn redaktojn por purigi ĝin. Jen la paŝoj por konstrui a kutima RSS-fluo en Shopify por via blogo.

1. Iru al via online Store kaj elektu la temon, en kiu vi volas meti la nutradon.
2. En la menuo Agoj, elektu Redaktu Kodon.
3. En la menuo Dosieroj, navigu al Ŝablonoj kaj alklaku Aldonu novan ŝablonon.
4. En la fenestro Aldoni novan ŝablonon, elektu Kreu novan ŝablonon por blogo.

5. Elektu Ŝablonospecon de likvaĵo.
6. Por la Dosiernomo, ni eniris klaviyo.
7. En la kodredaktilo, metu la sekvan kodon:

{%- 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>

8. Ĝisdatigu la kutimajn variablojn laŭbezone. Unu noto pri tio estas, ke ni agordis la bildograndecon al la maksimuma larĝo de niaj retpoŝtoj, 600px larĝa. Jen tabelo de la bildaj grandecoj de Shopify:

Shopify Bilda Nomo	Grandecoj
beko	16px x 16px
ikono	32px x 32px
dikfingro	50px x 50px
malgranda	100px x 100px
kompakta	160px x 160px
meza	240px x 240px
granda	480px x 480px
granda	600px x 600px
1024 X 1024	1024px x 1024px
2048 X 2048	2048px x 2048px
majstro	Plej granda bildo disponebla

9. Via nutrado nun haveblas ĉe la adreso de via blogo kun la demandŝnuro aldonita por vidi ĝin. En la kazo de nia kliento, la feed URL estas:

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

10. Via nutrado nun estas preta por uzi! Se vi volas, vi povas navigi al ĝi en retumila fenestro por certigi, ke ne estas eraroj. Ni certigos, ke ĝi analizas ĝuste en nia sekva paŝo:

Aldonu Vian Blogan Fluton En Klaviyo

Por uzi vian novan blogfluon en Klaviyo, vi devas aldoni ĝin kiel Datuman Fluon.

1. Iru al Datumaj Fluoj
2. elektu Aldonu TTT-fluon
3. Eniru Nomo de Nutraĵo (neniuj spacoj estas permesitaj)
4. Eniru la Flua URL ke vi ĵus kreis.
5. Enigu la Peton-Metodon kiel GET
6. Enigu la Enhavan Tipon kiel XML

7. klaku Ĝisdatigu Datumfluon.
8. klaku antaŭvido por certigi, ke la nutrado ĝuste loĝas.

Aldonu Vian Blogan Fluon Al Via Retpoŝta Ŝablono Klaviyo

Nun ni volas konstrui nian blogon en nian retpoŝtan ŝablonon en Klaviyo. Miaopinie, kaj la kialo, kial ni bezonis kutiman fluadon, mi ŝatas dividitan enhavareon kie la bildo estas maldekstre, la titolo kaj eltiraĵo estas malsupre. Klaviyo ankaŭ havas la eblon kolapsigi ĉi tion en ununuran kolumnon sur movebla aparato.

1. Trenu a Split Bloko en vian retpoŝtan ŝablonon.
2. Agordu vian maldekstran kolumnon al an bildo kaj via dekstra kolumno al a teksto bloko.

3. Por la bildo, elektu Dinamika Bildo kaj agordu la valoron al:

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

4. Agordu la Alttekston al:

{{item.title}}

5. Agordu la Ligan Adreson por ke se la retpoŝta abonanto klakas sur la bildo, ĝi alportos ilin al via artikolo.

{{item.link}}

6. Elektu la dekstra kolumno por agordi la kolumnenhavon.

7. Aldonu vian enhavo, nepre aldonu ligilon al via titolo kaj enigu vian afiŝon eltiraĵo.

<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>

8. Elektu la Dividi Agordojn langeton.
9. Agordu al a 40% / 60% aranĝo por havigi pli da loko por teksto.
10. ebligi Staku sur Poŝtelefono kaj aro Dekstre al Maldekstre.

11. Elektu la Vidigi Eblojn langeton.

12. Elektu Enhavan Ripeton kaj metu la fonton, kiun vi kreis en Klaviyo, kiel la fonton en la Ripeti Por kampo:

feeds.Closet52_Blog.rss.channel.item

13. Ŝanĝu la Item kaŝnomo as objekton.
14. klaku Antaŭrigardo kaj provo kaj vi nun povas vidi viajn blogajn afiŝojn. Nepre testi ĝin en kaj labortabla kaj movebla reĝimo.

Kaj, kompreneble, se vi bezonas helpon Shopify optimumigo kaj Klaviyo efektivigoj, ne hezitu kontakti Highbridge.

Malkaŝo: Mi estas partnero en Highbridge kaj mi uzas miajn filiajn ligilojn por Shopify kaj Klaviyo en ĉi tiu artikolo.