Tecnologia: Posts Relacionados

Consegui colocar os posts relacionados aqui no blog, mas foi uma luta de dois dias hahaha. Resolvi trazer aqui para vocês, pois acho um recurso muito legal! Confira abaixo o passo-a-passo:

1. Vá em  Modelo  e clique em Editar HTML (você pode copiar o conteúdo e salvar, caso alguma coisa dê errado):

2. Aperte ctrl + f para abrir a busca no código e digite </head> e depois enter:

3. Copie e cole o código abaixo antes do código que você acabou de buscar:

  <script type='text/javascript'> $(document).ready(function() {$('.resizethumbnail').attr('src', function(i, src) {return src.replace( 's72-c', 's500-c' );});}); </script> <script src='http://static.tumblr.com/r0zjsuz/LGRnkytsj/post-relacionado-blogger.js' type='text/javascript'/>

4. Agora na busca digite ]]></b:skin> :

5. Copie e cole o conteúdo abaixo antes desta tag que você encontrou:

/*Posts relacionados CSS*/ #estiloimg{ width:130px; height:130px; } .estilotexto{ width:130px; text-align:center; padding-left:3px; height:65px; margin: 3px 0pt 0pt; padding: 0pt; font-size: 14px; line-height: normal; } #related-posts { text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px; } #related-posts h2{ font-size: 1.6em; color: black; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em; } #related-posts a{ color:#444; -webkit-transition: all 350ms ease-in-out; -moz-transition: all 350ms ease-in-out; -ms-transition: all 350ms ease-in-out; -o-transition: all 350ms ease-in-out; transition: all 350ms ease-in-out; opacity:0.7; } #related-posts img{ margin: auto; border:1px solid black; } #related-posts a:hover{ opacity:1; } .post-footer-line-1{ border-top: 1px solid #fbd8e8; }

6. Encontre agora o seguinte <div class='post-footer-line post-footer-line-1'> (existem duas tags iguais, teste para saber qual é a certa, a minha foi a segunda):

7. Cole antes do código encontrado o conteúdo abaixo:

<!--Codigo Artigos Relacionados Inicio--> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != "true"'> </b:if> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a> <script type='text/javascript'> var currentposturl="<data:post.url/>"; var maxresults=4; var relatedpoststitle="Confira também:"; removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(); </script> </div> <div style='clear:both'/> <!--Codigo Artigos Relacionados Final-->

Agora é só salvar o modelo e pronto! 

Gostaram? Beijos :*

Tecnologia: Facebook Like Box (Atualizado!)

Olá gente! Hoje vou falar sobre um pouquinho sobre tecnologia, especificamente da Like Box do Facebook, essa caixinha linda que a gente adora colocar no nosso blog para os nossos amigos curtirem a nossa FanPage.

Recentemente o Facebook mudou o código de aplicação da Like Box, para quem não sabe, o código antigo só vai funcionar até o dia 23 de junho deste ano.




Na própria mensagem podemos encontrar o link para o novo código da Like Box.

Quando fui instalar esse novo código aqui no blog, senti uma certa dificuldade. Então elaborei um mini tutorial para ajudar as todo mundo que tiver as mesmas dúvidas que eu.