Dicas pro Site

Retirar a Navbar do Blogger

2011-12-03T00:19:00.000-08:00

Para retirar a navbar do blogger no Modelo antigo

Procure no código do seu template este trecho ]]></b:skin> e acrescente antes, a parte em vermelho:

#navbar-iframe {
height: 0px;
visibility: hidden;
display: none; }

deve ficar assim:

#navbar-iframe {
height: 0px;
visibility: hidden;
display: none; }
]]>
</b:skin>

Para retirar a navbar do blogger no Modelo Novo:

Procure no código do seu template este trecho <head>(isso está bem no começo do html)e acrescente depois dele, a parte em vermelho:

<style>
#navbar-iframe {
height:0px;
visibility:hidden;
display:none !important;
}
</style>

Nos novos modelos de template com o surgimento da pagina designer do modelo, quando retirar a barra do blogspot geralmente fica um espaço vazio no lugar dela, isso é causado por esse código que você encontra na pagina editar html.

.content-outer {
margin: 0 auto;
padding-top: 20px;
}

Além deste código existem alguns outros que também podem causar o espaço, então procure também por:

.body .navbar {
height:0px;
}

.content-outer {
margin-top:0px;
}

Zere os valores para retiar qualquer espaço que possa existir. Gostaríamos de poder dizer exatamente qual é o código, mas o problema é que isso varia conforme o template que seu blog usar, portanto o unico jeito é fazer testes até descobrir qual deles funcionará no seu blog.

Certamente um deles é esse padding-top: 20px; mude a parte em vermelho para 0px

É isso que faz aparecer esse espaço vazio no inicio do seu blog.
Espero ter ajudado.

Formulário de contato em PHP para blog/site

2011-11-28T20:55:00.000-08:00

Torne seu blog/site mais profissional com uma Formulário de Contato
Este Formulário pode ser inserido em qualquer blog ou site.
Meu blog usa esse formulário.

Como instalar

Copie o código HTML abaixo cole no bloco de notas e salve como contato.html (esse código vai gerar o Formulário )

<html><head><script language="JavaScript">
function validaForm(){
//validar nome
d = document.cadastro;
if (d.nome.value == ""){
alert("O campo Nome deve ser preenchido!");
d.nome.focus();
return false;
}
if (d.email.value == ""){
alert("O campo Email deve ser preenchido!");
d.email.focus();
return false;
}
if (d.assunto.value == ""){
alert("O campo Assunto deve ser preenchido!");
d.assunto.focus();
return false;
}
if (d.mensagem.value == ""){
alert("O campo Mensagem deve ser preenchido!");
d.mensagem.focus();
return false; }
return true;}
</script>
</head>
<body>
<form name="cadastro" action="enviar.php" method="post" onSubmit="return validaForm()">
<input type="hidden">

<center>
<table width="257" border="0" align="center" cellspacing="0" cellpadding="0">
<tr>
<td width="257"><span class="style1">*</span>Nome:<br>
<input type="text" size="52" name="nome" value=""></td> </tr> <tr>
<td><span class="style1">*</span>E-mail:<br> <input type="text" size="52" name="email" value=""></td> </tr> <tr>
<td><span class="style1">*</span>Assunto:<br>
<input type="text" size="52" name="assunto" value=""></td> </tr>
<tr>
<td><span class="style1"></span>Site/Blog:<br>
<input type="text" size="52" name="blog" value=""></td> </tr>
<tr>
<td><span class="style1">*</span>Mensagem:<br> <textarea cols="40" rows="10" name="mensagem"></textarea> </td> </tr> <tr>
<td><i style="text-align: right;" align="right">*campo obrigatório   <input name="reset" type="reset" value=" Limpar "> <input name="submit" type="submit" value=" Enviar "> </i></td> </tr>

<tr>
<td> </td> </tr> </table> </center> </form>
</body></html>

Agora copie o código PHP e cole no bloco de notas e salve como enviar.php (esse código é quem envia a mensagem)

Substitua o que esta em vermelho incluindo seus dados.

<?
##########################################################
///////////////////////////////////////////////////// ###
/// Autor: Mateus Campos //// ###
/// E-mail: mateuscampos@globo.com //// ###
/// Site: www.centralwarez.com //// ###
/// Msn: mateus@centralwarez.com //// ###
/// Obs: favor não retirar os nossos créditos!!! //// ###
///////////////////////////////////////////////////// ###
##########################################################
// aqui começa o script
//pega as variaveis por POST
$nome = $_POST["nome"];$site = $_POST["blog"];$email = $_POST["email"];$fone = $_POST["fone"];$assunto = $_POST["assunto"];
$mensagem = $_POST["mensagem"];
global $email; //função para validar a variável $email no script todo
$data = date("d/m/y"); //função para pegar a data de envio do e-mail
$ip = $_SERVER['REMOTE_ADDR']; //função para pegar o ip do usuário
$navegador = $_SERVER['HTTP_USER_AGENT']; //função para pegar o navegador do visitante
$hora = date("H:i"); //para pegar a hora com a função date
//aqui envia o e-mail para você
mail ("seu-email@site.com ", //email aonde o php vai enviar os dados do form
"$assunto",
"Nome: $nome\nSite/Blog: $site\nE-mail: $email\n\nMensagem: $mensagem",
"From: $email"
);
//aqui são as configurações para enviar o e-mail para o visitante
$site = "seu-email@site.com"; //o e-mail que aparecerá na caixa postal do visitante
$titulo = "seu site aqui - Email recebido"; //titulo da mensagem enviada para o visitante
$msg = "$nome, obrigado por entrar em contato conosco, em breve entraremos em contato";
//aqui envia o e-mail de auto-resposta para o visitante
mail("$email",
"$titulo",
"$msg",
"From: $site"
);
echo "<p align=center>$nome, sua mensagem foi enviada com sucesso!</p>";
echo "<p align=center>Estaremos retornando em breve.</p>";
?>

Hospede os arquivos contato.html e enviar.php num site de hospedagem que suporte php, existem vários sites grátis disponíveis na net,

Depois de hospedado os arquivos você vai criar uma nova pagina no seu blog e inserir esse código.

<div align="center"><iframe name="" sites="" src="http://site-onde-foi-hospedado-os-arquivos-do-formulario/contato.html" width="550" frameborder="0" height="480" scrolling="auto"></iframe></div>

Caso seja necessário alterar os valores em vermelho para mais ou para menos para ajustar a sua pagina.

Pronto se você fez tudo certo seu formulário de contato esta pronto.

Duvidas, deixe um comentário.

Inserindo banner ou Adsense sob o cabeçalho

2010-10-07T21:47:00.000-07:00

Uma maneira de inserir banners e outros elementos de página centralizados sob o cabeçalho facilmente é procurar no código do seu template (não é preciso Expandir Modelo de Widget) este trecho:

<amp;div id="crosscol-wrapper" style="text-align: center;">
<b:section class="crosscol" id="crosscol" showaddelement="no">

onde está no substitua por yes e salve. Vá em Modelo/Layout e já poderá visualizar o espaço apropriado sob o cabeçalho para inserir elementos de página.

Nota1: Esta DIV pode ser encontrada em todos os templates originais do Blogger. Templates modificados podem não conter esta DIV

Nota2: Esta DIV pode ser personalizada no CSS assim:

#crosscol-wrapper{ width: estabeleça aqui a largura; height: estabeleça uma altura, se desejar; background: estabeleça cor ou imagem de fundo; padding: estabeleça distância das margens;}

Nota3: esta DIV sempre acompanhará a largura total de Outer-Wrapper se nenhum valor em width for estabelecido.

É excelente para centralizar facilmente, links de anúncios do Adsense sob o cabeçalho.

fontes:
Templates Novo Blogger

Como adicionar Url e Sitemaps do blogger no Gloogle

2010-10-02T08:57:00.000-07:00

É possivel adicionar Sitemaps do blog no Gloogle? Sim, você fará isso através da "Ferramentas para Webmasters"

Você não precisa criar o Sitemaps, ele já esta pronto para uso, para verificar isso faça o seguinte.

Digite no seu navegador o endereço do seu blog acrescentando /atom.xml
Veja exemplo: http://SEU BLOG.blogspot.com/atom.xml

Essa é a URL do Sitemaps do seu blog, e mais, você não precisa fazer atualizações quando criar ou modificar um post, ele atualiza automático.

Vamos lá.

Primeiro precisamos cadastrar seu blog no Gloogle.

Entre na sua conta Gloogle, entre em "minha conta" verifique se o serviço "Ferramentas para Webmasters" já esta na lista, Caso não seja mostrado nos serviços role a pagina ate o final, não visualizando, clique em "mais" aparecera este seriço, clique sobre ele.

Logo no inicio da pagina ha uma caixa para adicionar o URL do seu blog (dica importando que prestei atenção; não use o "www" isto apresentara erros na hora que o Gloogle verifica seu Sitemaps)
Clique em "Adicionar site".

Aparece a proxima pagina informando que seu Blog foi incluido na sua conta, logo abaixo ha uma caixa amarela com a proxima etapa, "Verifique seu site" clique.

na caixa "Escolher método de verificação" escolha "incluir meta tag", copie o codigo gerado pelo Glogle e faça o seguinte:

Em outra janela do seu navegador faça login no deu blog,

clique em "layout", "Editar HTML"

Na caixa que contém o código HTML cole o código gerado pelo Gloogle abaixo de >head<. clique em "SALVAR MODELO" pronto. (Pode até fechar essa janela)

Agora vamos adicionar o seu "Sitemaps",

Na janela anterior onde cadastramos seu site clique em "verificar", voltara para "Ferramentas para Webmasters", onde mostra sitemaps clique em "Adicionar", abrira nova janela mostrando seu URL pedindo um complemento,

Digite apenas atom.xml.
Ex: http://SEU BLOG.blogspot.com/atom.xml
Clique em "Enviar Sitemaps".~

Pronto! seu Blog e Sitemaps esto cadastrados no Gloogle.

Feito esse procedimento percebera o aumento de visitas em seu blog.

Adicionar Adsense no corpo do post

2009-08-01T18:33:00.000-07:00

Navegando em varios blogs sempre encontrei adsenses nos posts, mais não achei que ficavam organizados, então vendo um adsense em um post do Wordpress fiquei intrigado, e comecei a fazer testes e consegui embutir o código para aparecer somente no post e não na pagina inicial e de forma organizada como aparece neste post.

Entao vamos ao que interessa:

1- Gere o código do anúncio site do Adsense .
Exemplo:

<script type="text/javascript"></script>
<script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>

2- Copie o código e cole no bloco de notas. Substitua os sinais
em vermelho por estes códigos em azul: (se não alterar o código não vai funcionar)

< e <

Ficando dessa forma:

<script type="text/javascript"></script>
<script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>

3- Vamos acrescente uma tabela a esse código, veja as partes a serem acrescentadas destacados em vermehlo: (a tabela é necessário para separar o Adsense do post)

<!—sistema de adsense coluna post-->
<table height="0%" cellspacing="3" cellpadding="3" width="0%" align="right" border="0">
<tbody>
<tr>
<td>

<script type="text/javascript"></script>
<script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>


4- Agora vamos inserir o código no post.

(antes de qualquer alteração, sempre salve uma cópia do seu
template , clique em Baixar Modelo Completo, uma cópia do seu template será salva no seu computador)

Vamos la.

Vá em Modelo, Editar HTML e clique em Expandir Modelo de Widget. Agora encontre este trecho do código do seu template:

<div class='post-header-line-1'/>

<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p>
<div>

<b:if cond='data:post.allowComments'>

5- Insira, abaixo desta linha, o código do anúncio já modificado.
Vai ficar assim:

<div class='post-header-line-1'/>

<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p>
<div>

<b:if cond='data:post.allowComments'>

<!—sistema de adsense coluna post-->
<table height="0%" cellspacing="3" cellpadding="3" width="0%" align="right" border="0">
<tbody>
<tr>
<td>

<script type="text/javascript"></script>
<script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>


6- Salve seu template.

OBS: Essa forma só funciona nos templates 2006, ainda não consegui configurar nos novos templates.

Bons lucros!

Fonte inicial TEMPLATES PARA NOVO BLOGGER, alterações feitas por mim.

Alterações na Política de Privacidade do Google - ADSENSE COM BASE EM INTERESSE

2009-03-25T09:51:00.000-07:00

Editores que veiculam anúncios do Google nos seus sites/blogs, o Google enviou e-mails de notificação avisando sobre o lançamento da publicidade com base em interesse, que requer que você revise e faça alterações necessárias nas políticas de privacidade do seu site até o dia 8 de Abril.

Se você já possui (ou ainda não possui) uma pagina de Política de Privacidade exigida no contrato do AdSense em seus site/blogs.

Faça o seguinte:

Crie um post com a política de privacidade, com o título "Política de Privacidade". Publique o post.

Aqui esta um exemplo de Política de Privacidade
(a parte em negrito são as novas alterações exigidas pelo Google)

Política de Privacidade

Este site pode utilizar cookies e/ou web beacons quando um usuário tem acesso às páginas. Os cookies que podem ser utilizados associam-se (se for o caso) unicamente com o navegador de um determinado computador.

Os cookies que são utilizados neste site podem ser instalados pelo mesmo, os quais são originados dos distintos servidores operados por este, ou a partir dos servidores de terceiros que prestam serviços e instalam cookies e/ou web beacons (por exemplo, os cookies que são empregados para prover serviços de publicidade ou certos conteúdos através dos quais o usuário visualiza a publicidade ou conteúdos em tempo pré determinados). O usuário poderá pesquisar o disco rígido de seu computador conforme instruções do próprio navegador.

O Google, como fornecedor de terceiros, utiliza cookies para exibir anúncios neste site.Com o cookie DART, o Google pode exibir anúncios para seus usuários com base nas visitas feitas a este site.Você pode desativar o cookie DART visitando a Política de privacidade da rede de conteúdo e dos anúncios do Google.

Usuário tem a possibilidade de configurar seu navegador para ser avisado, na tela do computador, sobre a recepção dos cookies e para impedir a sua instalação no disco rígido. As informações pertinentes a esta configuração estão disponíveis em instruções e manuais do próprio navegador.

Este site não se responsabiliza pelo conteúdo, promessas e veracidade de informações dos banners colocados pelos seus patrocinadores. Toda a responsabilidade é dos anunciantes.

Agora vamos criar um link para a pagina Politica de privacidade
1. Entre no site do blogspot e faça login.

2. Entre na aba "Layout"

3. Clique no link "elementos da página".
4. Na barra direita clique em "adicionar um gadget"

5. Na janela que se abrir clique em "Lista de Links"

6. Na nova janela, No Título, escreva "Política de Privacidade"
7. Em "URL coloque o endereço da postagem que você fez (caso você não saiba, entre no seu blog, clique no título do post da política de privacidade e copie o endereço que surgir no navegador

8. Preencha o espaço "Novo Nome do site" com "Política de Privacidade".
9. Clique em "adicionar link"
10. Clique em "Salvar".

11. Arraste a caixa para a posição que desejar.

Pronto.

O Resultado neste exemplo pode ser visto no último ítem da barra lateral direita.

NOTA

A utilização de uma política de privacidade é obrigatória de acordo com os termos e condições do serviço do Google. Se por ventura utiliza os serviços de publicidade do Google ou de outro anunciante, utilize esta política de privacidade em seu site/blog!

Contador de visitantes online - Who's Amung Us

2009-02-04T13:17:00.000-08:00

O Who’s Amung Us é um Site que oferece um ótimo sistema de monitoramento de visitantes conectados, sendo mais que um contador.

Ele tambem grava todos os dados ao longo do tempo o qual podemos conferir o andamento do site, e mais, indica em um mapa a localidade de onde vieram os cliques.

Ele permite vizualizar os dados em forma de gráficos
Vc escolhe a forma, por horas, dias ,meses e anos.

Você pode tambem Personalizar seu widget!

Como utilizar
É simples, não requer nenhum tipo de cadastro, simplesmente vc acessa a pagina inicial do Who’s Amung Us, copia o código exibido e cola nas paginas de seu site ou blog

Colocar link para expandir post no Blogger

2009-01-27T13:55:00.000-08:00

Depois de muita procura encontrei como mostrar somente inicio de post em um blog,

Para fazer essa configuracao precisanos de dois arquivos, um arquivo chamado jQuery (arquivo de biblioteca uzado neste sistema) e um outro arquivo js chamado start.js, e acrecentar duas linhas de comando na template do blog. Vamos lá.

1º passo - Clique aqui jQuery vc entrara no site,na parte inferior do site tem um botão para vc baixar a biblioteca, salve o arquivo, esse arquivo deve ser hospedado em lugar na web de sua preferencia.

2º passo - Baixe o arquivo start.js, salve-o pra hospedar junto com o anterior, e

3º passo - Edite o html de seu blog inserindo o codigo depois da tag head

<head>

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/start.js" type="text/javascript"></script>
js/jquery.js" type="text/javascript">

Substitua o endereço onde esta em negrito pelo endereco onde esta hospedado os dois arquivos

Ex: <script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'></script>
<script src='http://logon.com.pt/diversos/js/start.js'></script>

Esse arquivo "start.js" colocara o link "Clique aqui!" exatamente onde insirir a tag no post, caso queira mudar para uma frase "Leia mais" ou algo de seu gosto, abra o arquivo em um editor ou no bloco de notas do windows e altere a parte "clique aqui!" salve o arquivo.

Depois de tudo feito, faça um post e quando quiser que ele insira o "leia mais" insira a tag

<div id="maisinfo"> coloque o texto que quer deixar escondido e depois no fim feche a tag com </div>

ficando assim:

texto que quer mostar blablabla-blabla
<div id="maisinfo">
texto que quer esconder blablabla-blabla
</div>

Terminado! publique, ele vai cria um link Leia mais! que ao clicar expande seu texto.

Simples assim!