Hoje eu tenho uma dica valiosa para acelerar o carregamento da loja WooCommerce, ou do site que também trabalha com o plugin Woocommerce. Cada vez mais usuários de lojas online estão migrando de soluções específicas, como PrestaShop ou Magento para WooCommerce. Este é o fantástico plugin para criar lojas online a partir do WordPress.
Os motivos da decisão variam, mas na maioria dos casos são devidos a um dos seguintes motivos:
- Necessidade de uma solução mais completa do que apenas uma loja online.
- Melhore o SEO da loja de forma nativa graças aos benefícios inatos do WordPress.
- A facilidade de instalação e expansão do WooCommerce.
- A menor curva de aprendizado se o WordPress já estiver sendo usado como outro plugin.
Esta mudança, também pode se dar pelo menor custo de melhorias, pois existem mais de 1.000 plugins gratuitos para aprimorar os recursos do WooCommerce. Enquanto isso, para outros sistemas qualquer complemento, ou módulo pode custar dinheiro, que talvez você não possa pagar no início.
Estamos falando de como acelerar o carregamento da loja Woocommerce. Então, eu acho, que não há dúvida sobre as vantagens do SEO e de quaisquer produtos associados. Mas há outro elemento que também influencia muito o posicionamento: a velocidade de carregamento.
Isso é especialmente importante em uma loja online, onde uma loja que carrega produtos rapidamente faz a diferença em relação a outra que é lenta.
Talvez hoje em dia com as mais recentes atualizações do WordPress e do Woocommerce, não seja mais necessário remover scripts. Talvez os temas, ou o CCMS aou ainda o plugin já tenha esta ferramenta embutida.
Se você não se enquadra nesta nota acima, então está na hora de agir.
Índice
Para acelerar o carregamento da loja WooCommerce
O SEO é importante para atrair usuários para nossa loja online, mas se eles não comprarem mais tarde, porque nossa loja rastreia e leva tempo para mostrar os produtos, a imagem será ruim e afetará negativamente as vendas.
Consequentemente, é importante, quase vital, garantir o carregamento rápido da nossa loja online. E além do conselho geral para acelerar o WordPress, também devemos aplicar medidas específicas para a nossa loja, neste caso o WooCommerce.
E alguns recursos que abundam no WooCommerce são os scripts e os estilos da loja. Portanto, é importante oferecer uma experiência fácil e profissional do nosso comércio eletrônico. Mas, se não for controlado, poderá reduzir enormemente a velocidade da Web devido à quantidade usada.
Certamente, uma ação para melhorar o carregamento da loja com o WooCommerce é otimizar o carregamento de scripts e estilos.
Considere antes de iniciar ação de acelerar o carregamento da loja WooCommerce
- Você tem algum elemento no seu site que dependa de scripts do WooCommerce além das páginas do WooCommerce, como: carrinho, loja, pagamentos etc.? Quero dizer um link para o carrinho no cabeçalho ou widgets da barra lateral espalhados pela Web.
- Você tem um ambiente de teste? Como não é conveniente fazer experimentos em sua loja ao vivo, recomendo uma loja teste primeiro.
- Você não deve ter medo de editar os arquivos e o código do tema.
- Se você estiver claro sobre essas declarações, começaremos analisando os scripts que podemos remover de áreas do seu site que não são exclusivamente WooCommerce.
Quais scripts do WooCommerce podemos remover?
Abra seu site WordPress com o WooCommerce instalado e ativo. Em seguida, dê uma olhada no código-fonte e você verá vários arquivos JavaScript e CSS específicos do WooCommerce. E além disso, as meta tags e vários parâmetros relacionados ao WooCommerce.
Geralmente estes são os scripts e estilos mais comuns da loja WooCommerce online:
Os scripts
- woocommerce.min.js
- checkout.js
- add-to-cart.min.js
- jquery.cookie.min, js
- cart-fragments.min.js
- jquery.blockUI.min.js
- jquery.placeholder.min.js
Os estilos
- woocommerce.css
- Estilos de caixa de luz, como: foto bonita, caixa de fantasia e outros.
- CSS personalizado do WooCommerce
- E mais CSS adicional, dependendo da sua instalação.
Como você viu, a lista não deve ser considerada uma piada. Todos esses scripts e estilos aumentam o tempo de carregamento do seu site. E portanto, não é preciso dizer que um site lento gera menos vendas e menos renda.
O código que otimizará os scripts do seu WooCommerce
Para remover a carga de todos os scripts do WooCommerce em páginas que não sejam do WooCommerce, você deve usar a função wp_dequeue_style.
O código a seguir deve ser adicionado ao final do arquivo functions.php do tema ativo na sua loja WooCommerce, sem a necessidade de ter um plugin:
Porém, você não precisará de todo este script imenso. Lembra que eu falei para pesquisar no código-fonte, quais scripts estão aparecendo eu todas as páginas do seu site sem estar no Woocommerce? Pois é, são apenas eles que você vai precisar adicionar.
Primeiramente, veja isso para remover as três folhas de estilo principais usando um filtro simples no arquivo functions.php
add_filter( 'woocommerce_enqueue_styles', '__return_empty_array' );
Você pode precisar apenas disso!
Já o código a seguir mostra um pouco mais de controle.
function grd_woocommerce_script_cleaner() {
// Remove the generator tag
remove_action( 'wp_head', array( $GLOBALS['woocommerce'], 'generator' ) );
// Unless we're in the store, remove all the cruft!
if ( ! is_woocommerce() && ! is_cart() && ! is_checkout() ) {
wp_dequeue_style( 'woocommerce_frontend_styles' );
wp_dequeue_style( 'woocommerce-general');
wp_dequeue_style( 'woocommerce-layout' );
wp_dequeue_style( 'woocommerce-smallscreen' );
wp_dequeue_style( 'woocommerce_fancybox_styles' );
wp_dequeue_style( 'woocommerce_chosen_styles' );
wp_dequeue_style( 'woocommerce_prettyPhoto_css' );
wp_dequeue_script( 'selectWoo' );
wp_deregister_script( 'selectWoo' );
wp_dequeue_script( 'wc-add-payment-method' );
wp_dequeue_script( 'wc-lost-password' );
wp_dequeue_script( 'wc_price_slider' );
wp_dequeue_script( 'wc-single-product' );
wp_dequeue_script( 'wc-add-to-cart' );
wp_dequeue_script( 'wc-cart-fragments' );
wp_dequeue_script( 'wc-credit-card-form' );
wp_dequeue_script( 'wc-checkout' );
wp_dequeue_script( 'wc-add-to-cart-variation' );
wp_dequeue_script( 'wc-single-product' );
wp_dequeue_script( 'wc-cart' );
wp_dequeue_script( 'wc-chosen' );
wp_dequeue_script( 'woocommerce' );
wp_dequeue_script( 'prettyPhoto' );
wp_dequeue_script( 'prettyPhoto-init' );
wp_dequeue_script( 'jquery-blockui' );
wp_dequeue_script( 'jquery-placeholder' );
wp_dequeue_script( 'jquery-payment' );
wp_dequeue_script( 'fancybox' );
wp_dequeue_script( 'jqueryui' );
}
}
add_action( 'wp_enqueue_scripts', 'grd_woocommerce_script_cleaner', 99 );
Ainda tem este outro, que promete limpar tudo de uma vez, ao invés de usar qualquer outro código:
/**
* Remove all WooCommerce scripts and styles! Forever!
*/
function grd_remove_woocommerce_styles_scripts() {
remove_action( 'wp_head', array( $GLOBALS['woocommerce'], 'generator' ) );
remove_action( 'wp_enqueue_scripts', array( $GLOBALS['woocommerce'], 'frontend_scripts' ) );
}
define( 'WOOCOMMERCE_USE_CSS', false );
add_action( 'init', 'grd_remove_woocommerce_styles_scripts', 99 );
Depois de adicionar o código de sua escolha, verifique o código-fonte das suas páginas que não são do WooCommerce.
Será que acelerou mesmo o carregamento da loja WooCommerce?
Você deve ver que todos os estilos, scripts e meta tags do WooCommerce podem ter desaparecidos e tudo deve ir muito mais rápido. Em alguns testes, foi comprovado que reduz o tempo de carregamento em 2 ou 3 segundos. Mas como eu sempre digo, tudo isso depende de vários fatores do servidor, como: configurações, versões de softwares, etc.
Da mesma forma, é importante observar as condicionais que o código usa: ! is_woocommerce () &&! is_cart () &&! is_checkout (). Se você precisar carregar scripts WooCommerce em seu site fora das páginas de pagamento e loja, poderá modificar facilmente esse script para adaptá-lo a essa situação específica. Por exemplo: se você também deseja carregar os scripts do WooCommerce na capa do seu site, adicione a condição.
| Conteúdo semelhante |
Análise final
Se você usa o WooCommerce, é vital levar tempo de otimização, desempenho e carregamento. É importante aplicar regras, sobretudo, para melhorar a velocidade da instalação do WordPress como um todo. Mas se você realmente deseja vender produtos e oferecer uma boa experiência online, leve a otimização da loja a sério.
Enfim, existem muitos scripts e estilos que sobrecarregam um site. Nesse caso, uma estratégia inteligente melhorará a experiência de navegação de seus visitantes e suas vendas.