Combo para modificar o layout de seu blog com facilidade

Será essa a aparência do blog.

Que tal modificar totalmente o layout de seu blog através do HTML/Javascript do seu blog ? Bem facinho e te permite fazer várias combinações.

Salve. Agora clique em Layout

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

Cole então o próximo código fazendo as modificações necessárias, caso prefira colocar outras imagens para personalizar seu blog. Se não quiser retirar a barra, apague o código que está na cor vermelha.

<style>
#navbar{display:none;}
body, .body-fauxcolumn-outer .cap-top {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYmZbrXm_0I28iEdhbahEEMmG6C4DBK-ctXRy_U9CE7DlTgb3d1e8Zhk4UswbZ6g7P8GDagL8R3moiPvAw9ivalelHihbuxWf2dZv2cL84g87iXo3DJxm8PYiZSAd-tI1bg1Rn7MISTPs4/s1600/BVS+beautiful+paper08.jpg) repeat;/*imagem de fundo do blog*/
}

.main {
background: #EFEDE7;
}
.main-outer {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZU6U_E1_jqh4E2PeB3YJeBpzAqELsf1Ud8oDL9UeqObEhVB-SQoXd625PciaeN7Lrqe16pd3Ef_kIFMNwv7P3s_4m3ReW8OvX2Sgw99r39_GyVbDHDJ0UEVb6qnkVeF3aEHmuQz0SBYTn/s1600/BVS+beautiful+paper04.jpg)  repeat;
margin: 6px 0 6px 0;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}
h3.post-title, post-title h2{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ3Lb-q5QA53cPX-XHMinygCRlxaAeKC9zbZ0GCmnT1DHtpWhm3LJOVOerCTOMhIbzGXBbNZXLYeemZrEDP6xYbBgV47POK-4eOR27wzwR2ARoYuxIQzCJiUmwpH9lsDFpaFTmx4LBXW_G/s1600/BVS+beautiful+paper14.jpg)  repeat; /*imagem de fundo do título*/
font-color: #fff;
color: #fff; /*cor do título do post*/
text-shadow: black 0.1em 0.1em 0.2em;
padding: 8px 2px;
margin: 3px 1px;
}

/*Tabs--------------------------------*/
.tabs-inner {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2Mc0-tpJ9nEE2a9jZ9HK_8aCUUPOScidkD0ubFFmzUu_TOvkNRMXnimumEOZzGvOHQ8kvzLRDqU-I00sWEY1hXMTT8Jkqta4fdAGQJ6kQXKxrBjcWPj0-hmfHtIyLZTlf5u6rMn-2imJj/s1600/BVS+beautiful+paper04.jpg);/*imagem de fundo dos widgets*/
padding: 6px 5px;
margin: 2px 0 6px 0;
border: none;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}
.tabs-inner .section:first-child {
margin:2px 2px 2px 1px;
padding: 6px 5px 6px 5px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8DekVoqDFlUDh1OtfOCI-smtdsDpM23ikaf50kuqkL4Sh11iTu93JKoLqiXhWVgTn9LXkP95HodYHG3CIEaugPoSVEdm4tJXgPbVcDDzzh9m0ZWSNjoAZUhv38NZ0S_Ektg3dnmHEPhRx/s1600/BVS+beautiful+paper11.jpg) repeat;/*imagem de fundo da tab*/
border: none;
}
.section:first-child ul{
border: 1px dashed #3B2517;
padding: 6px 5px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
border: none;
}
.tabs-inner .widget ul{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIOBpzHTa7AT5luDH-e6SDNcx8d0kqHbChma6X7eQiJU_gyPu6G2d3n9N48A86tY-GVo5c2r7Xp43rvXgNxYz0HmtdaI3dZCaAX1nawYFghAn_R0CxjAEW8qJAXTtWQXRbBJg1fk_aT_qM/s1600/BVS+beautiful+paper10.jpg) repeat;
list-style: disc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1v208SXpQB1G-meGI01aqwgcUSrqiagu7koH9JTd_GGBirisrv0K24HxKjDeITOGjyb9fjFNwODFJWUzvq_ZjpUGDbN-P6lTTtVzMNbBgy-6VzrrpQkQxQK22WH0lZCoWIoj6hS92YlY/s1600/5.gif);
border: none;
width: 98%;
vertical-align: top;
padding: 3px 1px 3px 1px;
margin-left: 2px;
}
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover{
background: #F3EDDF; /*cor de fundo da tabs selecionada*/
border: none;
margin: 2px 0 2px 0;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}
.tabs-inner .widget li a{
margin: 0 1px 0 0;
background: #FDFBF7;
border: none;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}

/*Sidebar e footer------------------------------------------------------------*/
#sidebar-right-1, #sidebar-right-3, #sidebar-left-1,  #sidebar-left-3, #sidebar-right-2-1, #sidebar-right-2-1, #sidebar-left-2-1, #sidebar-right-2-2,  #sidebar-left-2-2,  #footer-1, #footer-2-1, #footer-2-2, #footer-2-3{
margin:2px 2px 2px 1px;
padding: 6px 5px 6px 5px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIOBpzHTa7AT5luDH-e6SDNcx8d0kqHbChma6X7eQiJU_gyPu6G2d3n9N48A86tY-GVo5c2r7Xp43rvXgNxYz0HmtdaI3dZCaAX1nawYFghAn_R0CxjAEW8qJAXTtWQXRbBJg1fk_aT_qM/s1600/BVS+beautiful+paper10.jpg) repeat;/*imagem de fundo da sidebar*/
}

#sidebar-right-1 .widget, #sidebar-right-3 .widget,  #sidebar-left-1 .widget, #sidebar-left-3 .widget, #sidebar-right-2-1 .widget,  #sidebar-left-2-1 .widget,  #sidebar-right-2-2 .widget, #sidebar-left-2-2 .widget,  #footer-1 .widget, #footer-2-1 .widget, #footer-2-2 .widget, #footer-2-3 .widget{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2Mc0-tpJ9nEE2a9jZ9HK_8aCUUPOScidkD0ubFFmzUu_TOvkNRMXnimumEOZzGvOHQ8kvzLRDqU-I00sWEY1hXMTT8Jkqta4fdAGQJ6kQXKxrBjcWPj0-hmfHtIyLZTlf5u6rMn-2imJj/s1600/BVS+beautiful+paper04.jpg);/*imagem de fundo dos widgets*/
border: 1px dashed #3B2517;
padding: 6px 5px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}
#sidebar-right-1 .widget-content,  #sidebar-right-3 .widget-content,  #sidebar-left-1 .widget-content,  #sidebar-left-3 .widget-content, #sidebar-right-2-1 .widget-content,  #sidebar-left-2-1 .widget-content,  #sidebar-right-2-2 .widget-content,  #sidebar-left-2-2 .widget-content, #footer-1 .widget-content, #footer-2-1 .widget-content, #footer-2-2 .widget-content, #footer-2-3 .widget-content{
background: #F3EDDF; /*cor de fundo dos widgets*/
padding: 2px 2px;
}

#sidebar-right-1 h2, #sidebar-right-3 h2, #sidebar-left-1 h2, #sidebar-left-3 h2, #sidebar-right-2-1 h2,  #sidebar-left-2-1 h2, #sidebar-left-2-1 h2, #sidebar-right-2-2 h2,  #sidebar-left-2-2 h2,  #footer-1 h2, #footer-2-1 h2, #footer-2-2 h2, #footer-2-3 h2{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ3Lb-q5QA53cPX-XHMinygCRlxaAeKC9zbZ0GCmnT1DHtpWhm3LJOVOerCTOMhIbzGXBbNZXLYeemZrEDP6xYbBgV47POK-4eOR27wzwR2ARoYuxIQzCJiUmwpH9lsDFpaFTmx4LBXW_G/s1600/BVS+beautiful+paper14.jpg) repeat; /*imagem de fundo do título*/
color: #fff; /*cor do título do widget*/
text-shadow: black 0.1em 0.1em 0.2em;
padding: 8px 2px;
margin: 3px 1px;
}

#sidebar-right-1 ul li, #sidebar-right-3 ul li, #sidebar-left-1 ul li, #sidebar-left-3 ul li, #sidebar-right-2-1 ul li,  #sidebar-left-2-1 ul li,  #sidebar-right-2-2 ul li, #sidebar-left-2-2 ul li,  #footer-1 ul li, #footer-2-1 ul li, #footer-2-2 ul li, #footer-2-3 ul li{
list-style: disc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1v208SXpQB1G-meGI01aqwgcUSrqiagu7koH9JTd_GGBirisrv0K24HxKjDeITOGjyb9fjFNwODFJWUzvq_ZjpUGDbN-P6lTTtVzMNbBgy-6VzrrpQkQxQK22WH0lZCoWIoj6hS92YlY/s1600/5.gif);
vertical-align: top;
padding-bottom: 1px;
margin-left: 2px;
border-bottom: 1px dotted #808080;
}

.fauxcolumn-left-outer .fauxcolumn-inner, .fauxcolumn-right-outer .fauxcolumn-inner , .footer-outer{
border: 0px;
padding: 6px 5px 6px 5px;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8DekVoqDFlUDh1OtfOCI-smtdsDpM23ikaf50kuqkL4Sh11iTu93JKoLqiXhWVgTn9LXkP95HodYHG3CIEaugPoSVEdm4tJXgPbVcDDzzh9m0ZWSNjoAZUhv38NZ0S_Ektg3dnmHEPhRx/s1600/BVS+beautiful+paper11.jpg) repeat;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}
</style>

»»Leia mais...

Widgets com efeito accordion

DEMO

Para quem economizar espaço no blog, que tal este efeito accordion em TODOS os widgets do Blogger ?





Vá até o Modelo de seu blog, clique em Editar modelo

  Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. Essa dica é para o template Simple, do novo Blogger, implementado em julho de 2011

Agora procure por: ]]></b:skin>  

Depois dele cole o seguinte código:

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<style type='text/css'>
.cegdicon { position:relative;float:right;height:9px;width:9px;top:3px;margin-top:0px;}
.cegdlink { display:block; }
.cegdclosed { background: url(data:image/gif;base64,R0lGODlhCQAJAKIAAO/v5/fz78TK1/f39wAAAIuRoP///wAAACH5BAAAAAAALAAAAAAJAAkAAAMeKLVcajCaFQkca2gywiwDIYpfEAAWREHpJ0VOwwgJADs=) center center no-repeat;}
.cegdopen { background: url(data:image/gif;base64,R0lGODlhCQAJAKIAAO/v5/fz78TK1/f39wAAAIuRoP///wAAACH5BAAAAAAALAAAAAAJAAkAAAMbKLVcajCaJeFYI+cwyyAg2AUBIFFVl05KswgJADs=) center center no-repeat;}
</style>
<script type='text/javascript'>
//<![CDATA[
// collapse/expand blogger sidebar gadgets
// MS-potilas 2012
var cegdGroups = {};
var cegdMargin = 6;
function cegdToggle(ee, closeonly) {
  if(!closeonly) closeonly = false;
  var ele = $(ee);
  var ene = ele.find(".widget-content:first");
  if(!ene.length) ene = ele.find(".gadgets-gadget-container:first");
  var h2 = ele.find("h2:first");
  if(closeonly || !ene.is(":hidden")) {
    ene.slideUp("fast");
    h2.find(".cegdicon").addClass("cegdclosed");
    h2.find(".cegdicon").removeClass("cegdopen");
  } else {
    ene.slideDown("fast");
    h2.find(".cegdicon").addClass("cegdopen");
    h2.find(".cegdicon").removeClass("cegdclosed");
  }
}
function cegdClose(ee) { cegdToggle(ee, true); }
function cegdDo(ee) {
  if(cegdGroups["#"+$(ee).attr("id")] && cegdGroups["#"+$(ee).attr("id")] != "") {
    var ccc=cegdGroups["#"+$(ee).attr("id")].split(",");
    for(var i=0; i<ccc.length; i++) cegdClose(ccc[i]);
  }
  cegdToggle(ee);
}
function cegdInit(ele, closed) {
  var h2 = $(ele).find("h2:first");
  if(h2.length) {
    if(!(h2.parent().is("a")))
      h2.wrap('<a title="Click para abrir/fechar" class="cegdlink" href="javascript:void(0)" onclick="cegdDo(&#39;'+ele+'&#39;);this.blur();"></a>');
    $(ele).css('margin-top', cegdMargin);
    $(ele).css('margin-bottom', cegdMargin);
    if(!(h2.find(".cegdicon").length))
      h2.prepend('<div class="cegdicon cegdopen"></div>');
    if(closed) cegdClose(ele);
  }
}
function cedgID(gdg) {
  if(gdg[0] == '#') return gdg;
  if($(gdg).length == 1) return gdg;
  if(gdg[0] != '#' && $('#'+gdg).length == 1) return '#'+gdg;
  if($(".widget h2:contains('"+gdg+"')").length == 1)
    return '#'+($(".widget h2:contains('"+gdg+"')").parents(".widget").attr("id"));
  return gdg;
}
function cedgAddOpen() {
  if(arguments.length > 1 && cegdGroups[cedgID(arguments[0])]) return;
  for(var i = 0; i < arguments.length; i++) {
    arguments[i] = cedgID(arguments[i]);
    cegdInit(arguments[i]);
    var oth = "";
    for(var j = 0; j < arguments.length; j++) {
      if(i!=j) {
        if(oth!="") oth += ",";
        oth += cedgID(arguments[j]);
      }
    }
    if(oth != "") cegdGroups[arguments[i]] = oth;
    if(i) cegdClose(arguments[i]);
  }
}
function cedgAddClosed(gdgid) {
  cegdInit(cedgID(gdgid), true);
}
$(window).load(function() {
  // call cedgAddOpen / cedgAddClosed for gadgets you want to expand/collapse
  // parameter: gadget id with # in front of it (CSS/jQuery selector)
  // cedgAddOpen can also create a group, from which only one is open at a time.
  //
  cedgAddOpen("About Me", "More info");
  // cedgAddOpen("#Subscribe1");
 
  $(".sidebar .widget").each(function() { cedgAddClosed("#"+$(this).attr("id")); });
});
//]]>
</script>
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>

Salve.

Se quiser mudar a aparência de seus widgets, veja a explicação aqui, aqui, aqui ou aqui. 

»»Leia mais...

Os babacas da internet

Babaca detect

Não sei quanto ao blog de vocês mas por aqui sempre aparecem babacas para comentar. Eu não sei se é inveja, se falta de caráter, se é apenas frustração pela falta de capacidade de aprendizado mas sei que vira e mexe meu blog é alvo de comentários como este abaixo.

Sempre denuncio estes tipos de comentários como spam, deleto e deixo pra lá, mas resolvi mostrar para vocês como é a alma podre de algumas pessoas que se intitulam como "jovens sonhadores de paz e alegria e que tem Jesus como seu herói".

Vem cá, Jesus não pregava o desapego, a fraternidade e a humildade, tendo inclusive ensinado a dar a outra face ? Acho que seu herói é outro...

Fico me perguntando se o Deus e o Jesus dele acharia bacana esse tipo de comportamento destrutivo, odiento e sem educação. Para quem abre um blog para ensinar o próximo a arte de fotografar fico me perguntando se realmente ele é assim tão generoso. O que você acha ?

»»Leia mais...

Menu social na lateral do Blogger com efeito J.query

DEMO

Este é um menu com alguns efeitos interessantes. A começar que, os botões das páginas ficam escondidos, sendo mostrados a medida em que se passa o mouse. Há um tooltip que é mostrado assim que se pausa o mouse sobre os botões.




Vá até o Modelo de seu blog, clique em Editar modelo

  Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. Essa dica é para o template Simple, do novo Blogger, implementado em julho de 2011

Agora procure por: ]]></b:skin>  

Substitua então pelo código abaixo:

]]></b:skin>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.js' type='text/javascript'/>
<script type='text/javascript'>/*<![CDATA[*/

function makeScrollable(wrapper, scrollable){
    // Get jQuery elements
    var wrapper = $(wrapper), scrollable = $(scrollable);
 
    // Hide images until they are not loaded
    scrollable.hide();
    var loading = $('<div class="loading">Carregando...</div>').appendTo(wrapper);
   
    // Set function that will check if all images are loaded
    var interval = setInterval(function(){
        var images = scrollable.find('img');
        var completed = 0;
       
        // Counts number of images that are succesfully loaded
        images.each(function(){
            if (this.complete) completed++;  
        });
       
        if (completed == images.length){
            clearInterval(interval);
            // Timeout added to fix problem with Chrome
            setTimeout(function(){
               
                loading.hide();
                // Remove scrollbars  
                wrapper.css({overflow: 'hidden'});                      
               
                scrollable.slideDown('slow', function(){
                    enable();  
                });                  
            }, 1000);  
        }
    }, 100);
   
    function enable(){
        // height of area at the top at bottom, that don't respond to mousemove
        var inactiveMargin = 99;                  
        // Cache for performance
        var wrapperWidth = wrapper.width();
        var wrapperHeight = wrapper.height();
        // Using outer height to include padding too
        var scrollableHeight = scrollable.outerHeight() + 2*inactiveMargin;
        // Do not cache wrapperOffset, because it can change when user resizes window
        // We could use onresize event, but it's just not worth doing that
        // var wrapperOffset = wrapper.offset();
       
        // Create a invisible tooltip
        var tooltip = $('<div class="sc_menu_tooltip"></div>')
            .css('opacity', 0)
            .appendTo(wrapper);
   
        // Save menu titles
        scrollable.find('a').each(function(){              
            $(this).data('tooltipText', this.title);              
        });
       
        // Remove default tooltip
        scrollable.find('a').removeAttr('title');      
        // Remove default tooltip in IE
        scrollable.find('img').removeAttr('alt');  
       
        var lastTarget;
        //When user move mouse over menu          
        wrapper.mousemove(function(e){
            // Save target
            lastTarget = e.target;

            var wrapperOffset = wrapper.offset();
       
            var tooltipLeft = e.pageX - wrapperOffset.left;
            // Do not let tooltip to move out of menu.
            // Because overflow is set to hidden, we will not be able too see it
            tooltipLeft = Math.min(tooltipLeft, wrapperWidth - 75); //tooltip.outerWidth());
           
            var tooltipTop = e.pageY - wrapperOffset.top + wrapper.scrollTop() - 40;
            // Move tooltip under the mouse when we are in the higher part of the menu
            if (e.pageY - wrapperOffset.top < wrapperHeight/2){
                tooltipTop += 80;
            }              
            tooltip.css({top: tooltipTop, left: tooltipLeft});              
           
            // Scroll menu
            var top = (e.pageY -  wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight - inactiveMargin;
            if (top < 0){
                top = 0;
            }          
            wrapper.scrollTop(top);
        });
       
        // Setting interval helps solving perfomance problems in IE
        var interval = setInterval(function(){
            if (!lastTarget) return;  
                                       
            var currentText = tooltip.text();
           
            if (lastTarget.nodeName == 'IMG'){                  
                // We've attached data to a link, not image
                var newText = $(lastTarget).parent().data('tooltipText');

                // Show tooltip with the new text
                if (currentText != newText) {
                    tooltip
                        .stop(true)
                        .css('opacity', 0)  
                        .text(newText)
                        .animate({opacity: 1}, 1000);
                }                  
            }
        }, 200);
       
        // Hide tooltip when leaving menu
        wrapper.mouseleave(function(){
            lastTarget = false;
            tooltip.stop(true).css('opacity', 0).text('');
        });          
       
        /*
        //Usage of hover event resulted in performance problems
        scrollable.find('a').hover(function(){
            tooltip
                .stop()
                .css('opacity', 0)
                .text($(this).data('tooltipText'))
                .animate({opacity: 1}, 1000);
   
        }, function(){
            tooltip
                .stop()
                .animate({opacity: 0}, 300);
        });
        */          
    }
}
   
$(function(){  
    makeScrollable("div.sc_menu_wrapper", "div.sc_menu");
});
/*]]>*/</script>

Salve. Agora clique em Layout

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

Cole então o próximo código fazendo as modificações necessárias.

<style>

/* Menu social-----------------------------------------------*/
#menu-pro1{margin: -10px 0 0 0;
}
div.sc_menu_wrapper {
position:absolute; top:30px; left:0; z-index:9999; overflow:hidden; width: 80px; position: fixed;
height: 350px; /* modifique o número para diminuir a altura */
width: 200px; /* modifique o número para modificar a largura */
overflow: auto;
}
div.sc_menu {
padding: 3px 0;
}
.sc_menu a {
display: block;
margin-bottom: 5px;
width: 164px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
/* color y fondo efecto hover */
color: #fff;
}
.sc_menu a:hover {
background: #fff;
}
.sc_menu img {
display: block;
border: none;
}
.sc_menu_wrapper .loading { /* estilos de carga */
position: absolute;
top: 40px;
left: 10px;
margin: 0 auto;
padding: 10px;
width: 100px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
text-align: center;
color: #fff;
border: 1px solid #63B0B4;
background: #022A4A;
}
.sc_menu_tooltip { /* estilos tooltip */
display: block;
position: absolute;
padding: 6px;
font-size: 12px;
color: #fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border: 1px solid rgb(79, 79, 79);
background: #08044E;
}
</style>



<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div class='sc_menu_wrapper'>
<div class='sc_menu'>
<a href='https://www.google.com/accounts/Login?service=blogger' title='Login'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf2ajclVlOoSPu3QS5gZezS3iVrhWYxpc9Taic8BDMdjmSKhuEZ2wxC79ZXvqR9oMZsGReNPajvgl_SYhdHDPe9GU4AB7r41HPaDzFtyyoCu46RONnEKSnoAQTDRsgzoPp442hvmZRsG0/s1600/blogger-webtreats.pn' width='115px'/></a>

<a href='ENDEREÇO DO FACEBOOK' title='Encontre-me no Facebook'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7moxanX8yFd6wIhDfXxpQjfySIsQCqGL8EkyvwhiWihl_L1TgXX25X8DLgNYel8ZqgQzkUZha7l-Vf34AeGR_rg9KnOYNo8G5e5KJ9r-QvGg1jJz11zml245bHUQofl9wkuFEDt4EnCo/s1600/facebook-logo-webtreats.png' width='115px'/></a>

<a href='ENDEREÇO DO TWITTER' title='Siga-me'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAy-Aw3bdlI2YRxe-H4o6TyNjIdj3HOcv_wOZuUlWNGgA7A3RUVZ4ejO_rLwaW1RKMWF0oljaXV7GSFlMUaiaKJe2Cnx-qlwZkSjQ45XyjEn0uzLGmRx9sdlUmxAxqMSlsGGCnGH5GnTE/s1600/twitter-bird3-webtreats.png' width='135px'/></a>

<a href='ENDEREÇO DO YOUTUBE' title='Assista ao meu canal'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim8Gdm78pAYx0iakkcdtBzQi9ocwXYj_dl3TYA-rZIA9xI1fJbLhOXsrO0gn9GgVIMMGhitNaQ1DwZYRdmSXMDVeDll7KFrCSz3f2Fv5MP68gbGAbDrmA0_G_uxhYEZc71YY_QICm2jxE/s1600/you-tube1-webtreats.png' width='115px'/></a>

<a href='ENDEREÇO DO FLICKER' title='Minhas imagens'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRCNAWAsuxRMeGHdS11hONSy_XWc_l5snpDJd-w19I_jvmUebpK2VaVgzzu777Q9s2Bw_qeR3ojEZj7USYMk8XsSsp0AoNJf1exw17QsZu4CCJa0-ZUZPBOsP2L8C8jn6KplVaG1tkVfs/s1600/flickr-webtreats.png' width='115px'/></a>

<a href='ENDEREÇO DO DIGG' title='Digg'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeTtJfaS2_HbY96uaqg-5VBU8jk7DvtYESAw3jJOKbHbUAKyhj8CHETHk7GYv5INy9V_TmjYHBOMYAoO6SlLVgM4zGaj4amgIE4w6npXru9ecgdTtNDXGVIDRP4CFKkBGZdhW8DLMimAg/s1600/digg-logo-webtreats.png' width='115px'/></a>

<a href='ENDEREÇO DO ORKUT' title='Encontre-me no Orkut'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1fmIvJa0lF_gzeHISDMs0HJl_I9az9Ky38WqTQhEzJqKxzBm02ZHJVC7aVC75w4yAF1zqBwaO3_ptA7HYgF1liiTBi8gse8fRSIGnQibr9FHXrXhJ4nOC_YjHB-vkjRCGFk8ASTMSt_Q/s1600/orkut-webtreats.png' width='115px'/></a>

<a href='ENDEREÇO DO FEED' title='Assine'><img alt='' height='120px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzxfSGfeusvnKGNHDgLqErS2a83dSWBGAMDQ4WbqrE7E1posP61hL3I0GejLiyNMK0bKcKTMXnM8s_oToWFPYg8kcaw4PvDn3vedywUT0mWJEf3ONrMqsx0IOCaOr4Amvu5SupjHlCC8g/s1600/rss-basic-webtreats.png' width='115px'/></a>


</div></div>
</b:if>
</b:if>

»»Leia mais...

Menu social fixo na lateral no Blogger

Vá até o Layout

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

Cole então o próximo código fazendo as modificações necessárias. (se prefere que fique a direita troque o código em azul por right)

<style>
.menu-social-2{ position:absolute; top:30px; left:0; z-index:9999; overflow:hidden; width: 80px; position: fixed;}
.menu-social-2 img{  border: 0; margin: -9px 1px; width: 80px;}
</style>

<div class='menu-social-2'>

<a href='https://www.google.com/accounts/Login?service=blogger' title='Login'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7y-67nHndL-Qp4qyvAx9byRNa_Z0A4kkIgEeOApBItPGYC7nha87UIgwPXk1_BGQM8jdAUJuDWdzjThReuHlwKmZaHNSO1ag3bFSZM-DFLmgMfSPkyJ0LnUHQmfWImmq2qj1ToD7LtMwz/s1600/blogger-logo-square-webtreats.png'/></a>

<a href='ENDEREÇO DO FACEBOOK' title='Encontre-me no Facebook'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBVeUQphfBcS-12zy_pSIouOh3IFgc2mSkVtDeYfSdO4Bx9ZVaJy01zfaMhY0YfabJLbCnmbW1M2xSbHL8Ti4Ve1lVva-DeZOcANGNpwhzKZkZ4yGIRLH0FGwqdI7GAuFqty7GbvwyVxzI/s1600/facebook-logo-square-webtreats.png'/></a>

<a href='ENDEREÇO DO TWITTER' title='Siga-me'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjltgTOTRCNC8yUG-EzUqacIrg4HpU-rpCmVq3GtcMnunakHtyNQVfAehrxDdhRTpybG9eWPCMDKIH4I1SaHe-s1avyitAwBUat0_YRQ6PApuGhKO1_HipQXKAPB5duv-dt9uR_Mz35iySU/s1600/twitter-bird2-square-webtreats.png'/></a>

<a href='ENDEREÇO DO ORKUT' title='Encontre-me no Orkut'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlE7X3E41Kl_3l54iHqJKorTt0IXLI-0ynpl30a4vt-HQ1ro_WG68wKABhu68Z8yYvfsNL5FgCoqBkKXX6RkWBKjSw0M50wjtjQ2tT4KVP_yzrWfKRNX8RfysEhDsh5beUzNDG4fl-30S1/s1600/orkut-logo-square-webtreats.png'/></a>

<a href='ENDEREÇO DO FEED' title='Assine'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRaN9RFfMW0p_3w9yRbGXSh7cOyatkMyyE7oAG5b0pTwL1vRiuDm4K8mERxM6KEYiTGUFANWbM7uXS5FBpxuQPgJHX_lyUfjg0ZLXmeQjqAJZU65OZjykBlxTbYSX8UdvL1aG8L0vjaXfq/s1600/rss-cube-webtreats.png'/></a>

<a href='ENDEREÇO DE SEU CANAL NO YOUTUBE' title='Meu canal no YouTube'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKrolrSF-gljXAl5IdzFmb-E-Vsk_-JepnRA98IM6rbZc2WzTcSu41pNvAhVnPgTPI_31KRhkWLlG_yiTKYEs2H7rAyBVa3GI1NmHjdX7KrNwK9t7Avpjmb89IMnTdWEm3u342O-X5wB58/s1600/you-tube2-s-webtreats.png'/></a>

<a href='mailto: ENDEREÇO DE SEU MSN' title='contate-me'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYaN-Jm6m33jS-FynCX2cyo3TcG6tavMwjSo2lXDzNZwhmVVFJnkVd5A8KcEZEvwRyJVGK875hD9VYHEftZEZCF0XJgPIca1avZeJNMnquDR2Ieh_-1PI-K2gMB7z8QahvTeQZJ2n6jIRb/s1600/msn-logo-square-webtreats.png'/></a>

<a href='mailto: ENDEREÇO DE SEU EMAIL' title='contate-me'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhth1nbb60Gcn-jURqiNWQicGFyHQyt5zPZn0Hzs-I2e4RNHvEdTnBSrZWLzxMpAIOZ0PlpA-EZPYJcjLqdXlrZidO3wmJb0iePX1jyphvToDB3C4rxuDQUcYppFHe81YwUOL54EqhymZ0K/s1600/mail-square-webtreats.png'/></a>


</div>

»»Leia mais...

Menu social de alfinetes

Facinho colocar este menu e linkar suas páginas sociais...

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

Cole então o próximo código fazendo as modificações necessárias.

<style>
.menu-social{display: inline; margin: 2px 2px 2px 2px;}
.menu-social img{padding: 2px 1px 2px 0; width: 80px;}
</style>
<div class="menu-social">
<a href="ENDEREÇO DO BLOGGER" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPy6jg0fZMcOuEUFZbdhRrI1ZSH53KBTAjCKfkOnaSB4aVn1smhJ7cu9hYQHux-LHo8ZtfUc6ilsYmUpm3aKAMhOlUS10F4_59RMdeVb35J173Uz1rpQLqcmeg8FT3FJnYqgA_czuy8Ot7/s1600/_Blogger.png" /></a>
<a href="ENDEREÇO DO FACEBOOK" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZtbz2Dw4DBVnwiS5r36yu4q7624cHkOabYsTxT9RG8AwdNSufkgvseOA8N6v7TRwMEj0vYD2m7kJ4iTbmQ2qnR1lOoo1qWgc3eR5fhNu0WXYTpfStag9ny4dL6qyPVA3bFHOsUjb6jOZL/s1600/_FaceBook.png" /></a>
<a href="ENDEREÇO DO GOOGLE" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmusT0z8gtDsriOtH29MCxT6SX0vrPIRGgvIBjFYd-4QdfIAuZVAhTN_9hThw7-lB9qmpnj8B7GpCK423Q9vu6gLHK2VQm8u2SZUqpZgkgvwFFlbaoHJ8hQ7Pr8ExujngqjVOX9ietv_e9/s1600/_Google.png" /></a>
<a href="ENDEREÇO DO TWITTER" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUvQVmqZj1NFr2ghl_QTfc0QsHnWmsnBSiMLUxXN-smEFz6JNOntWcpqrJr6BqPeGHIeo8VWpqQ3yBhUKS38rtcO_gMPFcUIRfBP4j3_kdVXNPF4ghQsxoYJIGkaiwJ6ifNCtkor3tRhXx/s1600/_Twitter.png" /></a>
<a href="ENDEREÇO DO YOU TUBE" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKywmcWeCdcFufaFvSMoD5aBYRDO9Yc73jklmGGqEhJUl4FrtObgVRq9y15vNE8E4pPj_gkQwBtwDyG29ujN1F52R-4mN1URLx3W0J3NEAidUuUN6T-uzjpykEyzpY2WhEICPD3dbiI6_6/s1600/_Youtube.png" /></a>
<a href="ENDEREÇO DO FEED" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG99I8s1Y0EkgoxZ9qmNM2pTsQuEN8RHBhbEmv3eeWo5NiC82gjUJjjAm0yBRvtVlr95gJbIEgGwaUudZjDgw3wTWRlud9VbtpOJ8JY-m_lof8UdrUY1S0pRQgZSnIgz6UuE0EgQJq4954/s1600/_RSS.png" /></a>
</div>

»»Leia mais...

Menu social jeans

Mais um menu para linkar suas páginas sociais no Blogger.

Clique em Layout

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

<style>
#menu-social-jeans{
margin: 20px 1px 10px 0px;
display: inline;
}
#menu-social-jeans img {
width: 90px;
}
</style>

<div id="menu-social-jeans">
<a href="ENDEREÇO DO BLOGGER" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_DQ96xNymwPyC3Q3dB-naQ39sam0kjnonLIIZBGB5LI0dReVaXL4a3yqmocSYRONBpDuKvYhL3hW_tf47Kd-UDKnge8LAWUzrZ-Y1yfusJFIEGm-IeFom4Ra_qtp-ny9wxKjONErhDu7r/s1600/blogger.png" /></a>
<a href="ENDEREÇO DO TWITTER" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6JWPqrBhiZ0AU3ijYKcuRqMKphyphenhyphenRqsK_-upomYvLhf1PP_GPG7gP7-e0Y3PyU-IwnQqiet2ae49Ye1LMNpKjdHwpgrmR6thzbMFlOi27eEg0e0v-A5mSEWxDAyCHUA8JPDFEwnhW0NaCK/s1600/twitter.png" /></a>
<a href="ENDEREÇO DO FACEBOOK" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0EjNGDzTotnlkel_rrlssemZU8scLLlPoBQGXIvqdpiheLf5SiaU3Xu4LlIJZy8TQ5XZ5DY8aZfGhpVEETBa74OgxS4t5Do2MsJjPsaLv6IDtQXo9NCQjv-Yc8Bl1UX7h5zJxso3sq3Ux/s1600/face+book.png" /></a>
<a href="ENDEREÇO DO FLICKER" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNfh52Vrj6UT8oiW9IbKHkwwk7jBOUe-gjjlmBFDoLcs8odeSk3ikiMmOiWdxyX4u7W2lawZu4PoxhI50H3JikziMiQD-eHk0kGYXGHdIhAkdnbsuYtEL3F5t0IIfXGaz8GKVWwelBRhX7/s1600/flickr.png" /></a>
<a href="ENDEREÇO DO YOU TUBE" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc4MffrBETvBWV0EN_6t47WRgqgY0NGdDBG5AXHBy9P-aA8Kn5CzxFk3xPJuvl9TohEtLW1Ii4sr9ZA64iOp0MIeRcpHVKVqUa8EKn41duIjS0tgZPw8coHakiTYRaxyGc63PiCuo4JmhC/s1600/youtube.png" /></a>
<a href="ENDEREÇO DO FEED" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5iEGf8s4D8VyUpQkm1jvwwgvtIRHYEB-0_ggAMTEQiikNoTvdf8JJSLyQhxFYM0qxVk7AR3nE1mgqIAIWAnu9F1eH_D27qrPcDg0Fsj77iG6bErkZsr1j3vgKAtFGku1Z2SYRm6dEBkeN/s1600/rss.png" /></a>
</div>

»»Leia mais...

Botão para colocar o blog em forma dinâmica

Vá até o Modelo de seu blog, clique em Editar modelo

  Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. Essa dica é para o template Simple, do novo Blogger, implementado em julho de 2011

Agora procure por:  </body>

Substitua então pelo código abaixo:

<script src='http://bloggerblogwidgets.googlecode.com/files/BeautifulPageNavi.js' type='text/javascript'/>
<a href='/view' style='display:scroll;position:fixed;bottom:4px;right:4px;' title='Ver este blog em slide'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2JE8bCp32GlbCLwkPQ8kYzW504Fb5duj8AxHEEBrkAP7tEGNi3g40snwtZJurBJh_17jA8dIlrx5BKLhKOHhK-Bi4NeoJpmlxL3uu8Y5IhPUIfhZnZdFX0NFFD_rEUX4nKF7t3MESlB8/s1600/_Blogger.png'/></a>
</body>

Salve !


Se quiser, troque a imagem por uma de sua escolha. Pegue aqui.

»»Leia mais...