Shopify Blog Lentinizi Klaviyo E-poçt Şablonunuzda Necə Yayımlamaq olar

Shopify Blog Lentinizi Klaviyo E-poçt Şablonunuzda Necə Yayımlamaq olar

Biz özümüzü təkmilləşdirməyə və optimallaşdırmağa davam edirik ShopifyPlus moda müştərinin e-poçt marketinq səylərini istifadə edərək Klaviyo. Klaviyo, əvvəlcədən qurulmuş və getməyə hazır olan bir ton e-ticarətlə əlaqəli kommunikasiyaya imkan verən Shopify ilə möhkəm inteqrasiyaya malikdir.

Təəccüblü, sizin daxil Shopify Bloq Yazıları bir e-poçt daxil olsa da, onlardan biri DEYİL! İşləri daha da çətinləşdirir... bu e-poçtun yaradılması üçün sənədlər hərtərəfli deyil və hətta onların ən yeni redaktorunu sənədləşdirmir. Belə ki, Highbridge bir az qazmaq və bunu özümüz necə edəcəyimizi anlamaq lazım idi... və bu asan deyildi.

Bunun baş verməsi üçün lazım olan inkişaf budur:

  1. Blog lenti – Shopify tərəfindən təmin edilən atom lenti heç bir fərdiləşdirmə təmin etmir və şəkillərə daxil deyil, ona görə də biz fərdi XML lenti yaratmalıyıq.
  2. Klaviyo Məlumat Lenti – Qurduğumuz XML lenti Klaviyo-da məlumat lenti kimi inteqrasiya edilməlidir.
  3. Klaviyo E-poçt Şablonu – Daha sonra şəkillərin və məzmunun düzgün formatlaşdırıldığı bir e-poçt şablonunda lenti təhlil etməliyik.

Shopify-da Fərdi Bloq Lenti yaradın

A qurmaq üçün nümunə kodu olan bir məqalə tapa bildim Shopify-da fərdi lent üçün MailChimp və onu təmizləmək üçün bir neçə düzəliş etdi. Budur a qurmaq üçün addımlar xüsusi RSS feed bloqunuz üçün Shopify-da.

  1. Gedin Qonaqlar Store və lenti yerləşdirmək istədiyiniz mövzunu seçin.
  2. Fəaliyyətlər menyusunda seçin Kodu redaktə edin.
  3. Fayllar menyusunda Şablonlar bölməsinə keçin və üzərinə klikləyin Yeni şablon əlavə edin.
  4. Yeni şablon əlavə et pəncərəsində seçin Yeni şablon yaradın üçün blog.

Klaviyo üçün Shopify-a maye blog lenti əlavə edin

  1. Şablon növünü seçin maye.
  2. Fayl adı üçün daxil etdik klaviyo.
  3. Kod redaktorunda aşağıdakı kodu yerləşdirin:

{%- 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. Lazım olduqda fərdi dəyişənləri yeniləyin. Bununla bağlı bir qeyd odur ki, biz şəkil ölçüsünü e-poçtlarımızın maksimum eninə, 600px eninə təyin etmişik. Budur Shopify-in şəkil ölçüləri cədvəli:

Shopify Şəkil Adı Ölçülər
pico 16 piksel x 16 piksel
icon 32 piksel x 32 piksel
baş barmaq 50 piksel x 50 piksel
kiçik 100 piksel x 100 piksel
yığcam 160 piksel x 160 piksel
mühit 240 piksel x 240 piksel
böyük 480 piksel x 480 piksel
böyük 600 piksel x 600 piksel
1024 1024 X 1024 piksel x 1024 piksel
2048 2048 X 2048 piksel x 2048 piksel
ustad Mövcud olan ən böyük şəkil

  1. Lentiniz indi ona baxmaq üçün əlavə edilmiş sorğu sətri ilə bloqunuzun ünvanında əlçatandır. Müştərimizin vəziyyətində lent URL-i belədir:

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

  1. Lentiniz artıq istifadəyə hazırdır! İstəsəniz, heç bir səhv olmadığından əmin olmaq üçün brauzer pəncərəsində ona keçə bilərsiniz. Növbəti addımımızda onun düzgün təhlilini təmin edəcəyik:

Blog Lentinizi Klaviyo-ya əlavə edin

Yeni blog lentinizdən istifadə etmək üçün Klaviyo, onu Data Lenti kimi əlavə etməlisiniz.

  1. gedin Məlumat lentləri
  2. seçmək Veb Lenti əlavə edin
  3. Daxil edin Lent Adı (boşluqlara icazə verilmir)
  4. Daxil edin Lent URL-i yeni yaratdığınız.
  5. Sorğu Metodunu olaraq daxil edin GET
  6. Məzmun növü kimi daxil edin XML

Klaviyo Shopify XML Blog Lentini əlavə edin

  1. Basın Data Lentini yeniləyin.
  2. Basın Preview yemin düzgün doldurulmasını təmin etmək üçün.

Klaviyo-da Shopify Blog Lentini nəzərdən keçirin

Bloq Lentinizi Klaviyo E-poçt Şablonunuza əlavə edin

İndi bloqumuzu e-poçt şablonumuzda qurmaq istəyirik Klaviyo. Fikrimcə və xüsusi lentə ehtiyac duymağımızın səbəbi, şəklin solda, başlığın və çıxarışın altında olduğu bölünmüş məzmun sahəsini bəyənirəm. Klaviyo da bunu mobil cihazda tək sütuna yığa bilmək imkanına malikdir.

  1. Sürükləyin a Bölünmüş Blok e-poçt şablonunuza daxil edin.
  2. Sol sütununuzu a təyin edin təsvir və sağ sütununuz a Mətn blok.

Shopify Blog Post Məqalələri üçün Klaviyo Split Bloku

  1. Şəkil üçün seçin Dinamik şəkil və dəyəri təyin edin:

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

  1. Alternativ mətni təyin edin:

{{item.title}}

  1. Link ünvanını elə təyin edin ki, e-poçt abunəçisi şəklin üzərinə klik etsə, onları məqalənizə gətirsin.

{{item.link}}

  1. Seçin sağ sütun sütun məzmununu təyin etmək üçün.

Klaviyo Bloq Yazısının Başlığı və Təsviri

  1. Əlavə edin məzmun, başlığınıza bir keçid əlavə etməyi və yazıdan çıxarışınızı daxil etməyi unutmayın.

<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. Seçin Ayırma Parametrləri nişanı.
  2. a təyin edin 40% / 60% düzən mətn üçün daha çox yer təmin etmək.
  3. Imkan Mobildə yığın və qurduq Sağdan sola.

Mobildə yığılmış Shopify Blog Post Məqalələri üçün Klaviyo Split Bloku

  1. Seçin Göstəriş Seçimləri nişanı.

Shopify Blog Post Məqalələri Ekran Seçimləri üçün Klaviyo Split Bloku

  1. Məzmun Təkrarını seçin və Klaviyo-da yaratdığınız lenti mənbə kimi daxil edin Üçün təkrarlayın sahə:

feeds.Closet52_Blog.rss.channel.item

  1. Ayarlayın Element ləqəbi as maddə.
  2. Basın Öncədən baxın və sınaqdan keçirin və indi blog yazılarınızı görə bilərsiniz. Həm masa üstü, həm də mobil rejimdə sınaqdan keçirdiyinizə əmin olun.

Klaviyo Split Block Preview və test.

Və əlbəttə ki, yardıma ehtiyacınız varsa Shopify optimallaşdırma və Klaviyo tətbiqlər üçün müraciət etməkdən çəkinməyin Highbridge.

Açıqlama: Mən ortaqam Highbridge və mən filial bağlantılarımdan istifadə edirəm ShopifyKlaviyo bu yazıda.