Görsel yükleme

Şirket logonuz, ürün görselleriniz, slayt gösterileriniz, banner'larınız ve blog gönderisi görselleriniz gibi farklı görsel türlerini kullanabilirsiniz. Ayrıca, görsellerinizi kırpma ve yeniden boyutlandırma işlemleriyle dönüştürebilir, mağazanızda görüntülenen tüm medyalardaki kenarlığı veya gölgeyi değiştirmek için temanızın medya ayarlarını kişiselleştirebilirsiniz.

Görsellerin online mağazanızda tam olarak istediğiniz şekilde gösterilmesi için görselde doğru en-boy oranını kullanmanız gerekir. Görseller, Shopify İçerik Teslimat Ağı (CDN) ile vitrininiz için otomatik olarak optimize edilir.

Tema düzenleyicisinde görsel yükleme

Tema düzenleyicisinde, temanıza görseller ekleyebilirsiniz. Ayrıca, Shopify yöneticinizin İçerik > Dosyalar bölümünden de görsel yükleyebilirsiniz. Daha fazla bilgi edinmek için Dosyaları yükleme ve yönetme sayfasına bakın.

Basamak

Meta alanları kullanarak görsel ekleme

Görselleriniz için ayarlanmış meta alanlar varsa online mağazanıza görsel eklemek için dinamik kaynak seçiciyi kullanabilirsiniz. Meta alanlar ve desteklenen görsel biçimleri hakkında daha fazla bilgi edinmek için Meta alanlara değer ekleme bölümüne bakın.

Bir görselde odak noktası ayarlama

Online mağazanızdaki bir görselin en önemli bölümünü tanımlamak için odak noktalarını kullanabilirsiniz. Görselde ayarladığınız odak noktası, odaklanılan alan haline gelir. Sayfa düzenine uyması için görselinizi kırpan bir temanız olsa bile odak noktaları her zaman ön planda gösterilir. Odak noktaları, görselinizin farklı ekran boyutlarında ve temalarda farklı en-boy oranları kullanıldığı durumlarda nasıl gösterileceği üzerinde daha fazla kontrol sahibi olmanızı sağlar.

Görsel başına yalnızca bir odak noktanız olabilir ancak bu odak noktasını dilediğiniz zaman değiştirebilir veya kaldırabilirsiniz.

Ücretsiz Shopify temalarında odak noktası uyumluluğu

Ücretsiz Shopify temalarının aşağıdaki sürümlerinde odak noktası seçebilirsiniz:

  • Colorblock 3.0.0 sürümü ve sonraki sürümler
  • Craft 5.0.0 sürümü ve sonraki sürümler
  • Crave 5.0.0 sürümü ve sonraki sürümler
  • Dawn 7.0.0 sürümü ve sonraki sürümler
  • Origin 5.0.0 sürümü ve sonraki sürümler
  • Publisher 1.0.0 sürümü ve sonraki sürümler
  • Refresh 2.0.0 sürümü ve sonraki sürümler
  • Ride 3.0.0 sürümü ve sonraki sürümler
  • Rise 1.0.0 sürümü ve sonraki sürümler
  • Sense 5.0.0 sürümü ve sonraki sürümler
  • Spotlight 0.0.1 sürümü ve sonraki sürümler
  • Studio 4.0.0 sürümü ve sonraki sürümler
  • Taste 4.0.0 sürümü ve sonraki sürümler
  • Trade 5.0.0 sürümü ve sonraki sürümler

Üçüncü taraf bir tema kullanıyorsanız temanın odak noktası kullanımını destekleyip desteklemediğini öğrenmek için temanızın belgelerine bakın.

Bir görsele odak noktası ekleme

Bir görsele odak noktası ekler ve daha sonra bu görseli online mağazanızın farklı yerlerinde kullanırsanız görseli kullandığınız her yerde aynı odak noktası uygulanır.

Odak noktası, temanızın görselleri kırpma ve yeniden boyutlandırma şekline bağlı olarak her zaman görüntünün ortasında olmayabilir.

Basamak

  1. Shopify yöneticinizde, aşağıdaki konumlardan herhangi birinde bir görsele tıklayın:

    • İçerik > Dosyalar bölümünde.
    • Tema düzenleyicisinde.
    • Ürünler bölümündeki ürün girişlerinizin Medya bölümünde .
    • Shopify Email düzenleyicisinde.
    • Görsel eklemek için Dosya referansı türünde meta alan içeren herhangi bir kaynağın Meta alanlar bölümünde.
  2. Görselin odak noktası ayarlamak istediğiniz bölümünü seçmek için görsele tıklayın veya mavi noktayı sürükleyin.

  3. Kayıtyap ' a tıklayın.

Bir görselden odak noktasını kaldırma

Basamak

  1. Shopify yöneticinizde, aşağıdaki konumlardan herhangi birinde bir görsele tıklayın:

    • İçerik > Dosyalar bölümünde.
    • Tema düzenleyicisinde.
    • Ürünler bölümündeki ürün girişlerinizin Medya bölümünde .
    • Shopify Email düzenleyicisinde.
    • Görsel eklemek için Dosya referansı türünde meta alan içeren herhangi bir kaynağın Meta alanlar bölümünde.
  2. Kaldır'a tıklayın.

  3. Yeni olarak kaydet'e tıklayın.

Görsel biçimleri

Aşağıdaki görsel biçimleri desteklenir:

  • JPEG
  • Aşamalı JPEG
  • PNG
  • GIF
  • HEIC
  • WebP
  • AVIF

JPEG biçimindeki görselleri kullanma

JPEG biçimindeki görseller, fotoğrafçılık ve karmaşık renkler içeren hareketsiz görüntüler için idealdir. JPEG biçiminde milyonlarca renkten oluşan bir palet bulunur. Ayrıca JPEG, görsel kalitesinde gözle görülür bir kayıp olmadan sayfa yükleme sürelerinin kısa tutulmasına yardımcı olabilecek kayıplı sıkıştırma işlevini kullanır. Aşağıdaki görsel türleri için JPEG biçimini kullanın:

  • ürün
  • banner'lar veya slayt gösterileri
  • sayfalar ve blog gönderileri

PNG biçimindeki görselleri kullanma

PNG biçimindeki görseller, düz renkli ve gradyansız grafikler ve simgeler için idealdir. PNG biçimi, görsellerde saydamlığı da destekleyebilir. Aşağıdaki görsel türleri için PNG biçimini kullanın:

  • logolar
  • simgeler
  • kenarlıklar ve süslemeler

Otomatik görsel sıkıştırma ve biçim seçimi

Sayfaların hızlı yüklenmesi için Shopify, görseller online mağazanızda gösterildiğinde bunları otomatik olarak sıkıştırır. Bir görselin sıkıştırılması, sayfa yükleme sürelerinin daha kısa olması için dosya boyutunun azaltılması anlamına gelir.

Ayrıca Shopify, görsellerinizi iletirken kullanılabilecek en iyi dosya biçimini otomatik olarak belirler. Örneğin, bir müşterinin web tarayıcısının WebP ve AV1 Görsel Dosyası Biçimi (AVIF) gibi modern görsel biçimlerini desteklediğini tespit ettiğimizde, görseliniz bu biçimlerde sunulur.

Dosya boyutunu küçülterek performansı artırmak için GIF'ler otomatik olarak animasyonlu WebP biçimine dönüştürülür.

Görsel yükleme sınırları

Shopify'a yüklenen görsellerde, hem megapiksel kısıtlaması hem de megabayt cinsinden ölçülen dosya boyutu kısıtlaması söz konusudur. Megapiksel, bir görselin kaç milyon pikselden oluştuğunu belirtmek için kullanılır. Megabayt, bir görselin kaç milyon bayt bellek veya disk alanı kapladığını belirtmek için kullanılır.

Shopify'a yüklenen görseller aşağıdaki sınırlardan herhangi birini aşamaz:

  • 20 megapiksel
  • 20 megabayt

Görselnizin megapiksel değerini bulmak için aşağıdaki denklemi kullanabilirsiniz:

(pixel width x pixel height)/1,000,000

Örneğin, 4900 x 6930 piksel çözünürlüğe sahip bir görsel, şu denkleme göre 33,9 megapikseldir: (4900x6930)/1,000,000 = 33.9 MP.

Görsellerin renk profilleri

Online mağazanızda bir görseli görüntülediğinizde görseldeki renkler, Shopify'a yüklediğiniz orijinal görseldeki renklerden farklı görünebilir. Bu, bir görsel .ICC veya .ICM uzantılı bir dosyada saklanan veri kümesinden oluşan bir renk profiline sahip olduğunda gerçekleşir.

Renk profilleri genellikle, renklerin farklı cihazlarda görünme biçimini standart hale getirmeye yardımcı olmak üzere görsellere eklenir. Görseller online mağazanızda gösterildiğinde bunların renk profilleri kaldırılır.

Renk profilleri aşağıdaki nedenlerden dolayı kaldırılır:

  • Her cihaz .ICC veya .ICM renk profillerini okuyamaz. Bu nedenle, bunların olduğu gibi bırakılması cihazlardaki görsel renklerinde tutarsızlıklara neden olabilir.
  • Yüklenen bir görsel renk profili içermiyorsa web tarayıcısı görsellerin, web'de görsel görüntüleme için en sık kullanılan renk profili olan sRGB profiline sahip olduğunu varsayar. Bu, görsellerinizin tüm başlıca web tarayıcılarında ve cihazlarda aynı şekilde gösterilmesini sağlar.
  • Renk profilleri büyük miktarlarda disk alanı kaplar ve bu, yükleme sürelerinin uzamasına neden olur.

Bir görselden renk profilini kaldırma

Görselinizi Shopify'a yüklemeden önce renk profili olmadan kaydederek görselinizden renk profilini kaldırabilirsiniz. Bu işlem, görsel düzenleme programınıza bağlı olarak değişiklik gösterir.

Renk profili atama veya kaldırma (Illustrator, Photoshop) ve Renk profili atama veya kaldırma (InDesign) ile ilgili Adobe belgelerini gözden geçirin.

Slayt gösterileri, görsel banner'ları ve tam genişliğe sahip görseller için en iyi uygulamalar

Shopify temalarının birçoğu, tarayıcınızın yüksekliğine göre ölçeklenen veya ekran boyutunuza uyarlanan büyük görseller veya slayt gösterileri içerir.

Bu temalardan birini kullanıyorsanız veya büyük bir slayt gösteriniz ya da arka plan resminiz varsa hangi tür görsellerin en iyi şekilde gösterileceğini anlamanız gerekir.

Büyük görseller tüm cihazlara sığmadığından Shopify bazen, kullandığınız cihaza bağlı olarak görselin yalnızca bir kısmını gösterir. Görsel slayt gösteriniz çok sayıda büyük görsel içeriyorsa görsellerin bazı kısımlarının görünmediğini fark edebilirsiniz.

Slayt gösterilerinde veya görsel banner'larında görsel kullanımıyla ilgili önemli hususlar

Görsellerinizin temanızda doğru şekilde görüneceğinden emin olmak için aşağıdaki hususları göz önünde bulundurun:

  • Slayt gösterileri veya arka planlar için kullandığınız görsellerin içinde metin bulunmamalıdır. Metin, görselin bir parçasıysa temanıza bağlı olarak taşınabilir, kırpılabilir veya düzenlenebilir. Slayt gösterilerinize ve arka planınıza metin ve bağlantı eklemek için tema düzenleyicisini kullanın.

  • Slayt gösterilerinde veya arka plan olarak kullandığınız görsellerde, görselin üzerindeki metnin kolay okunabilmesi için basit görseller seçin.

Uzun ekranlarda geniş görseller

Görsellerin görüntülenmesi için kullanılan cihazın ekranı uzunsa (dikey modda kullanılan bir cep telefonu veya tablet gibi) geniş görseller soldan ve sağdan kırpılabilir. Aşağıdaki örnekte, insanlar görselin en önemli parçasıysa görselin sağ tarafına bir odak noktası ekleyebilirsiniz.

Uzun ekranlarda geniş görseller

Geniş ekranlarda uzun görseller

Görsellerin görüntülenmesi için kullanılan cihazın ekranı genişse (dizüstü veya masaüstü bilgisayar gibi) uzun görseller üstten ve alttan kırpılabilir. Aşağıdaki örnekte, ayakkabılar görselin en önemli parçasıysa görselin alt tarafına bir odak noktası ekleyebilirsiniz.

Geniş ekranlarda uzun görseller

Aradığınız cevapları bulamıyor musunuz? Yardımcı olmak için buradayız.