Categorias

Mostrando postagens com marcador Ferramentas para Blogger. Mostrar todas as postagens
Mostrando postagens com marcador Ferramentas para Blogger. Mostrar todas as postagens

Retirando a Mensagem: "Mostrando Postagens com Marcador HTML Básico. Mostrar Todas as Postagens"


Toda vez que um leitor clica num marcador ou faz pesquisas no seu blog, antes de mostrar qualquer postagem, o Blogger/Blogspot exibe a mensagem de status “Mostrando postagens com marcador HTML básico. Mostrar todas as postagens".
Embora seja explicativa, essa mensagem é redundante e ocupa um espaço precioso na tela, além de quebrar o seu layout.
Para retirar essa mensagem, faça o seguinte:
Clique em "Modelo", depois "Editar HTML", no quadro "Agora no blog". A seguir abre-se uma nova tela, clique em "Prosseguir"  Marque a caixa "Expandir modelos de widgets". Dê um Crtl+F com o teclado e procure por: 


]]></b:skin> 


Então, cole o seguinte código  ACIMA dessa linha:

.status-msg-wrap, .status-msg-body, .status-msg-border, .status-msg-bg,
.status-msg-hidden {
display: none;
}

Clique em “Visualizar”, para ver se não existe nenhum erro. Se não houver, é só clicar em “Salvar Modelo”.
Leia mais...

Como Retirar o LinkWithin da Primeira Página

Postagens relacionadas são uma ótima estratégia para que os visitantes vejam outras páginas do seu blog, mas, na primeira página, acabam gerando um pouco de poluição visual.
Se você usa o LinkWithin e quer que ele não apareça na primeira página, como nesse blog, siga os procedimentos descritos abaixo.
Clique em "Modelo", no quadro "Agora no blog", clique em "Editar HTML". A seguir abre-se uma nova tela, clique em "Prosseguir"  Marque a caixa "Expandir modelos de widgets". Dê um Crtl+F com o teclado e procure por: Linkwithin.
Se você não alterou o nome sugerido é só localizar o texto LinkWithin. Ele estará similar ao abaixo (o número 4 marcado é só um exemplo e pode variar em seu blog):

<b:widget id='HTML4' locked='false' title='LinkWithin' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>             
<data:content/>
</b:if>    
</b:includable>
</b:widget>

Substitua o código acima pelo abaixo (mantendo, em lugar do 4, o mesmo número que está em seu blog). Veja que foi incluída uma condição para que ele seja mostrado apenas em páginas do tipo “item” (linhas marcadas em vermelho):

<b:widget id='HTML4' locked='false' title='LinkWithin' type='HTML'>
<b:includable id='main'> 
<b:if cond='data:blog.pageType == "item"'> 
<data:content/> 
</b:if> 
</b:includable> 
</b:widget>

Clique em “Visualizar”, para ver se não existe nenhum erro. Se não houver, é só clicar em “Salvar Modelo”.
Leia mais...

Poderá Gostar Também de:

A necessidade de mostrar aos leitores, artigos que podem complementar as informações que ele acabou de ler ou ainda mostrar informações a mais que ele poderá gostar, significa que ele passará mais tempo em seu blog.
Observe o final de cada uma das minhas postagens abaixo. Elas contém um recurso muito fácil de colocar e que serve para mostrar os artigos relacionados no blog, além de proporcionar um visual bastante atraente, por mostrar títulos e miniaturas (se você tiver nas suas postagens) no final dos posts.

Essa Gadget pertence ao LinkWithin e para colocá-la, primeiramente faça login no seu blog. 
Sempre faça um backup do seu modelo para não correr o risco de perder alguma coisa se algo não der certo, clicando em "Modelo". Na página que se abre, no canto superior direito, clique em "Fazer Backup/Restaurar" e depois clique em "Fazer download do modelo completo". 
Feito isso, clique em LinkWithin.

1) Preencha o formulário que aparece na página inicial. Na opção correspondente a opção "Platform", selecione Blogger.
2) Escolha quantos box você deseja que apareçam no seu blog, 3, 4 ou 5.
3) Se seu blog tiver "fundo escuro", marque a caixa "My blog has light text on a dark background". Depois clique em "Get Widget!".
4) Você será redirecionado para outra página. Clique no link "Install Widget".
5) O "Painel" do seu blog será aberto em uma nova página "Adicionar elemento de página". Clique em "Adicionar Widget".

Pronto! Sua box já está colocada.

Você também pode definir a mensagem que aparecerá antes dos artigos relacionados (por padrão, “You might also like:”).

1) Localize em "Layout" a widget "LinkWithin";
2) Clique em "Editar" e copie a linha abaixo no final do código:

<script>linkwithin_text='Seu Texto Aqui'</script>

3) Clique em "Salvar";
4) Clique em "Salvar organização".


Terminado! Suas postagens com os links relacionados já devem estar aparecendo.
Leia mais...

Faça Seu Blog Aparecer no Google

Você está tentando encontrar o seu blog no Google e ele não aparece? Também tive esse problema quando fiz o meu primeiro blog.
O Google costuma indexar rapidamente os blog hospedados no Blogger, mas existem alguns detalhes que podem agilizar o processo.
1 – Adicionar a url do blog para o Google.
Em "URL" digite o endereço do seu blog e em "Comentários", digite uma pequena descrição dele. Você será levado a uma página onde deverá efetuar login e depois a uma outra página onde deverá digitar a URL do seu blog novamente. Digite o código captcha e envie o pedido.

2- Melhorar as meta-tags do seu blog.
Meta-tags são linhas de código HTML, que descrevem o conteúdo do seu blog para o Google e outros buscadores. Se você quiser entender mais sobre esse assunto, leia a postagem: Hypertext Markup Language (HTML).
O blogger utiliza um código padrão, que é bem limitado. Que tal melhorar esse código?
Se você abrir o HTML do seu blog, verá uma linha de código que define como será a descrição que aparecerá nos resultados do Google. 
Essa linha nunca poderá ser excluída ou apagada, precisa apenas ser adaptada. Então, vamos melhorá-la?
Entre no seu blog e clique em "Modelo", no quadro "Agora no blog", clique em "Editar HTML". A seguir abre-se uma nova tela, clique em "Prosseguir"  Marque a caixa "Expandir modelos de widgets". Dê um Crtl+F com o teclado. Uma caixa de pesquisa se abre no canto superior direito da página. Digite ou copie e cole o código:

b:include data=’blog’ name=’all-head-content’/>

Na caixa de edição do seu modelo essa linha fica selecionada. Substitua essa linha pelo código abaixo:


<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.homepageUrl == data:blog.url'> 
<meta content='Descrição do seu blog' name='description'/> 
<meta content='Palavras-chave' name='keywords'/> 
</b:if>


Em "Descrição do seu blog", descreva o conteúdo do seu blog com até 150 caracteres e em palavras-chave, coloque até 10 palavras ou frases curtas, que tenham relação com o tema do seu blog, com letras minúsculas e separadas por virgulas. 
Visualize e se tudo estiver ok, salve.

Nota: Você não perceberá qualquer alteração no seu blog. O Google é que conseguirá indexá-la de uma maneira mais eficiente. 
Leia mais...

Resumo das Postagens no Blogger

Resumir as postagens do blog ajuda na organização e facilita a leitura de vários títulos e introduções. Importantíssimo para todos os blogs.
Se você quer colocar o “Leia mais…” que aparece nas primeiras páginas de alguns blogs e sites, onde se pode ler  um resumo do artigo, clique em "Leia mais..." para abrir o restante do texto e aprenda como fazer o mesmo no seu blog. 
O Blogger já disponibiliza esse serviço de forma padrão.
O botão do hack “Leia mais...”, que no Blogger aparece como "Mais informações »", está visível na barra de ferramentas do editor de Postagens, como ilustra a imagem:


Agora basta digitar sua nova postagem normalmente. Ao terminar, escolha a linha onde será inserido o "Leia mais..." e clique no botão mostrado na primeira figura. Uma linha será adicionada no local, indicando o ponto do resumo da postagem, conforme a imagem abaixo.


Publique sua postagem e ela deverá ficar assim:
Esse hack é ideal para blogs novos ou para quem não tem muita experiência em HTML/JavaScript. Para blogs antigos e com muitas postagens, esse hack não é nada aconselhável, a não ser que você queira colocar resumo nas suas postagens a partir de agora.
Caso queira colocar o "Leia mais..." nas suas postagens antigas, deverá editá-las, uma a uma e fazer o procedimento conforme relatado acima.
Se ao adicionar o hack, ele não for executado em sua página, ou seja, o link “Leia mais...” não aparecer ou não funcionar, significa que o seu template não tem disponível o novo recurso.
Ou ainda se você tiver um blog com muitas postagens e quiser fazer isso de forma rápida em todas as suas publicações, automaticamente, a solução é colocar um "Resumo Automático nas Postagens". Clique no link: Resumo Automático das Postagens no Blogger,  para ler o tutorial sobre como fazer isso.
Leia mais...

Resumo Automático das Postagens no Blogger

Antes de fazer qualquer alteração no código, lembre-se de fazer o backup do seu template, clicando em "Modelo". Na página que se abre, no canto superior direito, clique em "Fazer Backup/Restaurar" e depois clique em "Fazer download do modelo completo".

Existem vários tutoriais de como resumir suas postagens, de forma automática ou manual. 
Recentemente encontrei um tutorial muito legal, ensinando a resumir de forma automática todas as postagens, colocando sempre uma imagem principal na lateral esquerda do resumo.
Os tamanhos do resumo e das imagens é configurável. 

Aprendendo a instalar o resumo automático das postagens no Blogger:

1) Faça login no Blogger, entre em “Modelo” do seu blog;
2) No quadro "Agora no blog", clique em "Editar HTML". A seguir abre-se uma nova tela, clique em "Prosseguir".
3) Marque a opção “Expandir modelos de widgets”;
4) Tecle (Ctrl + f) e digite: </head>;
5) Cole o seguinte código ANTES do </head>:

<!-- Resumo automático -->
<script type='text/javascript'>
summary_noimg = 330;
summary_img = 300;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+' [...]';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
<!-- Fim resumo automático -->

Como configurar algumas coisas:

summary_noimg = Número de caracteres do resumo caso não tenha imagem na postagem;
summary_img = Número de caracteres do resumo caso tenha imagem na postagem;
img_thumb_height = Altura da imagem em px;
img_thumb_width = Largura da imagem em px.

6) Agora procure por: <data:post.body/>
7) Substitua o código encontrado por:

<!-- Resumo automático -->
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<p><b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb
(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'>Leia mais...</a>
</span></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if></p>
</b:if>
<!-- Fim resumo automático -->

Importante: Clique em "Visualizar". Somente se estiver tudo bem e as postagens estiverem resumidas é que você deve clicar em “Salvar Modelo”.
Leia mais...