Como adicionar códigos de acesso no WordPress

Deseja incluir códigos de acesso em seu site? Você veio ao lugar certo. Neste guia, mostraremos como adicionar códigos de acesso no WordPress e mostraremos alguns exemplos para que você possa aproveitá-los ao máximo.

Desde que os códigos de acesso foram adicionados ao WordPress na versão 2.5, os usuários os usam para obter todos os tipos de personalização. Os códigos de acesso são muito úteis e nos permitem executar um código específico em postagens, páginas e praticamente em qualquer lugar em nossos sites. Além disso, eles são muito fáceis de usar, mesmo para os usuários mais inexperientes.

O que são códigos de acesso?

Um shortcode acionará um pedaço de código especificado pelo nome do shortcode, que é sempre colocado entre colchetes como este: [shortcode-name]

O código que cada shortcode executa depende de como o shortcode foi criado. Muitos plugins fornecem seus próprios códigos de acesso e o WordPress também inclui alguns por padrão. E a melhor parte é que a API de código de acesso do WP permite que você crie seus próprios códigos de acesso personalizados.

Os códigos de acesso são uma ótima ferramenta para desenvolvedores porque permitem que você insira qualquer script em qualquer lugar do seu site. Quando você usa o mesmo script muitas vezes, pode simplesmente usar o mesmo shortcode sem precisar repetir o código. Isso ajuda você a economizar tempo e manter seu código limpo.

Além disso, um shortcode pode receber alguns valores, que funcionam de maneira semelhante aos parâmetros das funções.

[ shortcode val1='hi' val2='ok' ]

E também pode ser usado como uma tag HTML ao abrir e fechar shortcodes como este [ shortcode ] some text [ /shortcode ] .

Em resumo, um shortcode permite que você execute um script PHP no front-end sem escrever nenhum código (se for um shortcode existente). O WordPress e alguns plugins têm alguns códigos de acesso por padrão, mas você também pode criar seus próprios códigos de acordo com suas necessidades.

Por fim, existem diferentes tipos de códigos de acesso: para inserir galerias, produtos WooCommerce, formulários, imagens e muito mais. Cada shortcode é diferente e faz coisas diferentes.

Se precisar de mais informações, dê uma olhada neste guia completo sobre códigos de acesso.

Agora que entendemos melhor o que são, vamos ver como adicionar códigos de acesso ao seu site WordPress .

Como adicionar códigos de acesso no WordPress

Antes de começarmos, é importante notar que como cada shortcode é construído de forma diferente, eles podem ter valores ou não. Esses valores são específicos para cada shortcode e passam os valores para o código para obter o resultado que desejamos.

Como mencionamos anteriormente, existem diferentes tipos de códigos de acesso, e os códigos de acesso do WooCommerce são alguns dos mais comuns. Por exemplo, o código de acesso [ woocommerce_cart ] exibirá o carrinho do WooCommerce onde quer que você o cole.

Para testá-lo, basta colar o shortcode em uma postagem ou página ou digite-o assim: [ woocommerce_cart ] . Então, dê uma olhada no frontend e você verá o carrinho de banheiro exatamente onde você inseriu o código de acesso.

NOTA : Como vamos editar alguns arquivos principais, antes de começarmos, recomendamos que você faça um backup completo do seu site e crie um tema filho. Você pode criar um programaticamente ou usando qualquer um desses plugins.

Adicione códigos de acesso do WordPress com valores

Agora vamos usar o shortcode padrão do WordPress da galeria para aprender como adicionar shortcodes com valores.

O código de acesso da galeria exibe uma galeria de imagens bonita e oferece suporte a vários valores. Você precisa incluir o valor de ID para especificar quais imagens deseja exibir na galeria. Este parâmetro pega os IDs e exibe essas imagens específicas.

Por exemplo, se quisermos exibir as imagens com os IDs 720, 729, 731 e 732, adicionamos o shortcode a uma postagem ou página da seguinte forma: [ gallery ids=”729,732,731,720” ]

Para testá-lo, basta colar o shortcode substituindo os IDs das imagens pelos seus próprios IDs. Se você não souber seus IDs de imagem, abra-os no editor da biblioteca de mídia e verá o ID no URL do navegador e o link permanente impresso nos detalhes da imagem.

Se você estiver usando o editor de texto clássico, basta colar o código de acesso no conteúdo. No Gutenberg, por outro lado, você pode usar o bloco de shortcode. Além disso, muitos construtores de páginas e temas incluem algumas outras soluções de gerenciamento de código de acesso que você pode usar.

Gutenberg

Editor clássico

Depois de adicionar o shortcode, verifique o frontend do seu site e você deverá ver algo assim:

Usando códigos de acesso em arquivos de modelo

Outra maneira de usar códigos de acesso do WordPress é adicioná-los aos arquivos de modelo. Se você deseja desenvolver uma solução personalizada, esta é uma opção interessante para você. Por exemplo, isso permite que você execute um shortcode em uma lógica condicional ou altere os valores do shortcode dinamicamente, entre muitas outras possibilidades.

Você pode usar códigos de acesso em um arquivo de modelo com a função PHP do_shortcode() . Esta é uma função padrão do WordPress que você pode usar em qualquer arquivo.

Para executar um shortcode de um arquivo, basta adicionar o seguinte:

echo do_shortcode(' [ gallery ids=”21,42,32,11” ] ');

Agora personalize o cabeçalho e execute o shortcode da galeria no arquivo header.php . Para fazer isso, você precisa substituir esse arquivo usando um tema filho. Para obter mais informações sobre como personalizar modelos, confira este guia.

Em seu painel do WordPress, adicione o shortcode ao seu cabeçalho, acessando Appearance > Theme Editor e abrindo o arquivo header.php . Vá até o final do arquivo e cole o código conforme mostrado abaixo:

Depois de incluir o script acima no arquivo, você verá a galeria no cabeçalho.

Usando códigos de acesso com ganchos do WordPress

Outra maneira de adicionar códigos de acesso ao WordPress programaticamente é usá-los em combinação com ganchos. Se você não estiver familiarizado com ganchos, recomendamos que você confira este guia para saber mais sobre eles.

Para usar um shortcode com ganchos você precisa da função do_shortcode() , assim como vimos na seção anterior.

O script a seguir funcionará no arquivo functions.php do tema filho. Usamos o gancho wp_footer() , então isso será impresso no rodapé do site.

/* Shortcode with wp_footer hook*/
add_action('wp_footer','QuadLayers_footer_shortcode');
function QuadLayers_footer_shortcode(){
echo do_shortcode(' /* Shortcode with wp_footer hook*/
add_action('wp_footer','QuadLayers_footer_shortcode');
function QuadLayers_footer_shortcode(){
echo do_shortcode(' [ products ids="623" ] ');
} ');
}

Este código de acesso vem com o WooCommerce por padrão e é usado para exibir produtos. Nesse caso, estamos usando para exibir um único produto, com ID = 623.

Para obter mais informações sobre como personalizar o rodapé em seu site, confira este guia.

Como criar códigos de acesso personalizados no WordPress

Outra alternativa interessante é criar seus próprios códigos de acesso personalizados. Isso não é difícil, mas requer algumas habilidades básicas de desenvolvedor e algum conhecimento de codificação. Se você não é um usuário avançado, não se preocupe. Mesmo os programadores mais inexperientes acharão isso muito fácil.

O WordPress nos fornece a função add_shortcode() para construir e adicionar nossos próprios códigos de acesso. Vamos ver como usar esta função para criar um shortcode personalizado com alguns scripts de exemplo.

Exibir uma mensagem diferente para usuários conectados e desconectados

O script a seguir criará um shortcode e imprimirá uma mensagem para os usuários. Para torná-lo mais interessante, aplicamos uma condição para exibir mensagens diferentes para usuários conectados e desconectados.

 /* Shortcode logado*/
add_shortcode('loggedin','QuadLayers_shortcode_loggedin');
function QuadLayers_shortcode_loggedin($atts){
    if(is_user_logged_in()==true){
        $response='você está logado';
    }
    senão{
        $response='você está desconectado';
    }
retornar $resposta;
}

Usando um if, verificamos se o usuário está logado e exibimos a mensagem “Você está logado” se for verdade e “Você está desconectado” caso contrário.

Exibir uma única postagem por ID

Outra opção é adicionar um shortcode do WordPress que exiba um post específico que vamos passar como um valor no shortcode.

 add_shortcode('get-post','QuadLayers_shortcode_post');
function QuadLayers_shortcode_post($atts) {
    $a = shortcode_atts( array('id' => '',), $atts ); 
    $args = array('post_type' => 'post','p' => $a['id']); 
    $consulta = new WP_Query($args); 
    $consulta->the_post();
    $string = '<h3>'.get_the_title().'</h3>' ; 
    $string.=the_post_thumbnail();
    $string .= get_the_content();
    retorna $cadeia;
}

Neste exemplo, adicionamos o shortcode [ get-post ] e fica assim:

Execute códigos de acesso diferentes em uma condição lógica

Neste exemplo, vamos criar um código de acesso personalizado para executar códigos de acesso diferentes em uma condição lógica.

Nosso código de acesso personalizado exibirá diferentes formulários que foram criados com um plug-in de formulário de contato. Portanto, imprimiremos um formulário diferente para usuários conectados e desconectados.

 add_shortcode('show-form','QuadLayers_custom_shortcode');
function QuadLayers_custom_shortcode(){
    if(is_user_logged_in()==true){
        $response='<h3>Fale conosco</h3>';
        $resposta.='[wpforms]';
    }
    senão{
        $response='<h3>Subscreva a nossa newsletter</h3>';
        $resposta.='[wpforms]';
    }
    echo do_shortcode($resposta);
}

Mais uma vez, usamos um if condicional para verificar se o usuário está logado ou não e exibir um determinado formulário baseado nisso.

Notas

• Sempre retorne os dados ao criar um shortcode. Se você fizer isso, poderá encontrar alguns problemas relacionados à posição em que deve exibir o conteúdo
• O do_shortcode(); A função funciona muito bem na maioria dos arquivos de modelo, mas como precisa ser ecoada, também pode desencadear alguns problemas
• Muitos plugins fornecem códigos de acesso que você pode usar livremente. No entanto, alguns códigos de acesso podem não funcionar em postagens, páginas ou ao tentar usá-los nos widgets de cabeçalho, rodapé ou barra lateral. Isso depende de quão complexo é o shortcode e como ele foi construído
• Se você vir alguns erros ao usar um código de acesso personalizado no editor Gutenberg, isso significa que seu código de acesso não é compatível com o Gutenberg. Ele funcionará de qualquer maneira no frontend e você pode tentar mudar para o editor padrão para se livrar desse erro

Conclusão

Em resumo, os shortcodes são ferramentas úteis que permitem que você execute uma parte específica do código em qualquer lugar do seu site. Ao usar o mesmo script várias vezes, você pode criar um código de acesso e usá-lo para evitar repetir o código várias vezes. Os códigos de acesso são fáceis de usar, mesmo para iniciantes, e ajudam você a economizar tempo.

Neste guia, vimos diferentes maneiras de adicionar códigos de acesso no WordPress. Aprendemos a usar códigos de acesso com valores, em arquivos de modelo e com ganchos. Além disso, vimos como criar códigos de acesso personalizados e fornecemos alguns scripts de amostra que você pode ajustar de acordo com suas necessidades.

Para saber mais sobre códigos de acesso e como personalizar seu site, confira os seguintes posts:

• Códigos de acesso do WooCommerce: o guia definitivo
• Como personalizar a página da loja WooCommerce
• Personalize a página do produto no WooCommerce

Você adicionou códigos de acesso ao seu site WordPress? Você teve algum problema ao seguir este guia? Deixe-nos saber nos comentários abaixo!