WP Rocket ve Botiga ile WooCommerce nasıl hızlandırılır
Wooocommerce’i hızlandırarak ve hızlı yükleme dükkanları yaparak savaşmak mı? Hızlı bir mağazaya sahip olmak çok önemlidir, çünkü mağaza açık süreniz alıcınızın deneyimini, SEO sıralamasını ve hatta mağaza dönüşüm seviyenizi etkileyecektir. Ancak aynı zamanda, WooCommerce Shop’un optimize edilmesi, normal WordPress sitesinden daha zordur, bu da dükkanınızın açık zamanında hayal kırıklığına uğratabilir. Birkaç neden var, ancak en büyüğü WooCommerce Store’un sıradan WordPress sitelerinden çok daha yoğun bir veritabanı olması ve tüm mağaza sayfalarınızı önbelleğe alamayacağınızdır.
Ancak bu, daha hızlı bir mağaza yapma seçeneğiniz olmadığı anlamına gelmez. Doğru araçlarla, özel teknik bilgiye ihtiyaç duymadan mağazanızı hızlandırabilirsiniz. Bu öğreticide, WOCommerce Hız Optimizasyonu’nu bildiğim en basit şekilde getireceğim: WP roket eklentisi ve diğer birkaç araç ve ince ayar ile. Yol boyunca, her bir ayarın zaman yükleme süresini nasıl etkilediğini görebilmeniz için gerçek performans testi verilerini paylaşacağım. Sonunda, daha hızlı yüklenen bir mağazanız olacak – ve her şeyi hazırlamak için bir bilgisayar bilgisine ihtiyacınız yok.
Kulağa hoş geliyor mu? Wooocommerce’i birlikte hızlandıralım. Bir sonraki bölümde WP roketinden önce iki temel WooCommerce Hız Taktikleri, Woocommerce’i hızlandırmak ve daha hızlı yüklenen bir dükkan almak için WP roketini nasıl kullanabileceğinizi anlatacağım. Ancak, hızlı yükleme WooCommerce mağazası istiyorsanız, yine de güçlü bir performans temeline sahip olmanız gerekir. Değilse, WP roketini domuzlara ruj uygulamak gibi kullanmak. Temel olarak, WP Rocket mağazanızı daha hızlı hale getirecektir. Ancak vakfınız başlamak için çok yavaşsa, yine de yavaş bir dükkanınız olacak. Sadece biraz … “çok yavaş değil”. Peki – WooCommerce’in performansı için güçlü bir temel nedir? Bu iki ayrıntıyı kullanmanız gerekir: 1. Daha hızlı WooCommerce Tema Temasını seçin, mağazanız ne kadar hızlı yüklendiğinde büyük bir rol oynayacaktır. Büyük ve şişmiş temalar, sitenizi yavaşlatacak daha fazla kaynak içerecektir. Öte yandan, hızlı WooCommerce teması tam tersini yapacak: sadece çekici ve samimi bir mağaza yapmak için gereken minimum değeri içerecektir. En hızlı WooCommerce temasını bulmak için birçok seçeneği test ettiğimiz özel bir yazımız var. Ancak, zaman kazanmak istiyorsanız, ücretsiz Botiga temamızı kullanabilirsiniz:
Aşağıdan yukarıya, Botiga performans için inşa edildi. Yalnızca vanilya javascript (jQuery bağımlılıkları yok) kullanır, kodu otomatik olarak küçültür ve kutunun dışında 44.3 kb’nin altında. Dahası, tüm demo siteleri orijinal blok düzenleyiciyle yapılır, bu da sitenizi sadece bir demo gibi görünmesi için bir eklenti üreticisi sayfasına yüklemenize gerek yoktur. Aynı zamanda, Botiga aşağıdakiler dahil olmak üzere birçok yararlı e -ticaret özelliği sunar: bazı ödeme sayfaları ve sepetler
Şık ürün önerileri
Ürün varyasyonlarına örnekler
Bazı ürün galerisi düzeni
istek listesi
Yapışkan eklenti çubuğu
Botiga, Full Function’ın ücretsiz bir sürümüne ve daha fazla özellik ekleyen Pro 69 Sürümü’ne sahiptir.
Bu nedenle, mağazamızı hızlandırmak için Botiga’yı örnek olarak kullanacağız. Botiga’yı buradan indirebilir veya bazı örnekleri görmek için demoyu izleyebilirsiniz. 2. WooCommerce Barındırma Optimize Edilmiş Performans kullanın Hızlı temalar kullanmanın yanı sıra, WordPress’i barındıran optimize edilmiş performansı da seçmek istersiniz. Her ne kadar en ucuz barındırmayı seçmek cazip olsa da, ucuz barındırmanın genellikle wooCommerce ile başa çıkacak bir kaynağı yoktur, bu da ne yaparsanız yapın yükleme süresine ve durgun performansa neden olacaktır. Burada bir kez daha, en hızlı WordPress barındırmasını bulmak için bir grup barındırma sağlayıcısını test ettiğimiz bir makalemiz var. Eğer acele ediyorsanız, dikkate alınması gereken bazı iyi seçenekler:
Kinsta – Kinsta tam incelememizi okuyun
WP Motoru – Özellikle Elasticsearch (mağaza ürününüzün performansını büyük ölçüde artıracak) Cloudways içeren özel bir e -ticaret barındırma paketi öneriyorum – Cloudways incelememi okuyun
Woocommerce nasıl WP roket ile hızlandırılır şimdi, güçlendiriciyi bağlamak ve WooCommerce yükünü daha hızlı hale getirmek için WP roketini kullanmanın zamanı geldi. Mağazamız için sağlam bir barındırma ve hızlı bir Botiga teması kullandığımız için kendini oldukça hızlı bir şekilde yükledi. Aşağıda, verandada nereye başladığımızı gösteren WebPagetest Performansının metrik ekran çekimi:
Ancak, WP roketiyle, yine de daha hızlı yükleyebiliriz. Birçok harika WordPress performans optimizasyon eklentisi var, neden Woocommerce için WP Rocket’i öneriyorum? Neden sevdiğimi öğrenmek için Rocket WP’mle ilgili tam incelememi okuyabilirsiniz, ancak bu yüksek noktaların kısa bir özeti:
Alışılmadık WooCommerce uyumluluğu vardır. WP Rocket WooCommerce kullandığınızı görürse, WP Rocket önbellekleme gibi temel bilgiler açısından otomatik olarak kendisini en iyi şekilde yapılandırır. Bu büyük bir avantajdır, çünkü WooCommerce mağazasında doğru olmayan önbellek yapılandırması ana işlevselliğe zarar verebilir. Bunun kullanımı çok kolay. Yukarıdaki noktalara ek olarak, WP Roket genellikle basit bir arayüze, ayrıntılı belgelere ve premium desteğe sahiptir. Sitenizi çok daha hızlı hale getirir. Sonunda en iyisini koruyorum. WP roket iyi işlev görür ve bu, WooCommerce mağazasını daha hızlı (ve diğer WordPress siteleri) daha hızlı hale getirmek için iyi çalışır. Ayrıca, kullanılmayan CSS’yi kaldırma ve JavaScript.wp roketinin yürütülmesini geciktirme gibi benzersiz özelliklere sahiptir. Sayfa açma süresi ile dönüşüm oranı arasında doğrudan bir ilişki vardır, böylece mağazanızı hızlandırmak için paranızı dönüşüm oranındaki bir artış şeklinde kolayca geri alabilir.
Başlamak için WP Rocket’in bir kopyasını satın aldığınızdan emin olun. Sonra, WooCommerce için nasıl ayarlanır. 1. Başlangıç optimizasyonunu etkinleştirmek için eklentiyi yükleyin, Woocommerce mağazanızı açın (veya yoksa önce ayarlayın) ve WP roketini yükleyin ve etkinleştirin:
WP roket eklentisini etkinleştirir etkinleştirmez, mağazanızı hızlandırmak için aşağıdaki özellikleri otomatik olarak etkinleştirecektir:
Önbellek sayfası – WP Rocket, mümkün olduğunca çok içerik tutarken sorunlardan kaçınmak için Woocommerce’in ana içeriğini otomatik olarak hariç tutacaktır. Örneğin, diğer uyumluluk ayarlarının yanı sıra sepet sayfalarınızı ve kontrollerinizi hariç tutacaktır.
Önbellek tarayıcısı
GZIP Sıkıştırma Web yazı tipleri için çapraz orijin desteği
Google yazı tipi dosyalarını optimize etmek
WooCommerce mağazasında WP Rocket ayrıca AJAX GET_REFRESHED_FRAGENTS isteğini otomatik olarak optimize edecektir. WooCommerce, dinamik alışveriş sepeti içeriğini güncellemek için kullanıyor.
Bir kez daha, tüm bu optimizasyon otomatik olarak gerçekleşir, bu nedenle mağazanız WP roketini etkinleştirir etkinleştirmez daha hızlı yüklenmelidir. İşte WP roketinde tek bir ortama dokunmadan mağazamızın şimdi yüklenmesi: İlk baytın zamanının yaklaşık 450 MD (0.509’dan 0.043 saniyeye) azaltıldığını görebilirsiniz, bu da neredeyse benzer bir azalmaya yol açar. Boya En Büyük İçerik (LCP) dahil olmak üzere diğer tüm metrikler. İçerik içeriğinin en büyük içeriği ~ 1.1 saniyeden ~ 0.7 saniyeye düşer. Bu azaltma esas olarak WP Rocket tarafından uygulanan WooCommerce dostu önbellekleme sayfalarının sonucudur, ancak diğer ince ayarlar da yardımcı olur.
2. Dosya Optimizasyonunu Ayarla WP Rocket birçok yararlı özelliği etkinleştirmesine rağmen, manuel olarak etkinleştirmeniz gereken bazı önemli özellikler de vardır. Başlamak için WP Roket Ayarları alanındaki Dosya Optimizasyonu sekmesini açın (Ayarlar → WP Roket). Mağazanızın performansında büyük bir fark yaratabilecek mağaza CSS ve JavaScript kodunuzu optimize edebileceğiniz yer burasıdır (özellikle temel web hayati ve deniz feneri performans puanları açısından).
İşte önerdiğim ayarlar: CSS dosyası:
CSS Dosyaları – Botiga temaları kodu varsayılan olarak azaltmıştır, ancak bu, kullandığınız eklentiden kodu küçültmeye yardımcı olabilir.
CSS Teslimatı → Kullanılmayan CSS’yi silin – Bu, her bir sayfanın dosya boyutunu küçültmek için sayfaya göre gereksiz CSS’yi sayfaya göre silecektir. CSS dosyalarını birleştirmenizi tavsiye etmiyorum, çünkü bu şimdi çok yararlı değil çünkü çoğu kaliteli ana bilgisayar HTTP/2 kullanıyor.
JavaScript Dosyası:
JavaScript dosyalarını en aza indir
Yükleniyor JS Tangguhkuhantunda JavaScript Yürütme
CSS gibi, JavaScript dosyalarını birleştirmenizi önermiyorum. Mağazanızın işlevini sağlamak için, JavaScript yürütme gecikme ayarlarına bazı istisnalar eklemek isteyebilirsiniz. Bu temel olarak, kullanıcı sitenizle etkileşime girene kadar tüm JavaScript’in yüklenmesini geciktirir (örneğin tıklayın veya kaydırma). Bu, en büyük içerik boya sürenizi artırmak için iyidir, ancak komut dosyalarını izleme (örneğin Google Analytics veya Google etiket yöneticisi) veya kullanabileceğiniz birkaç eklenti gibi hemen yüklemek istediğiniz bazı JavaScript’iniz olabilir. WP Rocket, tüm olası istisnaların ayrıntılı bir sayfasını yönetir, böylece kendinizi dışlamak için senaryoyu bulmanıza gerek yoktur. Sadece bu WP Roket Yardım Makalesinden kopyalayıp hariç tutulan JavaScript dosyasına ekleyebilirsiniz. Örneğin, Google Analytics’i hariç tutmak istiyorsanız, bunu şöyle yapılandıracaksınız:
Bu ayar yaptıktan sonra daha fazla iyileştirme görebilirsiniz. Ana sayfamızın boyutu yaklaşık 80 KB azalır ve en büyük boya içeriği süresi ~ 0.7 saniyeden ~ 0.5 saniyeden daha fazla düşer.
4. İçerik Dağıtım Ağını (Global Mağazalar için) Ekle İçerik Dağıtım Ağı (CDN), Global Server Network’teki resimler ve komut dosyaları gibi statik varlıkları depolayarak mağaza açık zamanınızı hızlandırmanızı sağlar. Daha sonra, ziyaretçiler statik dosyayı fiziksel olarak en yakın olan sunucudan indirebilir, bu da indirme süresini azaltır ve mağazanızı hızlandırır. Mağazanız sadece belirli coğrafi alanlardaki alıcıları hedefliyorsa, örneğin Birleşik Krallık’ta, CDN’den pek çok fayda göremeyebilirsiniz. Ancak, örneğin Büyük Britanya ve Amerika Birleşik Devletleri’nde dünyanın dört bir yanındaki alıcıları hedefliyorsanız, CDN WooCommerce’ı hızlandırmak için bir başka iyi seçimdir. CDN bölümünde, WP Rocket size mağazanıza CDN eklemek için iki seçenek sunar: Resmi RocketCDN hizmetini sınırsız bant genişliği için ayda sadece 7,99 $ maliyetle kullanabilirsiniz. Bu, Global StackPath ağına dayanmaktadır. Bu en basit seçenektir çünkü otomatik bir yapılandırma sunar.
WP Rocket’in URL’nizi yeniden yazmasını isteyerek herhangi bir üçüncü taraf CDN ile entegre olabilirsiniz. Popüler seçenekler StackPath, Keycdn, Bunny CDN, Cloudfront ve diğerleridir.
Kendi CDN’nizi hazırlayarak kendinden emin değilseniz, RocketCDN hizmetini kullanmanızı öneririm, çünkü oldukça iyi bir değer sunar, çünkü sabit bir fiyata sınırsız bant genişliği elde edersiniz:
Woocommerce’de WP roketiyle ilgili sorunları çözmek, yukarıdaki talimatları takip etmek, sorunsuz daha hızlı bir WooCommerce mağazasına yol açsa da, küçük sorunlar yaşayabileceğiniz bazı nadir senaryolar vardır. En yaygın örnek, kullanıcı arzusu listesi, yeni görülen öğeler veya özel konum içeriği (örneğin farklı ülkeler için farklı fiyatlar) gibi çeşitli dinamik içerik türleri ile ilgili bir sorundur. Örneğin, kullanıcılar arzu listesine ekledikleri ürünleri ziyaret ederse, ürün sayfasında görüntülemek isteyebilirsiniz. Ancak bazı durumlarda, önbellekleme burada eğimli davranışlara neden olabilir. Peki – nasıl düzeltebilirsin? Birkaç ipucundan geçelim. İlk olarak, önbellekle uyumlu bir şekilde kodlanmış dinamik bir içerik eklentisi kullanmayı deneyin. Temel olarak, bu, eklentinin dinamik içeriğini PHP değil JavaScript veya Ajax kullanarak ürettiği anlamına gelir. Emin değilseniz, sorun yaşadığınız eklenti geliştiricisiyle iletişime geçebilirsiniz. Bazı eklentiler konjenital uyumluluk araçlarını içerir. Örneğin, Yith Woocommerce WishList eklentisi, önbellekleme ile ilgili sorunları çözecek olan Ajax’ın yüklenmesini etkinleştirmek için bir düzenlemeye sahiptir. Rocket WP ekibi ayrıca, popüler Woocommerce eklentileri için sorunlara neden olabilecek birkaç eklenti/uyumluluk aracı yaptı: WooCommerce Yith’in Arzu Listesi Eklentileri Yeni WooCommerce Orijinal Ürün Widget Görüntülendi Yeni Yith Woocommerce Ürün Eklentisi Görünümü Yukarıdaki iyileştirme bir seçenek değilse, başka bir potansiyel iyileştirme, eklenti tarafından belirlenen çerezleri hedefleyen önbellek hariç tutma kuralları eklemektir. Bu daha gelişmiş, ancak dinamik içeriği görmesi gereken kullanıcılar için önbellekten geçmenizi sağlayacaktır. Eklenti belgelerinden çerez bilgilerini bulmaya veya sizin için bulmak için bir geliştirici kiralamaya çalışabilirsiniz. Ardından, WP Roketinin Devam Ediyor: Eklenti Roket WP Roketinin yanı sıra diğer faydalı WooCommerce hızlarını optimize etmek, Woocommerce performansını optimize etmek için ihtiyacınız olan her şeyi yapabilir. Ama bir ana istisna var: resimler! Mağazanızın çok fazla ürün resmine sahip olması muhtemeldir. Dikkatli değilseniz, ürün resmi mağazanızı yavaşlatabilir (özellikle ürününüz ve mağazanızın sayfaları). Çözüm, boyutunu sıkıştırarak ve değiştirerek site görüntüsünüzü optimize etmektir. Bir görüntü optimizasyonu eklentisi kullanarak bunu otomatik olarak başarabilirsiniz. En iyi WordPress görüntü optimizasyon eklentisi hakkında tüm yayınlarımız var, ancak işte en iyi seçenekler:
Hayal edin – bu eklenti WP Rocket ile aynı geliştiriciden geliyor
Shortpixel – Bu, kendi sitemde kullandığım eklenti
WP kompres – diğer yüksek kaliteli seçenekler; WP kompres incelememizde daha fazla bilgi edinin Görüntülere ek olarak, büyük mağazalar için yararlı olan diğer araçlar çeşitli ürün arama çözümleridir. Çok fazla ürününüz varsa, ürün araması kaynaklarda çok yoğun olabilir, çünkü birçok ağır veritabanı sorgusuna neden olur. Sunucunun dışındaki arama çözümlerini Elasticsearch (ElasticPress eklentisi aracılığıyla) veya JetPack Search (aynı zamanda Elasticsearch’e dayalı, ancak uygulanması daha basit) gibi düzeltebilirsiniz. Woocommerce mağazanızı şimdi hızlandırın WooCommerce mağazanızın başarılı olmasını istiyorsanız, hızlı bir şekilde yüklemeniz önemlidir. Mağazanızı başarılı olmaya hazırlamak için önce güçlü bir temel belirlemek önemlidir: Ücretsiz Botiga teması gibi hızlı yükleme wooCommerce teması seçin.
Kinsta veya WP motoru gibi WordPress barındırma optimize edilmiş performansı kullanın.
E -ticaret sitenizin temelini hazırlayın.
WP Rocket, WooCommerce, CSS ve JavaScript optimizasyonu ve daha fazlası ile uyumlu önbellek de dahil olmak üzere bir dizi WooCommerce performans optimizasyonu uygulamanıza yardımcı olabilir. Ayrıca ürün resminizi optimize etmek için bir görüntü optimizasyon eklentisi eklerseniz, hafif ve hızlı bir WooCommerce mağazası ile hazırlanmanız gerekir. WP Rocket ve Botiga ile WooCommerce’ı nasıl hızlandıracağınızla ilgili hala sorularınız var mı? Bize yorumlarda söyleyin!
