Qual é a maneira correta de adicionar um favicon no Wordpress sem um plugin? [fechadas]


11

Qual é a maneira correta de adicionar um favicon no Wordpress sem um plugin ?

Acabei de colocar um arquivo chamado favicon.icocom o meu ícone na raiz do meu site?

Também preciso desse código?

<link rel="shortcut icon" href="http://example.com/favicon.ico" type="image/x-icon" />

Alguns dizem que é este código:

<link rel="icon" type="image/png" href="http://yourblog.com/favicon.png" />

E isso é para iPhones?

<link rel="apple-touch-icon" href="/customIcon.png" />

Alguma sugestão de software para criá-lo ou convertê-lo de uma miniatura? E que tipos de arquivos são suportados - apenas .ico?

Vi outro tópico com tantos métodos e não estava claro sobre as melhores práticas para esta tarefa simples: como alterar o favicon do WordPress?


6
Por que a restrição sem plug-in ?
Chip Bennett

3
A pergunta contém muitas coisas fora do tópico. Fechar votação.
Kaiser

Respostas:


15

Eu costumo colocar os ícones em uma pasta de imagens dentro do meu tema, então eu usaria

function kia_add_favicon(){ ?>
    <!-- Custom Favicons -->
    <link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri();?>/images/favicon.ico"/>
    <link rel="apple-touch-icon" href="<?php echo get_stylesheet_directory_uri(); ?>/apple-touch-icon.png">
    <?php }
add_action('wp_head','kia_add_favicon');

editado: para adicionar o ícone do toque da maçã ao comentário e esclarecer que, se você estiver usando um tema filho, mas o favicon estiver na pasta de imagem do tema pai, use

get_template_directory_url();

se você não estiver usando um tema filho, eles funcionarão

Eu costumo criar meus favoritos aqui: http://tools.dynamicdrive.com/favicon/


No caso de um tema infantil, não seria melhor usá-lo get_template_directory_uri? Em resposta à pergunta inicial, eu adicionei um Apple ícone 114x114px assim: <link rel="apple-touch-icon" href="<?php echo get_template_directory_uri(); ?>/apple-touch-icon.png">. Também há muito mais documentação sobre a adição de favicons e ícones da Apple aqui: github.com/h5bp/html5-boilerplate

1
Eu acho que o html5bp se afastou de adicioná-los no cabeçalho. se você colocar os ícones com os nomes corretos na raiz do site, a maioria dos navegadores os encontrará automaticamente. mas, para responder sua pergunta, tema filho versus pai ... na verdade, depende de onde você armazena a imagem favicon. get_template_directory_uri () obtém o URL do tema pai, enquanto stylesheet_directory_uri () obtém o URL do filho se for um filho OU o URL do pai se for o tema ativado.
29512 helgatheviking

Você está certo. Eu os misturei ... o html5bp os removeu do cabeçalho, mas ainda existe uma excelente documentação na fonte (principalmente sobre os ícones da Apple) mathiasbynens.be/notes/touch-icons

11

Na verdade, o método correto para adicionar um favicon é através de um plug-in , para que o favicon adicionado não seja dependente do tema . Essencialmente, use o método @ helgatheviking, mas coloque-o em um plug-in personalizado , em vez de no functions.phparquivo do seu tema .

Nota: se você estiver usando um domínio de nível superior, ou seja example.com, basta soltar favicon.icoa raiz do documento e pronto. Para qualquer outra coisa, crie um plug-in personalizado .

Nota 2: Consulte o Trac Ticket # 16434 . Uma opção de favicon do site está sendo adicionada ao núcleo, espero que a versão uma chegue ao lançamento da versão 3.4.


um dia desses eu preciso usar o snippet do otto. felizmente, as pessoas não estão mudando seu tema diariamente, mas concordo completamente que os favoritos (e tipos de postagens, etc.) não devem depender do tema. ansioso para que isso chegue ao núcleo.
29512 helgatheviking

Realmente não é tanto um "trecho". Pense nele como um functions.phparquivo de tema , com um cabeçalho phpDoc específico, que mora em wp-content\plugins\some-plugin\namevez de em wp-content\themes\some-theme-name.
Chip Bennett


1

Depende muito do tema que você está usando. Se o tema estiver definindo seu favicon (com uma <link>tag no cabeçalho), você precisará substituí favicon.ico-lo para alterá-lo.

Mas se o seu tema não está definindo nada, colocar um favicon.icona raiz do seu site deve ser suficiente.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.