Son birkaç yılda, insanların internette gezinme biçiminde büyük bir değişiklik gördük. Güçlü akıllı telefonların ve tabletlerin ortaya çıkmasıyla birlikte, insanlar artık internete erişmek için bu cihazları her zamankinden daha fazla kullanıyor. Bu, artık sitelerinin mobil cihazlar için optimize edildiğinden emin olması gereken web sitesi sahipleri için yepyeni zorluklara yol açtı.
Bunu yapmanın en popüler yollarından biri, sitenizin düzenini görüntülendiği cihazın ekran boyutuna uyacak şekilde otomatik olarak ayarlayan duyarlı bir tasarım kullanmaktır. Ancak bu, mobil kullanıcılar için gerçekten optimum bir deneyim sağlamak için her zaman yeterli değildir.
Progresif Web Uygulamalarının (PWA’lar) devreye girdiği yer burasıdır. PWA’lar, herhangi bir cihazda sorunsuz bir kullanıcı deneyimi sağlamak için hem web hem de yerel uygulamaların en iyilerini birleştiren yeni bir uygulama türüdür. PWA’lar HTML, CSS ve JavaScript gibi web teknolojileri kullanılarak oluşturulur, ancak yerel uygulamaların çevrimdışı destek ve anlık bildirimler gibi bazı temel özelliklerini de içerir.
WooCommerce PWA eklentisi, WooCommerce mağazanız için PWA’ları kullanmaya başlamanın harika bir yoludur. Çevrimdışı önbelleğe almayı yöneten bir hizmet çalışanı ve uygulamanızın bir cihaza yüklendiğinde nasıl davranması gerektiğini tanımlayan bir bildirim dosyası dahil olmak üzere WooCommerce mağazanızı bir PWA’ya dönüştürmek için gerekli tüm özellikleri içerir.
WordPress için kullanılabilen birçok başka PWA eklentisi vardır, ancak WooCommerce PWA eklentisi şu anda mevcut olan en kapsamlı ve kullanıcı dostu seçeneklerden biridir. Bu yazıda, WooCommerce mağazanızı Progresif bir Web Uygulamasına dönüştürmek için WooCommerce PWA eklentisini nasıl kullanacağınızı göstereceğiz.
Yapmanız gereken ilk şey, WooCommerce PWA eklentisini yüklemek ve etkinleştirmektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına ilişkin adım adım kılavuzumuza bakın.
Eklenti etkinleştirildikten sonra, ayarlarını yapılandırmak için Ayarlar »PWA sayfasını ziyaret etmeniz gerekir. Bu sayfada, PWA’nızın yalnızca masaüstü veya mobil cihazlar için etkinleştirilmesini isteyip istemediğinizi belirtebilirsiniz. Her iki cihaz için de etkinleştirirseniz, kullanıcılar PWA’nızı masaüstüne ve mobil cihazlarına yükleyebilir.
Uygulamanızın otomatik olarak yüklenmesini isteyip istemediğinizi de belirtebilirsiniz. Otomatik yüklemeyi etkinleştirirseniz kullanıcılardan, desteklenen cihazlarında sitenizi ziyaret ettikleri anda uygulamanızı yüklemeleri istenir. Otomatik yüklemeyi devre dışı bırakırsanız, kullanıcıların uygulamanızı tarayıcı menülerinden ana ekranlarına manuel olarak eklemeleri gerekir.
Ardından, sayfanın en altına inmeniz ve ayarlarınızı kaydetmek için Değişiklikleri Kaydet düğmesine tıklamanız gerekir.
Artık PWA’nız için temel ayarları yapılandırdığınıza göre, kullanıcıların çevrimdışıyken gerçekten kullanabilmeleri için içerik eklemeye başlamanın zamanı geldi. Yapmanız gereken ilk şey, bir çevrimdışı sayfa şablonu oluşturmaktır. Bu, kullanıcılar çevrimdışıyken sitenize erişmeye çalıştıklarında varsayılan sayfa şablonu olarak kullanılacaktır.
Bir çevrimdışı sayfa şablonu oluşturmak için temanızın dizininde offline-page.php adında yeni bir dosya oluşturmanız ve aşağıdaki kodu eklemeniz yeterlidir:
Nasıl Kullanılır – WooCommerce için PWA?
Aşamalı Web Uygulamaları (PWA’lar), hem web hem de yerel uygulamaların en iyilerini birleştiren yeni bir uygulama türüdür.
Kullanmak için – WooCommerce için PWA:
1)WooCommerce PWA eklentisini yükleyin ve etkinleştirin
2)Ayarları ziyaret edin » 3)PWA sayfası 4)ayarlarını yapılandırmak için 5)Değişiklikleri Kaydet düğmesine tıklayın
6)Çevrimdışı bir sayfa şablonu oluşturun 7)Kullanıcıların çevrimdışıyken gerçekten kullanabilmeleri için içerik ekleyin