Mostrando postagens com marcador BlogSpot. Mostrar todas as postagens
Mostrando postagens com marcador BlogSpot. Mostrar todas as postagens

Como Coloca o Menu Igual

Como colocar este menu hover:


Va até o html do seu blog aperte Ctrl + f e Pesquise por ]]></b:skin>
e cole por cima dele este código 1º:


Agora aperte Ctrl + f denovo e pesquise por <body*>,cole este codigo 2º abaixo dele.


Comentem.

Tutorial - Criar Mapa do Site

Existem muitas pessoas que esquecem de um detalhe interessante no seu blog, colocar uma página com o histórico de todas as suas postagens. Então se você ainda não colocou um ‘Mapa do site’ em seu blog, trate-o de colocar, pois muitos dos visitantes navegam em seu blog por meio do histórico, E neste tutorial irei ensinar como colocar um mapa do site expandível, com efeito Accordion bem elegante, nas cores preta e alaranjada.








Clique aqui para ver uma demostração


Crie uma página e cole este código no HTML... 

<link href="http://abu-farhan.com/script/acctoc/acc-toc.css" media="screen" rel="stylesheet" type="text/css"></link> 

<script src="http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js"></script> 
<script src="http://ENDEREÇO DO SEU BLOG/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script> 
<script type="text/javascript"> 
var accToc=true; 
</script> 
<script src="http://abu-farhan.com/script/acctoc/accordion-pack.js" type="text/javascript"></script>




Depois de colar este código na aba “Editar HTML” da área de postagem, modifique a parte destacada para o endereço do seu blog e depois Publique a página.

Retirar mensagem “Mostrando postagens com marcador”

Essa mensagem é feia, desnecessária e só ocupa espaço.
Mensagem Ferramentas Blog
Existem duas formas de retirar isso, dá pra aplicar as duas juntas pra ter certeza de que irá funcionar. Existem alguns modelos de template que não aceitam alguns códigos, então veja qual é melhor para você.
Retirar isso é bem simples:

Antes de fazer qualquer modificação no código-fonte de seu blog, crie uma cópia Backup do modelo.
Primeiro modo.
1. Vá ao painel do blogger e escolha “Layout” e a opção “Editar HTML”.
2. Procure pela linha de código:
]]></b:skin>
3. E, acima dessa linha, cole o seguinte:
.status-msg-wrap, .status-msg-body, .status-msg-border, .status-msg-bg, .status-msg-hidden {
display: none;
}
4. Salve o modelo e teste para ver se funciona e se não tem erros.
Segundo modo.
1. Do mesmo modo, entre em “Layout” e depois em “Editar HTML”
2. Procure pela linha, logo no início do código-fonte, “<head>” e, abaixo dela cole:
<style type='text/css'>
.status-msg-wrap{
display:none;
}
.status-msg-body{
display:none;
}
.status-msg-border{
display:none;
}
.status-msg-bg{
display:none;
}
.status-msg-hidden{
display:none;
}
</style>
3. Salve o modelo e teste para ver se funciona e se não tem erros.
Veja mais sobre opções para personalizar o layout do seu blog e assine nosso Feedpara ficar por dentro das atualizações.
Não sei uma forma de mudar as características dessa mensagem, nem como alterar o texto que aparece ou o link. Aqui só foi possível mostrar como retirar a mensagem de alerta. também não sei se é possível mudá-la de lugar, para o final da página.
Créditos: InfoWareBR e IceBreaker.

Botão TOPO Com Efeito

http://dl.dropbox.com/u/15489916/Bcreate%20Tutoriais/Topo%20pagina%20tutorial.jpg
▲ Topo (EXEMPLO DO TEXTO DO BOTÃO)
1. Layout
2. Html
3. Com CTRL + F Procure por:
]]></b:skin>

E antes do código cole o seguinte código:
#toTop {width:50px; /* Largura do botão * /background: #000000; /* Cor do botão*/border:1px solid #FFF; /* Cor da borda */text-align:center; /* Alinhamento do texto */padding:5px; /* Distancia entre texto e borda */position:fixed; /* Posição que faz com que ele corra por toda a página*/bottom:5px;right:5px;cursor:pointer;color:#FFFFFF; /* Cor da letra */text-decoration:none;font-weight:700; /* Tamanho da letra */-moz-border-radius:5px; /* Definições para o angulo do botão */-khtml-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}

Depois disso com o CTRL + F Procure por:
</body>
E acima cole o codigo abaixo:

<a href='#' id='toTop'>&#9650; Topo</a>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
    /*-----------------------
    * jQuery Plugin: Scroll to Top
    * by Craig Wilson, Ph.Creative (http://www.ph-creative.com)
    *
    * Copyright (c) 2009 Ph.Creative Ltd.
    * Description: Adds an unobtrusive &quot;Scroll to Top&quot; link to your page with smooth scrolling.
    * For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx
    *
    * Version: 1.0, 12/03/2009
    -----------------------*/
    $(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr(&quot;href&quot;);if($(window).scrollTop()!=&quot;0&quot;){$(this).fadeIn(&quot;slow&quot;)}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()==&quot;0&quot;){$(scrollDiv).fadeOut(&quot;slow&quot;)}else{$(scrollDiv).fadeIn(&quot;slow&quot;)}});$(this).click(function(){$(&quot;html, body&quot;).animate({scrollTop:0},&quot;slow&quot;)})}});
      $(function() {
                    $(&quot;#toTop&quot;).scrollToTop();
                });
            </script>

PRONTO VISUALIZE SEU TEMPLATE
DÚVIDAS COMENTE!

CLICK NO RENDER PARA "SALVAR" EM TAMANHO GRANDE

Si Pegou Comente! Não Custa Nada