Kurulum ve geliştirme

Shopify tema geliştirme

Online Store 2.0 mimarisine uygun, hızlı ve ekibinizin kod bilmeden düzenleyebileceği temalar geliştiriyoruz: hazır temanın özelleştirilmesinden markanıza özel temaya kadar.

Tema ön görüşmesi planlayın Ücretsiz ön analiz alın

5.0 müşteri puanı

Üç yol, üç farklı ihtiyaç

Her marka özel temaya ihtiyaç duymaz. Ön analizde mevcut temanızı ve hedeflerinizi inceleyip doğru yolu öneriyoruz.

Kriter	Hazır OS 2.0 tema	Hazır temanın özelleştirilmesi	Markaya özel tema
Yayına çıkış	En hızlı	Hızlı	Proje süresince
Marka ayrışması	Sınırlı	Orta	Tam
Özel bölümler (section)	Yok	Var	Var
Tema güncellemeleri	Tema geliştiricisinden	Dikkatli birleştirme gerekir	Bizim tarafımızdan yönetilir
Hız kontrolü	Temaya bağlı	Var	Baştan hedeflenir
Kimler için	Yeni başlayanlar	Büyüyen markalar	Ayrışmak isteyen markalar

Hazır OS 2.0 tema

Yayına çıkış: En hızlı
Marka ayrışması: Sınırlı
Özel bölümler (section): Yok
Tema güncellemeleri: Tema geliştiricisinden
Hız kontrolü: Temaya bağlı
Kimler için: Yeni başlayanlar

Hazır temanın özelleştirilmesi

Yayına çıkış: Hızlı
Marka ayrışması: Orta
Özel bölümler (section): Var
Tema güncellemeleri: Dikkatli birleştirme gerekir
Hız kontrolü: Var
Kimler için: Büyüyen markalar

Markaya özel tema

Yayına çıkış: Proje süresince
Marka ayrışması: Tam
Özel bölümler (section): Var
Tema güncellemeleri: Bizim tarafımızdan yönetilir
Hız kontrolü: Baştan hedeflenir
Kimler için: Ayrışmak isteyen markalar

Kod bilmeden düzenlenebilen sayfalar

Online Store 2.0 ile her sayfa section ve block'lardan oluşur. Geliştirdiğimiz her bölüm, tema düzenleyicide ayarlarıyla birlikte gelir; ekibiniz kampanya sayfasını, ürün açıklama bloklarını ve ana sayfa düzenini kendi başına değiştirebilir.

Her şablonda sürükle-bırak section'lar
Metafield ve metaobject ile dinamik içerik
Mobilde ayrı ayarlanabilen görünüm
Tema düzenleyicide Türkçe açıklamalar

Örnek: düzenlenebilir bir section şeması

Her section, tema düzenleyicide görünen ayarlarını kendi şemasında tanımlar. Aşağıdaki örnekte başlık, metin, görsel ve buton ayarlanabilir; block'larla öne çıkan özellikler eklenebilir.

liquid

1{% schema %}2{3  "name": "Öne çıkan koleksiyon",4  "settings": [5    { "type": "text", "id": "baslik", "label": "Başlık" },6    { "type": "collection", "id": "koleksiyon", "label": "Koleksiyon" },7    { "type": "range", "id": "adet", "label": "Ürün sayısı",8      "min": 2, "max": 12, "step": 1, "default": 4 }9  ],10  "blocks": [11    { "type": "ozellik", "name": "Özellik",12      "settings": [{ "type": "text", "id": "metin", "label": "Metin" }] }13  ],14  "presets": [{ "name": "Öne çıkan koleksiyon" }]15}16{% endschema %}

Tema yenilemeyle değişenler

Önce

Eski veya ağır tema

Her değişiklik için geliştiriciye ihtiyaç
Onlarca uygulamanın yüklediği gereksiz kod
Mobilde kayan ve geç yüklenen görseller
Kampanya sayfası açmak günler alıyor

Sonra

OS 2.0 uyumlu tema

Ekip, sayfaları tema düzenleyicide kendisi kuruyor
Uygulama yerine tema içi bölümler
Core Web Vitals baştan hedefleniyor
Yeni kampanya sayfası şablondan dakikalar içinde

Tema projesi nasıl ilerler?

Canlı mağazanız proje boyunca etkilenmez; çalışma yayınlanmamış bir tema kopyasında yürür.

1
Analiz
Mevcut tema, uygulamalar ve sayfa şablonları incelenir.
Tema analiz raporu
2
Tasarım
Ana sayfa, koleksiyon, ürün ve sepet tasarımları hazırlanır.
Onaylı tasarımlar
3
Geliştirme
Section'lar, block'lar ve şablonlar kodlanır.
Önizleme teması
4
Test
Cihaz, tarayıcı, hız ve erişilebilirlik testleri yapılır.
Test raporu
5
Yayın
Tema yayınlanır, ekibinize düzenleyici eğitimi verilir.
Eğitim ve doküman

Her temada standart olanlar

Görünümün yanında arka planda çalışan kalite kriterleri.

Performans bütçesi
Görsel, yazı tipi ve kod boyutu için baştan belirlenen sınırlar.
SEO uyumlu yapı
Doğru başlık hiyerarşisi, yapısal veri ve temiz URL'ler.
Erişilebilirlik
Klavye ile gezinme, kontrast ve alternatif metinler.
Çoklu dil ve para birimi
Shopify Markets ile uyumlu çeviri ve fiyat gösterimi.
Uygulama blokları
Uygulamaların tema koduna dokunmadan eklenmesi.
Teslim dokümanı
Her section'ın ne işe yaradığını anlatan kullanım kılavuzu.