Temamın kendi zengin metin bölümünden farkı ne?

Tema sürümlerinde çoğu zaman eksik kalanları ekler: her başlık bloğu için başlık etiketi ve boyutu (H1–H3 ya da paragraf), üç okuma genişliği, masaüstü ve mobil için ayrı metin hizalaması, odak noktalı ve katmanlı isteğe bağlı masaüstü ve mobil arka plan görseli, cihaza göre boşluk, görünürlük ve çapa kimliği (anchor ID).

Sayfanın H1 başlığı olarak kullanabilir miyim?

Evet. Bu bölüm sayfanın ana başlığını taşıyorsa, örneğin bölümlerle kurulmuş bir açılış sayfasında, başlık bloğunun etiketini H1 yapın. Sayfada tek bir H1 olsun; diğer her yerde H2 bırakın.

Arka plan fotoğrafında metni nasıl okunur tutarım?

Katman opaklığını artırın (yüzde 0 ile 90 arası, istediğiniz renkte) ve açık bir metin rengi seçin. Görsel, metnin arkasında çerçeveli bir panelde durur.

Sayfayı yavaşlatır mı?

Hayır. Hiç JavaScript içermez. İsteğe bağlı belirme animasyonu, destekleyen tarayıcılarda CSS’in kaydırmaya bağlı animasyonunu kullanır ve hareketin azaltılması tercihinde atlanır. Arka plan görseli yalnızca bölüm sayfadaki ilk iki bölümden biriyse hemen yüklenir.

Zengin metin

Üst başlık, başlık, metin ve düğmeler istediğiniz sırada blok olarak; üç okuma genişliği, cihaza göre hizalama, renk, gradyan ya da katmanlı görsel arka plan.

Kategori: İçerik ve hikâye anlatımı
Kullanım yeri: Ana sayfa, Hakkımızda, Koleksiyon, Açılış sayfaları, Her sayfa
Okuduğu veri: Yalnızca içerik
Boyut: 22 KB, JavaScript yok
Lisans: MIT, müşteri işlerinde ücretsiz

Markdown olarak görüntüle ChatGPT’de aç Claude’da aç

Kısaca

Zengin metin, bir başlığı, birkaç paragrafı ve düğmeleri tek başına gösteren ücretsiz bir Shopify bölümüdür: bir marka cümlesi, bir bakım notu ya da kısa bir koleksiyon girişi için. Üst başlık, başlık, metin ve düğmeler sırasını değiştirebileceğiniz bloklardır; metin dar, orta ya da geniş bir okuma genişliğinde kalır, hizalama cihaza göre ayarlanır ve arka plan bir renk, bir gradyan ya da katman altında masaüstü ve mobil görsel olabilir. JavaScript içermez ve Online Store 2.0 temalarında uygulama olmadan çalışır.

Örnek içerikli demo

Ne zaman kullanılır

Ana sayfada görsel bölümlerin arasında kısa bir marka cümlesi ya da misyon satırı
Bir koleksiyon ızgarasının üstünde ya da Hakkımızda sayfasının başında bir giriş metni
Arka plan fotoğrafı üzerinde, indirime giden bir düğmeyle kampanya mesajı

Tema düzenleyicide

İstediğiniz sırada bloklar: üst başlık, başlık (H1–H3 ya da paragraf etiketi, dört boyut), metin (üç boyut), düğmeler
Düğme bloğu başına iki düğme: dolu, çerçeveli ya da metin bağlantısı, isteğe bağlı yeni sekme
Metin genişliği: dar, orta ya da geniş; sayfa ya da tam genişlik
Cihaza göre metin hizalaması
Her biri kendi odak noktasına sahip isteğe bağlı masaüstü ve mobil arka plan görseli; katman rengi ve opaklığı; panel köşe yuvarlaklığı
Arka plan rengi ya da gradyanı, metin, vurgu ve vurgu üzerindeki metin renkleri
Cihaza göre üst ve alt boşluk, yalnızca masaüstünde/mobilde göster, çapa kimliği (anchor ID), kaydırınca belirme

Dosyalar

sections/lib-rich-text.liquid

İndir

Kodu görün

lib-rich-text.liquid dosyasını açın

snippets/lib-image.liquid

İndir

Kodu görün

lib-image.liquid dosyasını açın

snippets/lib-button.liquid

İndir

Kodu görün

lib-button.liquid dosyasını açın

Sade Liquid ve CSS ile, JavaScript olmadan yazıldı. Uygulama da bağımlılık da yok.

Temanıza nasıl eklenir

Bölüm dosyasını temanızın sections klasörüne, listelediği snippet’leri de snippets klasörüne kopyalayın.
Tema düzenleyicide Add section’ı (Bölüm ekle) seçin ve adı “Lib ·” ile başlayan bölümü ekleyin.
Örnek metni mağazanızın kendi metniyle değiştirin, renkleri markanıza göre ayarlayın.

Sık sorulan sorular

Temamın kendi zengin metin bölümünden farkı ne?: Tema sürümlerinde çoğu zaman eksik kalanları ekler: her başlık bloğu için başlık etiketi ve boyutu (H1–H3 ya da paragraf), üç okuma genişliği, masaüstü ve mobil için ayrı metin hizalaması, odak noktalı ve katmanlı isteğe bağlı masaüstü ve mobil arka plan görseli, cihaza göre boşluk, görünürlük ve çapa kimliği (anchor ID).
Sayfanın H1 başlığı olarak kullanabilir miyim?: Evet. Bu bölüm sayfanın ana başlığını taşıyorsa, örneğin bölümlerle kurulmuş bir açılış sayfasında, başlık bloğunun etiketini H1 yapın. Sayfada tek bir H1 olsun; diğer her yerde H2 bırakın.
Arka plan fotoğrafında metni nasıl okunur tutarım?: Katman opaklığını artırın (yüzde 0 ile 90 arası, istediğiniz renkte) ve açık bir metin rengi seçin. Görsel, metnin arkasında çerçeveli bir panelde durur.
Sayfayı yavaşlatır mı?: Hayır. Hiç JavaScript içermez. İsteğe bağlı belirme animasyonu, destekleyen tarayıcılarda CSS’in kaydırmaya bağlı animasyonunu kullanır ve hareketin azaltılması tercihinde atlanır. Arka plan görseli yalnızca bölüm sayfadaki ilk iki bölümden biriyse hemen yüklenir.

Yayınlamadan önce

Demolardaki metinler örnek içeriktir. Yayımlamadan önce kendi mağazanızın bilgileriyle değiştirin.
Hareketin azaltılmasını isteyen ziyaretçilerde animasyonlar kapalıdır.
Her dosya burada yayımlanmadan önce Shopify Theme Check ile kontrol edilir.

Temanıza uyarlanmış bir sürüme ya da burada olmayan bir bölüme mi ihtiyacınız var? Şu sayfaya bakın: Shopify tema geliştirme.

İçerik ve hikâye anlatımı
Özellik kartları
İkon, başlık ve metinli iki ile dört sütun kart. Masaüstünde imleci yumuşak bir ışıltı izler; dokunmatik ekranlarda kartlar ışıltısız görünür.
İçerik ve hikâye anlatımı
Nasıl çalışır
Abonelik, siparişe özel üretim ya da hizmetler için bir çizgiyle bağlanan numaralı, simgeli adımlar: masaüstünde yan yana, mobilde alt alta; düğme eklenebilir.
İçerik ve hikâye anlatımı
Görsel kolaj
Başlık, metin ve düğmeli bir kartın yanında üst üste binen iki ya da üç fotoğraf; Hakkımızda sayfalarına uygun. Mobilde düzenli ızgara, Liquid ve CSS.