E-posta ürün bloğu

Ürün linklerinden bir e-posta kurun

Bir ürün bloğunu e-postaya sürükleyin, bir ürün linki seçin ve dolmasını izleyin. Linklerden biri bilerek hata veriyor.

Sorun

Bir ürünü kampanya e-postasına koymak, başlığını, fiyatını ve görselini tek tek elle kopyalamak demekti.

Fiyatlar değişiyor, görseller yeniden yükleniyor ve e-postadaki yanlış bir fiyat bir destek talebi demek. E-posta editörü kendi blok ve ayar paneli sistemi olan üçüncü taraf bir editör; yeni bloğun onu çatallamak yerine genişleme noktalarına oturması gerekiyordu.

Rolüm

Bloğu uçtan uca ben oluşturdum: temel blok ve bir, iki, üç ürünlük şablonlar, Content, Layout ve Ecommerce kategorilerindeki yerleri ve ayar paneli. Önce sahte veriyle kurdum, sonra gerçek scrape API'sine geçirdim ve düzenleme akışını birkaç sürüm boyunca geliştirdim.

Linkten e-posta HTML'ine

1. BlokEditöre dört varyant ve varsayılan değerlerle kayıtlı.
2. Ayar paneliLink alanları, görünürlük anahtarları, buton ve düzen ayarları; seçili bloğun farkında.
3. Scrape servisiMevcut backend endpointi ürün sayfasını okur.
4. Doldur + renderBloğa eşlenir ve tablo tabanlı e-posta HTML'i olarak dışa aktarılır.

Mor ton: benim yazdığım kısımlar.

Zor olan neydi, ne yaptım

Editörü çatallama, genişlet

Editör kendi ayar paneli bileşenleriyle geliyor. Onları yapılandırma yöneticisi üzerinden, yalnızca bir kez sarılacak şekilde bir korumayla sardım; yanlış paneli gösteren bir kayıt uyumsuzluğu böyle düzeldi.

Önce sahte veri, sonra gerçek API

İlk branch arayüz erkenden incelenebilsin diye sahte ürün verisiyle çalıştı. İkincisi scrape API'sine geçti, sürükle-bırakı düzeltti ve cross-origin istekte cookie göndermeyi bıraktı.

Güncelleme döngüsü yok

Bloğa geri yazılan varsayılan değerler ayar panelini tetikliyor, o da onları yeniden yazıyordu. Blok artık yalnızca gerçekten değişen değerleri yazıyor.

Bağlama duyarlı düzenleme

Sonraki sürümler ayar panelini bloğun nerede durduğundan haberdar etti; iki sütunlu bir düzendeki ürün orada anlamlı olan ayarları gösteriyor.