{"id":235600,"date":"2021-11-28T12:31:00","date_gmt":"2021-11-28T09:31:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=235600"},"modified":"2022-05-16T14:08:07","modified_gmt":"2022-05-16T11:08:07","slug":"como-adicionar-um-icone-de-link-externo-aos-menus-do-wordpress","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/pt-pt\/como-adicionar-um-icone-de-link-externo-aos-menus-do-wordpress\/","title":{"rendered":"Como adicionar um \u00edcone de link externo aos menus do WordPress"},"content":{"rendered":"<p>No \u00faltimo tutorial que publiquei, voc\u00ea aprendeu como <a href=\"https:\/\/themewp.inform.click\/pt-pt\/como-adicionar-um-link-externo-ao-seu-menu-wordpress\/\" title=\"adicionar um link externo ao seu menu\">adicionar um link externo ao seu menu<\/a>.<\/p>\n<p>Agora \u00e9 o seguinte &#8230;<\/p>\n<p>Links externos no menu s\u00e3o bons, mas s\u00e3o bastante incomuns. A maioria dos visitantes ficar\u00e1 surpresa ao clicar em um link de menu e sair do seu site. Eles podem at\u00e9 pensar que faz parte do mesmo site no in\u00edcio.<\/p>\n<p>Voc\u00ea precisa adicionar um indicador visual que permite que eles saibam que o link os levar\u00e1 para outro site, e a melhor maneira de fazer isso \u00e9 adicionando um \u00edcone de link externo.<\/p>\n<h2>Adicione o \u00edcone de link externo<\/h2>\n<div class=\"sds-iframe-wrapper fitvidsignore\" style=\"position:relative;padding-top:56.25%;max-width:100%;\"><iframe allowfullscreen style=\"position:absolute;top:0;left:0;width:100%;height:100%;\" src=\"\/\/www.youtube.com\/embed\/wVIPxlVYv8Y\" frameborder=\"0\"><\/iframe><\/div>\n<p><a href=\"http:\/\/link.competethemes.com\/subscribe\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Inscreva-se nos Temas do Compete no Youtube<\/a><\/p>\n<p>Existem algumas maneiras de adicionar o \u00edcone, mas mostrarei primeiro o m\u00e9todo mais simples.<\/p>\n<p>Tecnicamente, este \u00e9 o \u00edcone de &quot;seta nordeste&quot; e n\u00e3o um \u00edcone de link externo, mas mostra o ponto quando colocado ao lado de um link.<\/p>\n<p>Para adicionar o \u00edcone, comece abrindo o Customizador (Apar\u00eancia&gt; Personalizar) e navegue at\u00e9 o menu que deseja editar.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-224002-6171d6dd305c5.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-224002-6171d6dd305c5.png\" alt=\"Como adicionar um \u00edcone de link externo aos menus do WordPress\"><\/a><\/p>\n<p>Este \u00e9 o layout do post no tema <a href=\"https:\/\/www.competethemes.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Challenger<\/a>.<\/p>\n<p>No meu exemplo bobo, estou ligando para o Google \ud83d\ude1b<\/p>\n<p>Clique no item de menu ao qual deseja adicionar o \u00edcone e copie e cole este c\u00f3digo no r\u00f3tulo de navega\u00e7\u00e3o: \u2197<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-224002-6171d6df41c7f.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-224002-6171d6df41c7f.png\" alt=\"Como adicionar um \u00edcone de link externo aos menus do WordPress\"><\/a><\/p>\n<p>Certifique-se de incluir todos os caracteres, do &quot;e&quot; comercial ao ponto e v\u00edrgula<\/p>\n<p>Veja como ele ser\u00e1 exibido no menu:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-224002-6171d6e0cfe78.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-224002-6171d6e0cfe78.png\" alt=\"Como adicionar um \u00edcone de link externo aos menus do WordPress\"><\/a><\/p>\n<p>Este \u00edcone \u00e9 colorido porque est\u00e1 sendo exibido como um emoji. Como um emoji, isso tamb\u00e9m significa que ele \u00e9 exibido de maneira um pouco diferente dependendo do dispositivo com o qual seu site \u00e9 visualizado. Voc\u00ea pode ver <a href=\"https:\/\/emojipedia.org\/north-east-arrow\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">como fica em diferentes dispositivos aqui<\/a>.<\/p>\n<p>Al\u00e9m disso, observe que se voc\u00ea desativou o suporte a emoji em seu site, o \u00edcone ser\u00e1 exibido como uma seta preta sem a caixa ao redor.<\/p>\n<p>Qu\u00e3o f\u00e1cil \u00e9 isso? Basta copiar e colar alguns caracteres e pronto!<\/p>\n<p>O \u00fanico problema com essa abordagem \u00e9 que o \u00edcone n\u00e3o pode ser personalizado. Se a cor entrar em conflito com a sua marca, pode ser necess\u00e1rio tentar a pr\u00f3xima solu\u00e7\u00e3o.<\/p>\n<h2>Uma solu\u00e7\u00e3o mais personaliz\u00e1vel<\/h2>\n<p>Embora existam maneiras de adicionar \u00edcones com um pouco de CSS, prefiro n\u00e3o que voc\u00ea tente escrever e editar o c\u00f3digo.<\/p>\n<p>Em vez disso, verifique este tutorial sobre como <a href=\"https:\/\/themewp.inform.click\/pt-pt\/como-adicionar-imagens-a-itens-de-menu-no-wordpress\/\" title=\"adicionar imagens a itens de menu\">adicionar imagens a itens de menu<\/a>. Dessa forma, voc\u00ea pode encontrar qualquer imagem que desejar e adicion\u00e1-la antes ou depois do item de menu. Voc\u00ea tamb\u00e9m pode encontrar outras maneiras de utilizar o plugin apresentado nessa postagem.<\/p>\n<h2>Abra o link em uma nova guia<\/h2>\n<p>Antes de ir, h\u00e1 mais uma coisa que voc\u00ea deve fazer &#8230;<\/p>\n<p>Defina o item de menu para abrir em uma nova guia.<\/p>\n<p>O \u00edcone do link externo ajuda muito e muitos visitantes abrir\u00e3o o link em uma nova aba, mas s\u00f3 para garantir, faremos com que o link sempre abra em uma nova aba. Isso o ajudar\u00e1 a manter mais visitantes conquistados com dificuldade em seu site.<\/p>\n<p>Tornar os itens de menu abertos em uma nova guia \u00e9 realmente muito dif\u00edcil de descobrir porque a configura\u00e7\u00e3o est\u00e1 oculta por padr\u00e3o. Siga <a href=\"https:\/\/themewp.inform.click\/pt-pt\/como-fazer-links-do-wordpress-abrir-em-novas-guias\/\" title=\"este guia sobre como abrir links em novas guias\">este guia sobre como abrir links em novas guias<\/a> para ver como concluir esta etapa final.<\/p>\n<h2>Conclus\u00e3o<\/h2>\n<p>Existem muitos motivos para adicionar um link externo ao seu menu. No entanto, sem um indicador, eles podem levar a uma experi\u00eancia ruim para o usu\u00e1rio.<\/p>\n<p>Ao adicionar um \u00edcone ao item de menu, os visitantes saber\u00e3o que est\u00e3o prestes a deixar o site antes de clicarem. Al\u00e9m disso, abrir a p\u00e1gina em uma nova guia evitar\u00e1 que eles saiam acidentalmente do site.<\/p>\n<p>Se voc\u00ea tiver alguma d\u00favida ou feedback sobre este tutorial, deixe um coment\u00e1rio abaixo.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte de grava\u00e7\u00e3o:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/www.competethemes.com\" class=\"external external_icon\">www.competethemes.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>N\u00e3o confunda seus visitantes! Adicione um \u00edcone simples para rotular claramente os links externos em seu menu, seguindo este tutorial r\u00e1pido e f\u00e1cil.<\/p>\n","protected":false},"author":1,"featured_media":22094,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[553],"tags":[848],"class_list":["post-235600","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-personalizar-wordpress-2","tag-affiai-pt-pt"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/235600","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/comments?post=235600"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/235600\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/media\/22094"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/media?parent=235600"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/categories?post=235600"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/pt-pt\/wp-json\/wp\/v2\/tags?post=235600"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}