Mostrando postagens com marcador TUTORIAL PARA BLOG. Mostrar todas as postagens
Mostrando postagens com marcador TUTORIAL PARA BLOG. Mostrar todas as postagens

Páginas numeradas no Blogger (Corrigido)

Filled under:

Está é uma postagem para corrigir o Hack de páginas numeradas  que foi mostrado aqui noblog, este hack é sempre util pois como já falei na postagem antiga, deixa o blog com uma cara de site. Este hack é mais simples de instalar pois ele tem um Java Script embutido em forma de url, o que torna ele menos extenso e mais objetivo. Vamos então a instalação:

Adicionar a CSS

1.Acesse o Painel do Blogger(blogger.com)
2.Vá em Layout->Editar HTML->Marque Expandir Modelos de Widgets
3.Procure pelo seguinte trecho "Utilize Ctrl e F":
]]></b:skin>
Antes dele adicione o seguinte:
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd;
}

.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666;
text-decoration: none;
}

Postado por: Administradorquinta-feira, agosto 09, 2012

Botão "Enviar postagem para o Orkut" - Blogger/Blogspot

Filled under:

O Orkut é a maior rede social do mundo, ou pelo menos a mais conhecida no Brasil, agora está rede disponibilizou uma ferramenta que permite compartilhar com seus amigos, os links que você encontra na Web, para facilitar este envio encontrei este simples botão que faz todo o trabalho e pode ser facilmente instalado no Blogger, veja:

1.Acesse o painel do Blogger (blogger.com)

Postado por: Administradorquinta-feira, agosto 09, 2012

Link diferente para cada autor do Blog

Filled under:

escritor-full
Este truque é muito interessante para blogs que possuem muitos autores pois permite que cada um tenha um link diferente em seu nome de autor, sem a necessidade de criar outro. Vamos ver neste pequeno tutorial como fazer em seu blog esta modificação.
1º Acesse o painel do Blogger(blogger.com)
2º Vá em Layout-> Editar HTML –> Marque a caixa “Expandir Modelos de Widgets”
3º Procure o seguinte código utilizando as teclas CTRL e F:
<data:post.author/>
4º Agora substitua o código pelo seguinte, adaptando de acordo com a observação :
<b:if cond='data:post.author == &quot;NOME-DO-AUTOR&quot;'>
<a href='LINK-DO-AUTOR' alt='PALAVRA-CHAVE-DO-LINK-DO-AUTOR' title='NOME-DO-AUTOR' target='_blank'><data:post.author/></a>
</b:if>
Obs: Modifique os dados em vermelho. Onde está em verde você deve modificar pelo nome de autor que está no seu perfil do Blogger, de forma identica, se não sabe acesse editar perfil e procure pelo campo “exibir nome”.
Para adicionar mais autores, basta pegar o mesmo código e inserir abaixo deste que acabamos de colocar. Repita o processo para mais autores.

Postado por: Administradorquinta-feira, agosto 09, 2012

Caixa de Mensagem Flutuante no Blogger

Filled under:

caixa
Com este recurso você pode colocar mensagens no seu blog de forma a deixa-las flutuando na página, também é possível inserir uma caixa de assinatura de Feed. Tornando o acesso ao seu blog mais interativo e interessante para o leitor que o acessa, veja um demo.Veja como trazer está solução para o seu blog.
1) Acesse o painel do Blogger(blogger.com)
2) Vá em Layout-> Editar HTML
3) Procure pelo seguinte código utilizando as teclas CTRL e F:
</head>
Antes do código acima insira o seguinte:
<script src='http://www.google.com/jsapi'/>
<script type='text/javascript'>
// Carrega jQuery
google.load(&quot;jquery&quot;, &quot;1.3&quot;);

google.setOnLoadCallback(function() {
$(document).ready(function()
{
//primeiro slide para baixo e pisca a caixa de mensagem
    $(&quot;#caixa&quot;).animate({
        bottom: &quot;-1px&quot;
      }, 2500
).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100);
//Fechar a caixa de mensagem quando a imagem da cruz é clicada
   $(&quot;#fechar_mensagem&quot;).click(function()
    {
       $(&quot;#caixa&quot;).fadeOut(&quot;slow&quot;);
    });
});
});
</script>
4) Agora procure pelo seguinte:
<body>
Abaixo do código anterior insira o seguinte:
<div class='mensagem' id='caixa'> 
<img id='fechar_mensagem' src=’http://arquivos.noticiaeblog.com/fecha.png' style='float:right;cursor:pointer'/>
<b>Minha Mensagem</b>
<p>Teste da caixa de mensagem flutuante para Blogger</p>
</div>
Obs: Mude os trechos em vermelho pela mensagem que deseja que apareça já com a formatação em HTML. 
5) Procure pelo seguinte trecho:
]]></b:skin>
Antes do trecho acima insira:
.mensagem{
    border:1px solid #CCCCCC;
    position:fixed;
    width:150px;
    border:1px solid #c93;
    background:#ffc;
    padding:5px;
    right:2px;
    bottom:25px;
}
Obs.: Você mudar as cores da caixa utilizando cores alfanuméricas. Para ver cores clique aqui.
6) Salve as alterações
---------------------------------------------------------------------------------------------------------------------------
Obs. Gerais:  Para transformar a caixa em um local para assinatura de Feed/RSS, basta substituir o trecho em vermelho do passo 4 pelo seguinte:
<b>Assine o Feed</b>
<p>Fique informado da novidades do blog por e-mail</p>   
<p><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri= conexaoalencar &apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='border:1px solid #ccc;padding:3px;text-align:center;' target='popupwindow'><p>Digite seu e-mail:</p><p><input name='email' style='width:140px' type='text'/></p><input name='uri' type='hidden' value='conexaoalencar'/><input name='loc' type='hidden' value='pt_BR'/><input type='submit' value='Assinar'/></form></p>
Atenção altere o trecho em vermelho pelo seu nome de Feed, se não sabe veja o exemplo a seguir.
Nosso nome de Feed: Noticiaeblog
Aproveite e assine o nosso Feed para concorrer a um dominio para o seu blog.

Postado por: Administradorquinta-feira, agosto 09, 2012

Ocultar/Exibir a Navbar do Blogger

Filled under:

blogger-edit-navbar02
Já mostrei aqui no blog vários truques para ocultar ou dar uma solução para a navbar do Blogger. A navbar hoje já tem mais recursos e é muito elegante mais mesmo assim não fica muito bonito em um blog profissional, por isso você verá hoje como criar um botão que permite oculta-lá e também exibi-lá. Veja abaixo como proceder:

Eliminando hacks anteriores relacionados a navbar

Procure partes de CSS relacionados a navbar, basta pesquisar em seu blog trechos como os abaixo e simplesmente elimina-lós:
#navbar-iframe {
visibility: hidden;
display: none;
}
ou
#navbar-iframe{
display:none !important;
}
ou
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
Se encontrar outras parecidas com estas que foram mostradas elimine.

Postado por: Administradorquinta-feira, agosto 09, 2012