Conteúdo deste artigo

COMPARTILHE

Conteúdo deste artigo

Acelerando o carregamento do site no WooCommerce

Atualmente a velocidade representa dinheiro para um site de e-commerce. Quanto maior for a velocidade do site para carregar, mais gratificante será a experiência de compra. Uma experiência bem sucedida do cliente representa uma melhora no SEO, maior ROI e clientes com maior satisfação. Em resumo, isto conduz a mais receita e consequentemente em lucros.

Os consumidores online atualmente trazem enormes expectativas, seja de imagens e vídeos de alta resolução até chat em tempo real, opinião dos usuários, inventário em tempo real e experiências personalizadas.  

Porém, se estes métodos dinâmicos não tiverem a sua execução feita de maneira correta eles são capazes de transformar o seu site de e-commerce mais lento, e por consequência levar a um desinteresse do cliente em função da sua pouca capacidade de atenção.

Na atualidade o WooCommerce é a plataforma de E-Commerce mais popular e grátis, operando em mais de 5 milhões de sites. Ela foi baixada mais de 252 milhões de vezes, e como já foi dito não existe cobrança de nenhuma porcentagem da receita da sua loja virtual.

Vamos falar de uma dica muito boa para acelerar o carregamento da loja WooCommerce, ou mesmo do site que também utiliza o plugin WooCommerce. A cada dia que passa mais usuários estão mudando de métodos específicos, como PrestaShop ou Magento para WooCommerce. Este é o formidável plugin para produzir lojas online com base no WordPress.

Confira a velocidade do seu site WordPress

Se você acessar o seu site neste momento e ele abrir em menos de 2 segundos não é garantido que ele esteja perfeito. Longe disso, diferentes pessoas fazem uma visita pela primeira vez e esta experiência pode acontecer de ser totalmente diferente em função do cache. Existem várias ferramentas para poder testar a velocidade de sites, isto inclusive já deve ser do seu conhecimento, vamos a alguns:

  • Google PageSpeed Insights 
  • Pingdom
  • GTmetrix

Você tem condições de utilizar todas estas ferramentas, ou apenas usar uma extensão do Chrome que faz o cálculo do tempo (em segundos) de abertura do site. Sem dúvida que você encontra-se usando a sua internet e possivelmente já tem o cache armazenado.E para solucionar esta situação faça abertura de uma janela anônima. 


Qual o motivo da lentidão do seu site

A utilização seja de qualquer ferramenta que foi citada acima com exceção do plugin elas vão indicar várias dicas de melhoria. Porém é necessário um atendimento de todos os termos técnicos usados. Afinal é essencial você compreender o que está deixando o seu site lento. 

Alguns dos motivos mais habituais:

  • Aplicativos: Apache, Nginx e MySQL entre outros necessitam estar otimizados.
  • Configurações do WordPress: As configurações do seu site são capazes de prejudicar o servidor e ainda proporcionar a lentidão do seu site.
  • Provedor de hospedagem: O servidor não está configurado de modo correto prejudicando o seu site.
  • Plugins: O número de plugins e a qualidade instalada são capazes de prejudicar a velocidade.
  • Scripts externos: O carregamento de fontes, api’s e outros também conseguem atrapalhar o carregamento.

 

É fundamental ter uma boa hospedagem WordPress

Recente ou não a hospedagem tem uma enorme importância na performance do seu site. A hospedagem WordPress é desenvolvida para proporcionar a sua loja ou blog mais rápida e segura.

Para agilizar o carregamento da loja WooCommerce

O SEO é fundamental para conseguir usuários para loja online, no entanto se eles não fizerem as compras mais tarde e em função da loja procurar e demorar um tempo para mostrar os produtos vai transmitir uma imagem ruim e vai afetar de forma negativa as vendas.

Por consequência é fundamental, praticamente vital, assegurar o carregamento rápido da loja online. Além de recomendar a aceleração do WordPress precisamos utilizar de medidas próprias para a loja que seria o WooCommerce.

Existem alguns recursos que sobram no WooCommerce que são os scripts e os estilos. Por isso é fundamental ofertar uma experiência simples e profissional do comércio eletrônico. No entanto, se não tiver controle corre o risco de ter uma redução enorme na velocidade da Web em função da quantidade utilizada.

Seguramente, providenciar uma ação para melhorar o carregamento da loja com o WooCommerce é melhorar o carregamento de scripts e estilos.


Leve em consideração antes de começar o processo para acelerar o carregamento da loja WooCommerce 

  • Existe algum item no seu site que necessite de scripts do WooCommerce fora as páginas do WooCommerce como: carrinho, loja, pagamento e outros? Ou melhor dizendo um link para o carrinho no cabeçalho ou widgets da barra lateral distribuídos pela Web.
  • Existe um espaço para teste? Como não é apropriado fazer testes ao vivo em sua loja, é recomendado utilizar uma loja teste primeiramente.
  • É preciso que você não tenha medo de editar os arquivos de um código tema.
  • Se você estiver consciente sobre estas alegações, vamos iniciar avaliando os scripts que temos condições de retirar de áreas do seu site que não são de exclusividade do WooCommerce.

Quais os scripts do WooCommerce que podemos retirar?

Inicie o seu site WordPress com o WooCommerce instalado e funcionando.Na sequência verifique no código fonte e você vai observar que existem vários arquivos JavaScript e CSS específicos do WooCommerce.

Normalmente são estes os scripts e estilos mais comuns da loja WooCommerce digital: 

Os scripts

  • checkout.js
  • woocommerce.min.js
  • jquery.cookie.min.js
  • cart-fragments.min.js
  • add-to-cart.min.js
  • jquery.placeholder.min.js
  • jquery.blockUI.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, conforme for sua instalação.

Como você pode notar, esta relação precisa ser levada a sério. Seja quais forem estes scripts e estilos ampliam o tempo de carregamento do seu site. Por isso não é necessário falar que um site lento representa vender menos e obter menor renda.

O código que irá otimizar os scripts do seu WooCommerce

Para que seja retirado o peso de todos os scripts do WooCommerce em páginas que não pertençam ao WooCommerce você precisa utilizar a função: wp_dequeue_style. O código que vem a seguir precisa ser inserido no final do arquivo functions.php da matéria ativa na sua loja WooCommerce sem ser preciso ter um plugin.

No entanto, você não terá a necessidade de todo este script imenso. Não esqueça que eu disse para fazer pesquisa no código-fonte quais são os scripts estão se destacando sem estar no WooCommerce? Pois bem, são somente eles que você necessita adicionar.

Em primeiro lugar confira isto para retirar as três folhas de estilo principais utilizando um filtro simples no arquivo functions.php

add_filter( ‘woocommerce_enqueue_styles’, ‘__return_empty_array’ );

 

É capaz de você necessitar somente disso 

No entanto, o código que vem a seguir apresenta um pouco mais de controle.

function grd_woocommerce_script_cleaner() {

remove_action( ‘wp_head’, array( $GLOBALS[‘woocommerce’], ‘generator’ ) );

// 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 );

Existe mais um que assegura fazer uma limpeza de tudo de uma vez, ao contrário de utilizar 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 );

Após utilizar o código de sua preferência confira o código-fonte das tuas páginas que não são do WooCommerce .

Verifique se acelerou mesmo o carregamento da loja WooCommerce. 

É bom que você veja que todos os estilos, scripts e meta tags do WooCommerce são capazes de ter desaparecido e com isso ser mais rápido.  Em determinados testes houve a comprovação de uma redução de tempo de carregamento entre 2 a 3 segundos. No entanto tudo isto vai depender de diversos fatores do servidor como: configurações, versões de softwares entre outros. 

Da mesma maneira, é essencial observar as condições que o código utiliza:! is_woocommerce () &&! is_cart () &&! is_checkout ().
Se você tem a necessidade de carregar scripts WooCommerce em seu site fora das páginas de pagamento e loja será capaz de fazê-lo de maneira fácil esse script para adaptá-lo a esta situação específica. Vamos a um exemplo: se você quer carregar os scripts do WooCommerce na capa do seu site, inclua a condição.

Para ir além com sua performance, entre em contato com a gente. Temos o que sua empresa precisa para crescer e alcançar ainda mais clientes.


Somos especialistas em construir E-COMMERCES QUE VENDEM com tecnologia e criatividade.

Ficou alguma dúvida entre em contato estamos a disposição

 

APRENDA COM NOSSO CONTEÚDO

Leia também esses artigos