27 abril 2015

Como personalizar o gadget de postagens relacionadas (linkwithin)




Olá pessoal tudo bem com Vocês ? ... comigo tudo ótimo lembra que eu falei que ia dá umas dicas para vocês personalizarem o seu blog ?.. então hoje é um tutorial de como deixar aquele gadget de postagem relacionada com a sua cara.. espero que gostem do tutorial, e me digam qual tutorial vocês querem aprender que eu pesquiso e ensino aqui no blog pra vocês....
Pra quem não sabe de que gadegt eu tou falando é o Linkwithin que deixa as miniaturas da postagens relacionas abaixo de cada post.....
Veja um exemplo do antes e depois



Antes de começar vocês tem que instalar o linkwithin no blog (nossa não me diga Tayná sério ¬¬)
 acesse o site linkwithin >clique aqui<

1° Coloque seu email
2° O endereço do seu Blog
3° Plataforma que você usa( no meu caso é Blogger)
4° A quantidade de miniaturas  .
http://i11.photobucket.com/albums/a168/evelynregly/minigifs/miniok.gif Se o seu Blog tem o fundo escuro, marque a opção, se não tiver é só não marcar nada como mostra a imagem acima!
Clique em Install Widget e será novamente redirecionado a uma nova página 
1° se você tem mais de um blog selecione o desejado para o Widget
2° Coloque o titulo
3° clique em ADICIONAR WIDGET  
arraste pra ficar em baixo e dos post e clique em salvar...

Feito isso precisamos personalizar que é a ideia principal do post hahaa...

Vá no seu HTML dê um ctrl + f e na barra de pesquisa que apareceu, procure por: ]]></b:skin>

Agora cole o seguinte código ANTES de ]]></b:skin>

/* LinkWithin personalizado
----------------------------------------------- */
.linkwithin_div {

background: #FFA500; /* Cor de fundo */
padding: 0 10px;
}
.linkwithin_text {

font-size:22px; /* Tamanho do título do gadget */
color:#FFAEB9; /* Cor do título do gadget */
font-family: 'Sofia', cursive; !important;
}
a#linkwithin_logolink_0, a#linkwithin_logolink_1, a#linkwithin_logolink_2, a#linkwithin_logolink_3, a#linkwithin_logolink_4, a#linkwithin_logolink_5, a#linkwithin_logolink_6, a#linkwithin_logolink_7, a#linkwithin_logolink_8, a#linkwithin_logolink_9, a#linkwithin_logolink_10, a#linkwithin_logolink_11, a#linkwithin_logolink_12, a#linkwithin_logolink_13, a#linkwithin_logolink_14, a#linkwithin_logolink_15, a#linkwithin_logolink_16, a#linkwithin_logolink_17, a#linkwithin_logolink_18, a#linkwithin_logolink_19, a#linkwithin_logolink_20 {
display:none; /* Com isto eliminamos o link */
}
.linkwithin_posts {

width: 560px !important; /* Tamanho do gadget */
}
.linkwithin_posts a {
border: 0 !important;
padding-right: 28px !important;
}
.linkwithin_posts a:hover {

background: #FFFACD !important; /* Cor de fundo ao passar o cursor */
[spoiler=Título do spoiler]
-webkit-border-radius: 10px !important;
-moz-border-radius: 10px;
border-radius: 10px;
}
.linkwithin_img_0 div, div.linkwithin_img_0,
.linkwithin_img_1 div, div.linkwithin_img_1,
.linkwithin_img_2 div, div.linkwithin_img_2,
.linkwithin_img_3 div, div.linkwithin_img_3,
.linkwithin_img_4 div, div.linkwithin_img_4,
.linkwithin_img_5 div, div.linkwithin_img_5,
.linkwithin_img_6 div, div.linkwithin_img_6,
.linkwithin_img_7 div, div.linkwithin_img_7,
.linkwithin_img_8 div, div.linkwithin_img_8,
.linkwithin_img_9 div, div.linkwithin_img_9,
.linkwithin_img_10 div, div.linkwithin_img_10,
.linkwithin_img_11 div, div.linkwithin_img_11,
.linkwithin_img_12 div, div.linkwithin_img_12,
.linkwithin_img_13 div, div.linkwithin_img_13,
.linkwithin_img_14 div, div.linkwithin_img_14,
.linkwithin_img_15 div, div.linkwithin_img_15,
.linkwithin_img_16 div, div.linkwithin_img_16,
.linkwithin_img_17 div, div.linkwithin_img_17,
.linkwithin_img_18 div, div.linkwithin_img_18,
.linkwithin_img_19 div, div.linkwithin_img_19,

.linkwithin_img_20 div, div.linkwithin_img_20 { /* Bordas redondeadas */
-webkit-border-radius: 10px !important;
-moz-border-radius: 10px;
border-radius: 10px;
border-style: dashed !important;
}
.linkwithin_title {

color: #000000 !important; /* Cor dos títulos das postagens */
font-family: 'Sofia', cursive; !important; /* Tipo de fonte dos títulos das postagens */
font-size: 13px !important; /* Tamanho dos títulos das postagens */
line-height: 10px !important;
text-align:center;
text-decoration: none;
}
.linkwithin_title:hover {

color: #FF1493 !important; /* Cor dos títulos ao passar o cursor */
font-weight: bold !important;
}


O próprio código já diz o que deve ser feito personalize do seu gosto ... E ai pessoal gostaram? espero que sim até o próximo post e fiquem com Deus e beijão ....



creditos ao blog isjackiezzdream
Comentários
10 Comentários

10 comentários:

Jupyara disse...

Eu até tentei colocar o linkwithin mas não consegui.
Chateada.. As coisas são tão simples e eu não sei fazer rs
http://www.eaitolinda.com/
Beijos

Sem Sorte disse...

É uma ótima ferramenta para mostrar outros conteúdos do seu blog aos leitores. Belo post!

www.semsorte.com

Blog menina de Rosa disse...

Oi flor que pena mas tenta mais um pouco e vê oque você pode está fazendo de errado .. as vezes o blogger dá esse probleminha :/ .. obrigada pela visitinha... volte sempre beijos

Blog menina de Rosa disse...

É sim Gabriel sabendo colocar fica um blog organizado e chama mais atenção para outros posts.. obrigada pela visitinha volte sempre.. bj

Ellen Camargo disse...

Olá minha linda! Esse comentário é só para registrar minha presença aqui, pois solicitei links no grupo do Facebook para adicionar ao meu blogroll. Peço desculpas por não comentar a respeito desta postagem, pois como são muitos blogs, não conseguiria visitar todos, porém prometo voltar outras vezes com mais calma para prestigiar o seu lindo trabalho, pelo qual vou seguir nas redes sociais. Você pode acompanhar a sua divulgação nesse endereço http://www.ellenluz.com/ no windget VER MAIS BLOGROLL na barra lateral do blog.
O principal critério utilizado para escolher os melhores blogs para indicá-los aos meus leitores foi a qualidade apresentada, demonstrando total dedicação e o mesmo seguimento que o meu: variedades. Parabéns! Um super beijo.

Aninha disse...

Esse tutorial é muito útil e fácil de fazer. Logo no início do blog, eu usava o linkwithin e ele é ótimo, ajuda até no tráfego do blog.
Beijos :*
http://teoremaadolescente.blogspot.com.br/

Unknown disse...

Não estou conseguindo achar onde adicionar widget =(

Blog menina de Rosa disse...

oi flor é só seguir esses passos aqui. espero ter ajudado beijos ---> http://www.linkwithin.com/install?platform=blogger&site_id=778619&url=http%3A//isjackiezzdream.blogspot.com/&email=jack_zaninif%40hotmail.com#

meg disse...

Eu estou bem, obrigada por perguntar. Adorei o tutorial, apesar de já ter algo semelhante no meu blog. Contudo, tenho a certeza de que será bem útil para os seus leitores. Inclusive, tornei-me nova leitora do seu blog, seguindo <3

http://sleepy-deer.blogspot.com/

Igor disse...

Muito útil, Thanks <3 xD

© Menina de Rosa - 2012. Todos os direitos reservados.
Criado por: Tayná Oliveira.
Tecnologia do Blogger