Shopify Ürün Sayfalarına Instagram Görünürlüğü Eklemek: Ücretsiz Animated Liquid Kullanımı
Shopify mağazanızın dönüşüm oranlarını artırmanın yeni bir yolu var: Instagram Animated Liquid!
Bu özellik sayesinde ürün sayfanızda, ürününüzün Instagram’da kaç görüntülenme aldığını etkileyici bir şekilde gösterebilirsiniz.
Üstelik bu liquid kodu tamamen ücretsiz ve kullanımı çok kolay.
Neden Instagram Animated Liquid Kullanmalısınız?
- Sosyal Kanıt: Ürününüzün popüler olduğunu göstermek satışları artırır.
- Güven Artışı: 4 milyon görüntülenme gibi büyük sayılar müşteriye güven verir.
- Estetik Görünüm: Ürün sayfanıza hareket ve canlılık katar.
- Kolay Entegrasyon: Kod bilmeden, birkaç adımda kurulumu yapabilirsiniz.
Adım Adım Kurulum Rehberi
1. Shopify Editörüne Gidin
- Ürün sayfanızın düzenleme moduna girin.
- Sol menüden Add Block seçeneğine tıklayın.
2. “Custom Liquid” Bloğu Ekleyin
- “Search Blocks” bölümüne Custom Liquid yazın ve ekleyin.
3. Kodu Yapıştırın
- Size verilen Instagram Animated Liquid kodunu Custom Liquid bloğuna yapıştırın.
4. Kaydedin ve Yayınlayın!
- Sayfanızı kaydederek Instagram görünürlüğü göstergesi eklenmiş ürün sayfanızı aktif hale getirin.
Full code 👇
<section class="spacekris">
<div class="gradient-border">
<section class="tiktokkrismotion">
<svg fill="rgba(0, 0, 0, 1)" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" stroke="rgba(0, 0, 0, 1)">
<path d="M128,84a44,44,0,1,0,44,44A44.04978,44.04978,0,0,0,128,84Zm0,80a36,36,0,1,1,36-36A36.04061,36.04061,0,0,1,128,164ZM172,32H84A52.059,52.059,0,0,0,32,84v88a52.059,52.059,0,0,0,52,52h88a52.059,52.059,0,0,0,52-52V84A52.059,52.059,0,0,0,172,32Zm44,140a44.04978,44.04978,0,0,1-44,44H84a44.04978,44.04978,0,0,1-44-44V84A44.04978,44.04978,0,0,1,84,40h88a44.04978,44.04978,0,0,1,44,44ZM188,76a8,8,0,1,1-8-8A8.00917,8.00917,0,0,1,188,76Z"></path>
</svg>
<b>Over 4m views on instagram</b>
</section>
</div>
</section>
<style>
.spacekris {
display: flex;
align-items: center;
justify-content: center;
height: 80px;
}
.gradient-border {
padding: 2px;
border-radius: 60px;
background: linear-gradient(
45deg,
rgba(254, 218, 117, 1),
rgba(250, 126, 30, 1),
rgba(214, 41, 118, 1),
rgba(150, 47, 191, 1),
rgba(79, 91, 213, 1)
);
background-size: 200% 200%;
animation: gradientShift 5s ease infinite;
}
.tiktokkrismotion {
border-radius: 60px;
padding: 4px 20px;
background-color: rgb(248 248 248);
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
}
.tiktokkrismotion b {
font-size: 14px;
font-weight: 500;
}
.tiktokkrismotion svg {
height: 22px;
}
@keyframes gradientShift {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
</style>
Bu blog yazımızda bahsedilen hiçbir marka ile #işbirliğimiz yoktur. İyi satışlar diliyoruz! .. 🧑🏻💻 😊
