Progressive Web App eklentisi deneysel bir özelliktir. Daha da iyileştirmek ve kararlı hale getirmek için geri bildirimlerinize ihtiyacımız var.
manifest.jsonBlogger , , serviceworker.js, vb. gibi varlıkları yükleyemediğimiz için Progressive Web Uygulamasını etkinleştirmek için yerel bir yol sunmuyor.
Temamız, Offline Page ve Push Notifications haricinde PWA için birinci sınıf destek sağlamaktadır.
Bunu blogunuz için kolaylıkla etkinleştirebilir ve yapılandırabilirsiniz.
Progressive Web Uygulaması Nedir?
Progressive Web Uygulaması (PWA), bir web tarayıcısı aracılığıyla erişilebilirken yerel uygulama benzeri bir deneyim sunan bir tür web uygulamasıdır. PWA'lar, web ve mobil uygulamaların en iyi özelliklerini bir araya getirmek, hızlı performans, çevrimdışı işlevsellik ve duyarlı bir arayüz sağlamak için tasarlanmıştır. PWA'ların temel özellikleri şunlardır:
- Yüklenebilir : Kullanıcılar bir uygulama mağazasına gitmeye gerek kalmadan ana ekranlarına bir PWA ekleyebilirler.
- Duyarlılık : PWA'lar masaüstü bilgisayarlardan akıllı telefonlara kadar farklı cihazlara ve ekran boyutlarına sorunsuz bir şekilde uyum sağlar.
- Hızlı ve Güvenilir : PWA'lar hızlı yüklenir ve yavaş veya güvenilir olmayan ağlarda bile sorunsuz performans sunar.
- Çevrimdışı Yetenek : PWA'lar, servis çalışanlarını kullanarak içeriği önbelleğe alabilir ve kullanıcıların internet bağlantısı olmadan bile uygulamaya erişmesine olanak tanır.
- Anlık Bildirimler : PWA'lar, yerel mobil uygulamalara benzer şekilde bildirimler gönderebilir.
PWA'lar, web uygulamalarının avantajlarını (kolay erişim ve güncellemeler) yerel uygulamaların işlevselliğiyle (çevrimdışı erişim, anlık bildirimler) birleştirerek kullanıcı deneyimini iyileştirmeyi amaçlamaktadır.
Daha önce de söylediğimiz gibi, Çevrimdışı Sayfa ve Anında Bildirimler özellikleri, nasıl uygulandıkları ve Blogger sınırlamaları nedeniyle temanın yerleşik eklentisini kullanarak kullanılamaz. Geçici çözüm olarak cloudflare çalışanlarını kullanarak bu özellikleri de etkinleştirebiliriz, @kumardeo/blogger-pwa github deposuna göz atın. Github deposundan öğreticiyi takip ederken temanın yerleşik eklentisini devre dışı bıraktığınızdan emin olun.
PWA eklentisini etkinleştir
Dahili PWA eklentisi, Düzen'deki Progressive Web App başlıklı LinkList widget'ı kullanılarak yapılandırılabilir (eğer adını değiştirmediyseniz) .
Simge ekle
Varsayılan olarak meta etiketleri için yapılandırılmış favicon'u kullanır .
Eklemediyseniz veya farklı bir simge kullanmak istiyorsanız, widget'ta yeni bir bağlantı oluşturun ve Site Adıicon olarak ve simge resim URL'sini Site URL olarak kullanın . Simge 1:1 oranında ve en az 512px genişliğinde olmalıdır , yani 512px*512px , 640px*640px , vb.
Açıklama ekle
Varsayılan olarak Blog Ayarları'ndaki Blog Açıklaması'nı kullanır.
Eğer eklemediyseniz veya farklı bir açıklama kullanmak istiyorsanız, widget içerisinde yeni bir link oluşturup Site Adıdescription olarak linkinizi , açıklama metnini de Site URL olarak kullanabilirsiniz .
Ekran görüntüleri ekleyin
Kurulum açılır penceresi gösterildiğinde önizlenecek ekran görüntüleri ekleyebilirsiniz. Widget aracılığıyla ekleyebileceğiniz iki tür ekran görüntüsü vardır: mobil cihazlarda görüntülenecek dar ekran görüntüleri ve masaüstü cihazlarda görüntülenecek geniş ekran görüntüleri.
Dar ekran görüntüleri
Dar ekran görüntüleri 3:4 oranında ve en az 540px genişliğinde (örneğin 540px*720px ) olmalıdır .
Dar bir ekran görüntüsü eklemek için , widget'ta yeni bir bağlantı oluşturun ve Site Adıscreenshot_narrow olarak ve ekran görüntüsü resim URL'sini Site URL olarak kullanın . Birden fazla dar ekran görüntüsü eklemenize izin verilir.
Geniş ekran görüntüleri
Geniş ekran görüntüleri 4:3 oranında ve en az 720px genişliğinde (örneğin 720px*540px ) olmalıdır .
Geniş ekran görüntüsü eklemek için , widget'ta yeni bir bağlantı oluşturun ve Site Adıscreenshot_wide olarak ve ekran görüntüsü resim URL'sini Site URL olarak kullanın . Birden fazla geniş ekran görüntüsü eklemenize izin verilir.
Kısayollar ekle
PWA'nıza bir kısayol eklemek için, widget'ta yeni bir bağlantı oluşturun ve kısayol adını Site Adı olarak ve kısayol url'sini Site URL olarak kullanın . Birden fazla kısayol eklemenize izin verilir.
Lütfen sınırlamalar nedeniyle URL'nin aynı kaynağa yönlendirilmesi gerektiğini unutmayın, bu nedenle URL'nin yalnızca mutlak yol adını ve sorgu dizesi kısmını eklemenizi öneririz, /p/iletisim.htmlyani https://ak.web.tr/p/iletisim.html.
