Olá pessoas, como vão vocês?
No post de hoje, vou trazer duas coisas super legais para vocês.
A primeira delas, é um tutorial muito simples de como colocar o botão "Leia Mais" personalizado com imagem no blog, e a segunda coisa, é um pacote com 20 modelos de botão diferentes - todos feitos por mim - para vocês baixarem, e usarem no blog.
Vamos lá?
Em praticamente todos os templates que eu faço - você pode conferir aqui - eu sempre coloco o botão Leia mais personalizado. Dá uma cara muito profissional ao blog, e deixa ele mais charmoso.
Colocar esse botão não é nada dificil, e deixar ele a seu gosto é menos dificil ainda.
Para começar, vá em "Tema>EditarHTML"
Lá, de um clique dentro da area de códigos, e tecle "Ctrl+F", na caixinha de texto de que se abrir, procure por:
<data:post.jumpText/>
Caso não ache assim, tire as setinhas e a barra e procure de novo.
Quando achar, substitua esse código por:
<p align='right'><a expr:href='data:post.url'><img src='Link do botao aqui'/></a></p>
Onde está "link do botão aqui", você vai colocar o url da imagem.
Para ter o url da imagem, coloque ela no editor de posts, e depois clique em "copiar endereço da imagem" - não precisa publicar o post, ou deixar ele lá. Pode apagar sem problemas.
Na parte marcada de laranja, você pode alterar o posicionamento da imagem. Colocando ela ao centro, à direita, ou a esqueda.
Para posicionar, substitua right | à direita por:
left | à esquerda
center | no centro
Você pode fazer o seu próprio botão do jeitinho que você quer, encomendar um , ou usar qualquer um do pacote que eu disponibilizei para vocês.
Eu fiz diversos modelos, mas a maioria deles tem o visual clean, simples, porém bonito.
Fiz alguns mais fofinhos, e alguns femininos mais adultos. Você pode usar qual quiser.
Estou disponibilizando o download por meio do "PagSocial", nele, você só precisa seguir o passo, e o download ficará disponível.
**Lembrando que, o seu botão só vai aparecer se, na hora de criar o post você usar o botão para definir a partir de onde o post vai ser cortado.
Caso nenhum dos botões tenha te agradado, ou você não tenha conseguido colocar, você pode contratar esse serviço pela Mix Digital Design, o seu botão é feito do jeitinho que você quer, e instalado perfeitamente.
E ai, o que achou desse help de hoje? Bem legal né?!
Se for usar um dos meus botões, avise pra eu ir no seu blog ver como ficou :D
Se for usar um dos meus botões, avise pra eu ir no seu blog ver como ficou :D
Não esqueça de seguir o blog se gostou, e até o próximo post.
Beijos !
Que legal esse post, lembro quando montei meu blog que tinha que fuçar td sozinha, sem saber direito dos codigos...
ResponderExcluirDeu até saudade
Beijos <3
Blog Nana Pinho em cores - Face - Insta Nana
Blog Cozinha Desande - Insta Cozinha
Tenho e confesso que adoro bastante
ResponderExcluiradorei a tua partilha
Beijinhos
CantinhoDaSofia /Facebook /Intagram
Tem post novos todos os dias
Olá, td bom?
ResponderExcluirAcho tão legal quando blogs fazem esse tipo de post, q ajudam as novatas hehehe Ainda mais quando disponibilizam links e etc ♥ O meu layout já veio com, mas tem uns q n vem (sei lá pq) é bom posts como o seu por isso ^^
bjs
Blog: Skull Minds | Twitter | Tumblr | Pinterest | WeHeartIt | Instagram Snap: maisaindia
Muito bom o tutorial a sua dica é bastante importante, é sempre bom contar com uma ajuda assim. Muitas vezes queremos mudar um pouco o blog e não sabemos como, com o botão leia mais o blog fica mas personalizado, obrigada por compartilhar bjs.
ResponderExcluirOi,boa noite!
ResponderExcluirMuito boa a dica e o tutorial,parabéns!
Boa semana.
Beijos.
oi adoro dicas para melhorar nosso cantinho.O tuto está bem explicado,grata viu,bjão.
ResponderExcluirOi,
ResponderExcluirGostei da sugestão.
Vou tentar no meu site.
Ele não tem esse botão.
Já baixei os botões e vou escolher um.
Abrçs
Adorei a dica! Vários botões diferentes e lindos. Parabéns pelo post.
ResponderExcluirSuper beijo 😘
Que beleza de dica.
ResponderExcluirUm ótimo post e modelos bonitos.
Beijos
Uau e eu que não sabia nada disso, amei as explicações e a ideia do botão leia mais, vou testar, obrigada pelas dicas ...post bastante explicativo, parabéns!
ResponderExcluirAdorei o post! Abraços.
ResponderExcluirArrasou no post super dica.
ResponderExcluirAmei super passo a passo parabéns
Amei a fica. Facilita bastante bjo
ResponderExcluirEu amei sua dica, acho que vou trocar o meu que esta sem graça, muito obrigada por compartilha <3
ResponderExcluirAh mulher vou ter que contratar seus serviços...sou um fiasco em templates..achei lindo a arte que dispôs para download! Bjs
ResponderExcluirQue bacana Analu, gostei demais da sugestão, pensando em colocar no blog ;)
ResponderExcluirBjokas da Vaci :*
É bom esta ajudando, é verdade meu blog não é blogger.:(
ResponderExcluirBjos
Gosto muito desses posts que nos ajudam... parabéns
ResponderExcluirMuito legal esse tutorial! To pensando em colocar no meu blog... Obrigada por compartilhar...
ResponderExcluirAmo HTML tenho um blog que personaliza layouts. Vou salvar seu blog para quando eu precisar de tutoriais :D
ResponderExcluirVocê explica de um jeito tão fácil de entender... mas por aqui não nos arriscamos a mexer nas configurações... sempre temos que contratar alguém pra isso...
ResponderExcluirOlá Analu!uma excelente dica e muito bem explicado,temos que está sempre atualizando nossos blogs,uma ótima sugestão.Bjss
ResponderExcluirlegal quero confessar que vc explica tão simples e facil, vou colocar no meu tbm,bjks e obrigado por compartilhar
ResponderExcluirSuch an interesting post dear! Love your blog!
ResponderExcluirI'm following you on GFC :)
mystylishcorner.blogspot.ba
Beleza de tutorial, faz com que nós blogueiros iniciantes ou não aprenda mais desses detalhes que melhoram ainda mais os nossos espaços
ResponderExcluirObrigado por compartilhar
Beijos
Rafael
Muito bom seu tutorial, você explica muito bem e isso facilita demais para os blogueiros iniciantes. As imagens de "leia mais" estão lindas, parabéns!
ResponderExcluirQUE MARAVILHA ESSE TUTORIAL BEM EXPLICADINHO GOSTEI,AJUDA MUITO A NOS BLOGUEIROS,PARABÉNS PELO POSTE.
ResponderExcluirObrigado amada pela dica, ajudou muito, beijinhossssssssss
ResponderExcluirAdorei, isso ajuda muito, além de deixar o blog mais organizado e bonito!
ResponderExcluirValeu por compartilhar conosco!
Bjs (•‿•)
Oi Ana, que auto ajuda essa sua postagem menina. Olha eu não tenho a menor habilidade com essas coisinhas, mais adorei a ideia de colocar esse botão no meu blog.
ResponderExcluirBeijinhos e obrigada!
Que maravilhaaa. Eu sempre busco coisas assim na Internet pra me ajudar com i blog. Eu nao uso esse botão no meu, mas é bem interessante e to pensando em aderir, acho qur o blog fica mais organizado, né? Vou guardar teu link pra depois tentar no meu blog.
ResponderExcluirBeijos e valeu pela ajuda.
Muito legal sua dica e também os modelos personalizados. É sempre bom aprender um pouco mais e poder deixar o blog com a nossa cara. Dica anotada, assim que eu tiver um tempinho vou testar os modelos de botões. Adorei.
ResponderExcluir*☆* Atraentemente *☆*
Olá, amiga!!
ResponderExcluirQue postagem mais legal!! Amo coisas novas!!
Muito bom você compartilhar com seus amigos essa dica,pois ajuda bastante!
Parabéns!! Bjsss
Obrigada por compartilhar essa novidade para os blogs. Que bom dividir seu conhecimento com todos! Abraços
ResponderExcluirQUE TOP AMADA E MUITO BOM ADOREI SUA RESENHA OBRIGADO
ResponderExcluirAdoro colocar essas coisinhas no meu blog, faz tempo que não mudo!
ResponderExcluirsão muito fofos!
bjúús
Analu, tem como diminuir ou aumentar o tamanho da imagem?
ResponderExcluirOi, Alexsandro, tem sim ! A melhor forma de aumentar é no computador, pois não perde muita qualidade. Usando editores, como o photoscape por exemplo. No html, é só adicionar na parte (tag de abertura) p align='right' (tag de fechamento) o comando de dimensões. Logo: (tag de abertura) p align='right' width='300'(tag de fechamento) ai é só diminuir ou aumentar o número. Se não der certo, salve a imagem e dimensione ela manualmente.
ExcluirAbraços.
Obrigada funcionou aqui :)
ResponderExcluir