Product Media Pro - Ürün Sayfasına Video, Google Haritalar, Instagram, Ses veya Özel HTML Ekleyin - Tema Düzenlemeye Gerek Yok

Tek ürün, tek medya, sıfır tema düzenlemesi

Bazı ürünler fotoğraftan fazlasını hak eder. Bir kullanım videosu, ürünü üreten atölyenin haritası, bir ses örneği, müşterinizin sizi etiketlediği bir Instagram gönderisi. Bunların herhangi birini eklemek normalde temayı elle düzenlemek anlamına gelir — ve her tema güncellemesinden sonra aynı düzenlemeyi baştan yapmak.

Bu modül her ürüne kendi medya panelini verir; panel, arka ofiste ilgili ürünün Modüller sekmesinin içinde yer alır. Bir kaynak seçin, bağlantıyı yapıştırın, kaydedin. Medya yalnızca o ürünün sayfasında görünür, başka hiçbir yerde.

Sekiz kaynak ve yapıştırırken çalışan canlı önizleme

YouTube, Vimeo ve Dailymotion için adres çubuğundaki sıradan video bağlantısı yeterlidir. Google Haritalar için Paylaş → Harita yerleştir penceresindeki <iframe> kodunu alırsınız. Instagram herkese açık bir gönderinin bağlantısını ister. Ses ise doğrudan bir .mp3, .ogg veya .wav bağlantısını, bir SoundCloud ya da Spotify bağlantısını veya tam bir yerleştirme kodunu kabul eder.

Bunların ötesinde Özel iFrame, <iframe> etiketi kullanan her türlü üçüncü taraf yerleştirme kodunu alır; Özel HTML ise gerçekten her şeyi kabul eder — düz metin, tablo, kendi bileşeniniz.

Önizleme siz yapıştırdıkça güncellenir, yani kaydetmeden önce sonucu olduğu gibi görürsünüz. Unutulmayı bekleyen ayrı bir 'oluştur' adımı yoktur.

Mağaza geneli değil, ürün bazlı

Her ürün farklı bir kaynak taşıyabilir veya hiçbiri olmayabilir. Bir gitara ses örneği, el yapımı bir masaya atölyenin haritası, bir bisiklete montaj videosu koyarsınız; geri kalan dört yüz ürün olduğu gibi kalır. Her üründe, medyanın görünüp görünmeyeceğini belirleyen tek bir anahtar bulunur.

Bir kez seçilen üç konum

Bloğun nerede duracağına mağaza genelinde siz karar verirsiniz: ürün görsellerinin altında, ürün sekmelerinin üstünde veya kendine ait bir 'Medya' sekmesinde.

Kararsızsanız sekme seçeneğini işaretleyin. Bu seçenek temanızın işaretlemesinde yer aramak yerine PrestaShop'un kendi yerleşik ürün sekmesi hook'unu kullanır; dolayısıyla her temada çalışır.

Varsayılan olarak duyarlı

Yerleştirmeler ekrana uyum sağlar. Modülün ürettiği her şey, sayfayla birlikte yeniden boyutlanan 16:9 duyarlı bir kutuya sarılır. Kendi yapıştırdığınız kodun da aynı davranışı göstermesi için onu <div class="embed-container"> içine alın. Stil dosyası ayrıca elle ekleyebileceğiniz kare (embed-container-square) ve uzun (embed-container-tall) yardımcı sınıflarını da içerir; 16:9 kutunun yanlış oran olduğu durumlar için — bir Instagram gönderisinde genellikle olduğu gibi.

Hiçbir tema dosyasına dokunmaz — ve asıl mesele bu

1.x sürümü, temanızın product.tpl dosyasını kopyalayıp yeniden adlandırarak çalışıyordu. Bu tür çözümler siz temanızı güncelleyene kadar ayakta kalır, sonra sessizce çalışmayı bırakır — ya da daha kötüsü, modülü kaldırdığınızda tema dosyanızın üzerine eski bir yedek yazılırdı.

2. sürüm bunların hiçbirini yapmaz. displayProductExtraContent ve displayFooterProduct hook'larına bağlanır — ikisi de standarttır — ve sekme dışındaki iki yerleşim için küçük bir konumlandırma betiği kullanır. Modülün hiçbir yerinde dosya kopyalama, yeniden adlandırma veya üzerine yazma yoktur. Özel temalar, alt temalar ve gelecekteki tema güncellemeleri bundan hiç etkilenmez.

2.0.1 sürümü, PrestaShop 9 temasındaki iki konumu düzeltti

PrestaShop 9'un varsayılan teması Hummingbird'ü kullanıyorsanız bunu açıkça söylemekte fayda var.

Konumlandırma betiği yalnızca Classic temasının seçicilerini tanıyordu. Hummingbird'de bu seçicilerin hiçbiri bulunmadığı için 'görsellerin altında' ve 'sekmelerin üstünde' seçenekleri sessizce hiçbir şey yapmıyor, blok footer hook'unun bıraktığı yerde kalıyordu. 'Kendi sekmesi' seçeneği ise hiç seçiciye bağlı olmadığı için bu durumdan etkilenmiyordu.

2.0.1 sürümü, Classic seçicilerinin yanına Hummingbird'ün kendi seçicilerini (#product_accordion ve .product__images) ekledi; böylece her üç konum da artık iki temada da anlatıldığı gibi davranıyor.

Alt yapıda daha temiz bir yeniden yazım

2. sürüm, yıllardır yanlış olan birkaç şeyi de düzeltti:

Herhangi bir ürünü kaydetmek — hatta tamamen ilgisiz bir sekmeden bile — boş bir medya satırı oluşturuyordu. HTML karakter varlıkları çift kodlanıyor, bu da içerik saklanmadan önce modülün kendi temizleme mekanizmasını etkisiz hâle getiriyordu. Veritabanı şeması her medya türü için ayrı bir sütun tutuyordu; yükseltme bunları dört sütuna (active, media_type, media_input, media_html) sıkıştırıyor ve verileri otomatik olarak taşıyor.

Modül ayrıca kendi Bootstrap, jQuery ve URI.js kopyalarını paketlemeyi bıraktı — PrestaShop 1.7+ arka ofisi bunları zaten sağlıyor ve kopyalarını göndermek yalnızca çakışma davetiydi.

Getty Images, Getty ücretsiz yerleştirme bileşenini kaldırdığı için adlandırılmış bir kaynak olmaktan çıkarıldı. Mevcut Getty kayıtları Özel iFrame'e taşınıyor; zaten en baştan beri özünde bu oldukları için.

Uyumluluk

PrestaShop 1.7 ile 9 arası, PHP 7.1 ve üzeri, sekiz dilde: Hollandaca, İngilizce, Fransızca, Almanca, İtalyanca, Lehçe, İspanyolca ve Türkçe. Türkçe arayüz dâhil olduğu için arka ofis panelini kendi dilinizde kullanırsınız.

Override yok, tema değişikliği yok. Beş standart hook ve küçük bir veritabanı tablosu. Hâlâ PrestaShop 1.5 veya 1.6 mı kullanıyorsunuz? Bu durumda modülün 1.3.x sürümünü tercih edin — 2.0 ve sonrası yalnızca 1.7+ içindir.

Sık sorulan sorular

Her ürün farklı bir içerik gösterebilir mi?

Evet — tasarımın tamamı bunun üzerine kurulu. Her ürünün, o ürünün Modüller sekmesi altında kendi medya paneli, kendi kaynağı, kendi bağlantısı ve kendi aç/kapa anahtarı vardır. Hiç dokunmadığınız ürünler hiçbir şey göstermez.

Medya tam olarak nerede görünür?

Mağaza genelinde nerede seçtiyseniz orada: ürün görsellerinin altında, ürün sekmelerinin üstünde veya kendine ait bir Medya sekmesinde. Kararsızsanız Medya sekmesini seçin — yerleşik bir PrestaShop hook'u kullandığı için, yoğun şekilde özelleştirilmiş olanlar dâhil her temada çalışır.

PrestaShop 9'da Hummingbird kullanıyorum ve blok yerinden kımıldamıyor.

2.0.1 sürümüne güncelleyin. O sürümden önce konumlandırma betiği yalnızca Classic'in seçicilerini biliyordu, bu yüzden Hummingbird'de sekme dışındaki iki konum hiçbir şey yapmıyordu. 2.0.1 Hummingbird'ün seçicilerini ekledi ve artık her üç konum da çalışıyor.

Google Haritalar için ne yapıştırmalıyım?

Google Haritalar'ın Paylaş → Harita yerleştir penceresindeki tam <iframe> yerleştirme kodunu; düz paylaşım bağlantısını değil. Çıplak bir adres yerleştirilemez.

Yapıştırdığım iframe önizlemede boş bir kutu olarak görünüyor.

Bazı siteler kendi X-Frame-Options veya CSP başlıklarını kullanarak başka bir sayfanın iframe'i içinde görüntülenmeyi reddeder. Buna bu modül değil, yerleştirmeye çalıştığınız site karar verir. Bunun yerine Özel HTML'i deneyin ya da varsa doğrudan bir bağlantı kullanın.

jQuery veya Bootstrap gerektiriyor mu?

Artık ikisini de paketlemiyor. 1.x sürümü kendi Bootstrap, jQuery ve URI.js kopyalarını gönderiyordu; PrestaShop 1.7+ arka ofisin ihtiyaç duyduğunu zaten sağladığı için bunlar kaldırıldı.

Tema güncellemesinden sonra çalışmaya devam eder mi?

Evet. Modül tamamen standart PrestaShop hook'ları üzerinden çalışır ve hiçbir tema dosyasını kopyalamaz, yeniden adlandırmaz veya üzerine yazmaz. 1.x sürümü product.tpl dosyanızı kopyalıyordu; 2. sürümün kaldırdığı davranış tam olarak budur.

Instagram gönderim görünmüyor.

Gönderinin herkese açık olduğundan emin olun. Görüntülemeyi Instagram'ın kendi yerleştirme kodu yapar; bu nedenle üçüncü taraf betikleri engelleyen bir eklenti kullanan ziyaretçi gönderiyi göremez.

1.3.x sürümünden yükseltirken mevcut medyalarıma ne olur?

Otomatik olarak taşınır — hiçbir işlem yapmanız gerekmez. Tek değişiklik Getty Images'tır: Getty, dayandığı ücretsiz yerleştirme bileşenini kaldırdığı için bu kayıtlar Özel iFrame'e dönüşür.