[Como] Adicionar links de login / logout para uma experiência de usuário de WooCommerce aprimorada

WooCommerce

WooCommerce é o plugin de comércio eletrônico mais popular no ecossistema WordPress. No entanto, ele tem um problema de usabilidade irritante. Por padrão, WooCommerce não mostra se um usuário está conectado ou não ao seu site de comércio eletrônico.

Conteúdo[Show]

Adicione um link de logout de login do Woocommerce ao menu do Woocommerce

Às vezes, isso pode ser confuso para seus clientes. Uma vez que a maioria das lojas de comércio eletrônico populares (como ebay ou Amazon) mostra um botão Login em seu menu, os clientes podem esperar o mesmo em suas lojas de e-commerce também.

No entanto, no caso de uma loja com tecnologia WooCommerce, o usuário precisará visitar a página 'minha conta' para criar uma conta ou verificar se ele está conectado ou não.

woocommerce minha conta - link de logout

Neste tutorial, vamos explicar como adicionar a opção Login / Logout ao menu superior do seu WooCommerce site do Network Development Group loja. Esta é uma das dicas e truques mais populares de CollectiveRay.com - fique atento se quiser aprender mais dicas e truques!

Crie um menu principal principal

Etapa 1: antes de prosseguir, certifique-se de ter adicionado um menu como menu principal do seu tema. Além disso, certifique-se de ter feito um backup completo do WordPress no caso de algo dar errado

Se você não adicionou um menu como menu principal, faça login em seu administrador do WordPress, vá para Aparência >> Menu. Em Configurações do menu, crie um menu e marque a caixa “Menu principal principal”.

menu woocommerce

Melhor dica: Se você não se sentir confortável em fazer alterações no código, considere a contratação de um desenvolvedor WordPress. Clique aqui para saber como contratar o desenvolvedor WordPress ideal: https://www.collectiveray.com/wordpress-developers-for-hire

Etapa 2: Adicione o código abaixo ao arquivo functions.php do seu tema.

add_filter ('wp_nav_menu_items', 'add_loginout_link', 10, 2);
function add_loginout_link ($ items, $ args) {
  if (is_user_logged_in () && $ args-> theme_location == 'primary') {
    $ items. = ' Sair ';
  } elseif (! is_user_logged_in () && $ args-> theme_location == 'primary') {
    $ items. = ' Conecte-se ';
  } return $ items;
}

ATUALIZAÇÃO: Acabamos de ser informados por um leitor / comentador útil do site que disse que wc_get_page_id agora deve ser usado em vez de woocommerce_get_page_id (agora obsoleto)

Se você não se sentir confortável em fazer alterações de código sozinho, pode verificar alguns desses shows Fiver altamente cotados, mas baratos.

Verifique o link de login / logout do Woocommerce

Depois de alterar o functions.php para adicionar os links de login / logout do Woocommerce, é hora de ver o resultado de suas alterações. Se você fez as alterações corretamente, verá o resultado abaixo.

links de login / logout woocommerce

Você Terminou! Agora você pode ver que a opção Login / Logout está sendo exibida no menu superior da sua loja. Este truque é especialmente útil se você configurou um negócio baseado em caixa de assinatura que detalhamos aqui.

Agora que mostramos como fazer isso para WooCommerce, talvez seja a hora de fazer a mesma coisa e criar um link de logout do WordPress. Este é frequentemente o caso se você decidiu desativar a barra de administração, mas ainda deseja a opção de sair, apenas para ficar no lado seguro.

Se você está apenas procurando uma maneira de encerrar suas sessões de login, basta visitar o seguinte em seu site.

https://<yoursite.com>/wp-login.php?action=logout 

Você receberá uma pequena tela de confirmação perguntando "Você realmente deseja fazer logout?" - assim que clicar no link, você será desconectado.

Tela de logout do WordPress

Como sempre, existem várias maneiras de fazer isso. 

O URL de logout do WordPress é algo que você pode usar em seu menu, se quiser criar um botão de logout do WordPress. Basta vincular o URL acima e, é claro, isso permitirá que seu usuário encerre qualquer sessão atual.

Menu de logout

 

Se isso não funcionar por algum motivo, você pode precisar ajustar seu functions.php para habilitar essa funcionalidade. 

add_filter ('wp_nav_menu_items', 'add_login_logout_link', 10, 2); função add_login_logout_link ($ items, $ args) {ob_start (); wp_loginout ('index.php'); $ loginoutlink = ob_get_contents (); ob_end_clean (); $ items. = ' '. $ loginoutlink. ' '; return $ items; }

 

Observação:  este método acima funciona e é ativado se você estiver usando menus personalizados do WordPress, ou seja, a função de menu disponível na seção de administração em Aparência> Menus.)

Código abreviado de logout do WordPress

Assim como com a maioria das funções, você descobrirá que também há um plug-in que pode ser usado para gerar um código de acesso de logout do WordPress. Além das várias configurações que você pode realizar, este plug-in oferece a capacidade de usar os seguintes códigos de acesso em suas postagens e páginas.

[logout] - Um link de Logout padrão, em que o usuário permanece na tela de login após ser desconectado. [logout_to_home] - Um link que desconecta o usuário e o redireciona para sua página inicial. [logout_to_current] - Um link que desconecta o usuário e o redireciona de volta para a página / URL atual.

O plugin também tem várias opções para configurar a aparência e os textos ou a experiência real do usuário.

Login WooCommerce

Desde a aquisição do WooCommerce pela Automattic, o WooCommerce tem integrado cada vez mais funcionalidades do WordPress.com no WooCommerce. Um dos grandes recursos tem sido a capacidade de fazer login em WooCommerce.com por meio de sua conta do WordPress.com

Mas essa pode não ser a situação ideal para seus clientes que normalmente teriam agora uma conta do WordPress.com, portanto, tal funcionalidade seria inútil para eles.

Então, como você pode criar um sistema de login / logout de conta com o qual eles estão familiarizados? É aqui que o Login Social WooCommerce entra em ação!

Woocommerce Social Login

O WooCommerce Social Login é uma extensão WooCommerce premium que permite logins sociais para criações de contas e checkouts integrados. Isso é ENORME. Porque você sabia que os registros de contas são uma barreira muito significativa para as vendas? 

Na verdade, de acordo com o Statista, você pode perder até 21% de seus clientes por causa desse problema do demorado processo de criação de conta antes do check-out.

Então, como você atenua esse obstáculo? É aqui que a extensão de login social WooCommerce entra em ação.

Ao instalar esta extensão em sua loja online WooCommerce, você pode permitir que os usuários façam login usando suas contas do Facebook, Twitter, Google, Amazon, LinkedIn, PayPal, Disqus, Yahoo ou VK em vez de ter que criar uma nova conta de usuário com uma nova conjunto de credenciais.

checkout de login social woocommerce

Assim, quando um cliente visita seu site pela primeira vez, com esta extensão, ele pode apenas clicar no botão de sua rede social favorita e, essencialmente, obter uma conta criada em seu site com um único clique.

Isso reduz a barreira e você também tem mais contas de usuário validadas que pode eventualmente usar para diferentes tipos de mensagens (se eles aceitarem).

 

Por que usar o login social do WooCommerce?

  • Dá a você a capacidade de sincronizar suas contas de clientes com as redes sociais mais populares
  • Torna a criação e o checkout do cliente ininterruptos, o que não requer o longo processo de criação e verificação de conta
  • Reduza o atrito, aumentando as vendas e repetindo as compras e reduzindo o abandono do carrinho
  • Os logins sociais são uma forma aceita e confiável de fazer login em sites de terceiros

Este é um prêmio que vale bem seu preço de apenas $ 79. Você vai ganhar o dinheiro de volta muitas vezes em troca.

Confira WooCommerce Social Login

 

Qualquer outra coisa que você gostaria de saber sobre o logout

Há algo que você gostaria de saber e está faltando neste artigo? Adoraríamos receber seus comentários para que possamos continuar melhorando este post!  

Baixe a lista de 101 truques do WordPress que todo blogueiro deve saber

101 truques do WordPress

Clique aqui para baixar agora
Sobre o autor
David Attard
Autor: David AttardSite: https://www.linkedin.com/in/dattard/
David tem trabalhado na ou em torno da indústria online / digital nos últimos 18 anos. Ele tem vasta experiência nas indústrias de software e web design usando WordPress, Joomla e nichos ao seu redor. Como consultor digital, seu foco é ajudar as empresas a obter uma vantagem competitiva usando uma combinação de seu website e plataformas digitais disponíveis hoje.

Mais uma coisa... Você sabia que as pessoas que compartilham coisas úteis como esta postagem também parecem FANTÁSTICAS? ;-)
. deixe um útil comente com suas ideias, depois compartilhe com seu (s) grupo (s) do Facebook, que considerariam isso útil e vamos colher os benefícios juntos. Obrigado por compartilhar e ser legal!

Divulgação: Esta página pode conter links para sites externos de produtos que amamos e recomendamos de todo o coração. Se você comprar produtos que sugerimos, podemos receber uma taxa de referência. Essas taxas não influenciam nossas recomendações e não aceitamos pagamentos por análises positivas.

Autor (es) em destaque em:  Logotipo da revista Inc   Logotipo do Sitepoint   Logotipo do CSS Tricks    logotipo do webdesignerdepot   Logotipo WPMU DEV   e muitos mais ...