Hey! Antes de tudo, quero agradecer as mensagens que tenho recebido sobre o Seja Criativo! Fico muito feliz que vocês estejam gostando e apoiando a ideia. Muito obrigada, de verdade. <3
Cadê o tutorial?
Siim! No último tutorial pediram para que eu ensinasse como personalizar o botão de compartilhar, assim como do Seja Criativo. Então, vamos lá! Neste post vocês irão aprender como adicionar o botão do Facebook / Twitter / Google + personalizado no seu layout.Lembrando que todos os tutoriais postados aqui utilizando o Template Minima como base.
Primeiro: Adicionar o código
Se você quiser deixar os botões dentro do footer da postagem, procure pela linha <div class='post-footer'> no seu layout. No template Minina esta linha aparece duas vezes, portanto você deverá editar a segunda. Após localizar, adicione logo abaixo o código:Segundo: Adicionar o CSS
Localize a linha ]]></b:skin> e adicione logo acima:Lembrando que você pode personalizar o código acima para deixar os botões da forma que você preferir!
Feito isso, basta salvar e visualizar o resultado no seu blog! :)
Update!
Alguns templates, ao adicionar o código acima, podem apresentar o erro: The reference to entity "title" must end with the ';' delimiter. Para corrigir basta adicionar o amp; antes da palavra title. Explicando melhor... O código corrigido deverá ficar assim
Mi, adorei. Eu já sabia de outros modos mas assim não tinha pensando na ideia. Fica muito clean. <3
ResponderExcluirOi, no meu deu esse aviso: Erro ao analisar XML, linha 1412, coluna 119: The reference to entity "title" must end with the ';' delimiter. e agora ?
ResponderExcluirOii!
ExcluirSem ver o código não consigo ajudar muito. Manda um e-mail para contato@dezoitoprimaveras.com.br e eu te ajudo por lá! :)
Bah, Mi...fui tentar fazer no meu layout, aquele que tu me ajudou com o rodapé, lembra? E deu erro parecido com o do anônimo... (Erro ao analisar XML, linha 1850, coluna 115: The reference to entity "title" must end with the ';' delimiter.) Será que só funciona no mínima?
ResponderExcluirOii, flor!
ExcluirNa verdade, eu não sei explicar o motivo, mas em alguns templates é necessário fazer um pequenina mudança no código. Mas dá para usar sim. ^^
Muitoooo obrigada por postar, flor <3
ResponderExcluirVocê é muito fofa e atenciosa!
No meu não ficou como o seu
ResponderExcluirficou com uma bolinha do lado de cada quadrado e quando passa o mouse não tem fica douradinho assim :(
A bolinha você pode remover adicionando o list-style:none; dentro de .icon-redes-sociais li
ExcluirO dourado é só acrescentar o background em .icon-redes-sociais li:hover
Beijos!
Olá, Michelly!
ResponderExcluirAdorei seus tutoriais, espero que você leve sempre adiante seu Blog, pois esta sendo muito útil para os blogueiros iniciantes que querem personalizar seus templates. Queria ver 5 tutoriais sobre: Como dividir o cabeçalho em 2 colunas; Como colocar resumo das postagens: Leia mais na página principal; arquivos relacionados; anuncio no meio dos artigos e o que você poder mais nos ensinar com seus tutoriais.
Parabéns por sua iniciativa!!!
Um grande abraço.