Postagens Recentes

31 de mai. de 2008

Template Moça

2 comentários:
Template com 2 colunas
Visualizar
Clique AQUI para ver o template instalado
Download
Ou pegue o código AQUI

29 de mai. de 2008

Ressaltar texto

2 comentários:
Para ressaltar textos em seus posts de 2 maneiras bem fáceis, sem precisar inserir códigod no HTML do seu blog. Basta copiar os códigos e colar no modo "Editar HTML", lá onde você escreve.
Para esse efeito aqui.
<p style="border: 2px solid rgb(238, 130, 98 );">
ESCREVA AQUI O QUE QUISER
</p>
ESCREVA AQUI O QUE QUISER
<span style="background-">238, 130, 98 );">ESCREVA AQUI O QUE QUISER</span>
Números em vermelho representam as cores em RGB. Mais cores AQUI. Não se esqueça de colocar a vírgula entre os números RGB

Navbar que aparece em um clique

2 comentários:
Esta dica é para que sua navbar apareça somente se clicar em cima. Mas como nem tudo é perfeito, não funciona no IE e nem no Opera, só no Firefox.
O que você tem que fazer é copiar o código, ir até o HTML do seu blog e colar antes de:
body {
Clique AQUI e veja como funciona (claro que você só verá o efeito se navega pelo Firefox)
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
Créditos: Blog U

Template Chica Loca Azul e Rosa

2 comentários:
Template com 3 colunas + 3 colunas no footer.
Compatível com IE, Opera e Firefox
Visualizar
Ou veja o template instalado
AQUI
Download
Pegue o código AQUI

24 de mai. de 2008

Últimos comentários em seu blog

3 comentários:
Para ter em seu blog um widget com os últimos comentários com o nome do comentarista, um pequeno resumo e a opção de ler mais, como o que tenho aqui, no footer do meu blog é ultra, mega fácil. Basta copiar o código e colar no HTML/Javascript em seu Blogger.
<script style="text/javascript" src="http://andrewhonors.googlepages.com/showrecentcomments2_sp.js"></script><script style="text/javascript">var numcomments = 6;var showcommentdate = true;var showposttitle = true;var numchars = 30;var standardstyling = true;</script><script src="AQUI O ENDEREÇO DE SEU BLOG/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
Créditos: Hackosphere

23 de mai. de 2008

Como criar páginas no Google pages

Nenhum comentário:
INFELIZMENTE O GOOGLE RETIROU ESTE SERVIÇO DO AR

22 de mai. de 2008

Nuvem de tags

Nenhum comentário:
Bom pessoal, esta tuto ensina a fazer nuvem de tags, é assim, os marcadores de seu blog ficam com uma aparência de palavras em cores e tamanhos diferentes, peguei essa dica do forum Verdinhas.com.

20 de mai. de 2008

Post aberto

10 comentários:
Ontem fiz um post que ficou apenas alguns minutos no ar, mas deu o que falar. Foi um problema que tive com outro blogueiro, alguém que publicou alguns dos meus templates em seu blog hospedando-os em um servidor próprio e retirando os créditos do código dos templates. Eu já parei de me importar com as pessoas que modificam os meus templates, não adianta, sabe como é ? Resolvi relevar, mas pegar um template, retirar os créditos, hospedar e oferecer em seu blog, é demais...

18 de mai. de 2008

Marcadores expandíveis

5 comentários:
A Áurea do Templates para Você fez uma tutorial ensinando a expandir os marcadores do blog.
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.
Bom. eu fiz de uma outra forma e deu certo. Tente.
Claro que você terá que ter os marcadores em seu blog e se acaso o título que você deu aos marcadores for outro, substitua, ok ?
Vá até o HTML do seu blog e abaixo da tag(código) <head>
Coloque a código abaixo e salve.
<style type='text/css'>.texthidden {display:inline}.shown {display:block}</style><script type='text/javascript'>document.write('<style>.texthidden {display:none} </style>');</script><script type='text/Javascript'>function expandcollapse (postid) {whichpost = document.getElementById(postid);if (whichpost.className=="shown") {whichpost.className="texthidden";}else {whichpost.className="shown";}}</script>
Agora clique em "Expandir modelos de widgets" e procure pelo código:
<b:widget id='Label1' locked='false' title='Marcadores' type='Label'>
E substitua tudo que estiver abaixo deste código e antes de: <b:include name='quickedit'/>
<b:includable id='main'>
<b:if cond='data:title'>
<a href='javascript:void(0);' onclick='expandcollapse(&quot;marcadores&quot;)'>
<center><img border='0' src='AQUI O ENDEREÇO DO BOTÃO'/></center></a><br/>
</b:if>
<div class='widget-content'>
<ul class='texthidden' id='marcadores'>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/>
</span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>
Onde está em vermelho é para que você substitua pelo endereço da imagem que quiser. Abaixo alguns que fiz para você. Salve em seu pc e hospede-os em um site de hospedagem.

Recolocar enviar postagem ao pé do post

Nenhum comentário:
Alguém deixou uma pergunta no chat,de como recolocar o enviar postagem ao pé do post.
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.
Vá até Layout, agora clique em "Editar", que está abaixo de postagens do blog
Selecione a caixinha como no modelo abaixo e salve.
Bom, se você tentou pelo caminho normal e mesmo assim não deu certo, tente dessa outra forma.
Vá até o HTML do seu Blog , clique em "Expandir modelos de widgts" e agora procure pela tag (código)
<!-- email post links -->
Apague o que estiver escrito dai para baixo até: </b:if>
Agora coloque o seguinte código:
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' src='http://www.blogger.com/img/icon18_email.gif'/>
</a>
</span>
</b:if>

16 de mai. de 2008

Template Teia

Nenhum comentário:
Template com 3 colunas sendo uma lateral mais larga, com mais 3 colunas no footer.
Veja AQUI o template
Download
Pegue o código AQUI

15 de mai. de 2008

Postagens relacionadas ao pé do post

Um comentário:
Para colocar ao pé de suas postagens uma lista de posts relacionados´em seu Blogger, proceda da seguinte forma.
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.
Copie o código abaixo, vá até o HTML do seu blog e procure pela tag (código)
]]></b:skin>
Agora cole o código abaixo dele.
*Onde está em vermelho é a quantidade de postagens que o código mostrará, querendo mais de 5, aumente o número.
<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
relatedTitles = tmp2;
relatedUrls = tmp;
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
function printRelatedLabels() {
var cuantosPosts = 0;
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
var dirURL = document.URL;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
if (relatedUrls[r] != dirURL) {
document.write('<li><a href="' + relatedUrls[r] + '" title="Post relacionado: '
+ relatedTitles[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
i++;
cuantosPosts++;
if (cuantosPosts == 5) {
break;
document.write('</ul>');
//]]>
</script>
Salve. Agora procure novamente em HTML por todo esse primeiro código que está na cor verde e acrescente o código em vermelho. Note que você colocará o código em meio ao outro código.
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'>
<data:label.name/>
</a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name +
"?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"'
type='text/javascript'/>
</b:if>
</b:loop>
</b:if>
Agora procure pela código:
E cole o código abaixo, depois dele.
<p class='post-footer-line post-footer-line-3'/>
<div class='post-footer-line post-footer-line-4'>
<b:if cond='data:blog.pageType == "item"'>
<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>
</b:if>
</div>
Créditos: Vagabundia

Efeito Marquee para os lados

7 comentários:
ATeca do blog Devaneios e Desatinos perguntou-me como fazer com que o conteúdo dentro do efeito marquee corram para o lado uma ao lado da outra. É fácil fofis.
Veja AQUI o exemplo.
Copie o código e cole em HTML/Javascript.
Onde está em verde é onde você regulará o tamanho da caixinha. Em vermelho é o bendito código que fará com que o conteúdo role lado a lado, portanto, coloque-os sempre entre um elemento e outro.
O código em azul é o sentido em que os elementos da caixinha correrão.
Left----esquerda
Right---direita
<marquee direction="left" onmouseover="this.stop()" width="150" scrollamount="3" onmouseout="this.start()" height="150"><center>
<br/>
COLOQUE AQUI O QUE VC QUER QUE ROLE
&nbsp;&nbsp;
COLOQUE AQUI O QUE VC QUER QUE ROLE
&nbsp;&nbsp;
COLOQUE AQUI O QUE VC QUER QUE ROLE
&nbsp;&nbsp;
COLOQUE AQUI O QUE VC QUER QUE ROLE
&nbsp;&nbsp;
COLOQUE AQUI O QUE VC QUER QUE ROLE
</center></marquee>
*ATENÇÃO: Se antes dos elementos que você quer colocar dentro do cpodigo tiver os códigos:
<center> <left> <right>
Tire-os, ou não dará certo.

13 de mai. de 2008

Imagem principal (header) aleatória

4 comentários:
Para que sua imagem principal mude sempre a cada vez que seu visitante entra no blog é algo um pouquinho trabalhoso, mas relativamente simples.
Veja AQUI o resultado, claro que ao entrar você terá que clicar na tecla F5 do seu teclado para que a imagem modifique.
A primeira coisa a fazer é salvar um desses dois quadradinhos em seu PC. Se o fundo de seu Blogger for branco, salve o quadradinho branco, se for preto, o preto, se for de outra cor, bom, faça um quadradinho então no paint do seu pc na cor de seu blog.
*Atenção onde o salvará, precisaremos dele em instantes.
Agora vá até "Elementos de página" em seu Blogger e abra o cabeçalho (onde está o título de seu blog)
Clique em procurar para encontrar o quadradinho que vc salvou a pouco.
Deixe selecionado "Em vez de título e descrição"
Aí está o quadradinho.
Agora salve.
Agora clique em "Adicionar um novo elemento de página"
ao abrir a janela clique em "HTML/Javascript"
Adicione aí o código abaixo. Coloque o endereço de suas imagens e salve.
<script language="javascript" type="text/javascript">
function randRange(lowVal,highVal) {
return Math.floor(Math.random()*(highVal-lowVal+1))+lowVal;
</script>
<script language="javascript" type="text/javascript">
var randHdr = randRange(1,4);
if (randHdr == 1) {
document.write('<img src="AQUI O ENDEREÇO DE SUA IMAGEM">')
} else if (randHdr == 2) {
document.write('<img src="AQUI O ENDEREÇO DE SUA IMAGEM">')
} else if (randHdr == 3) {
document.write('<img src="AQUI O ENDEREÇO DE SUA IMAGEM">')
} else if (randHdr == 4) {
document.write('<img src="AQUI O ENDEREÇO DE SUA IMAGEM">')
</script>
Agora arraste o widget do cabeçalho para baixo e coloque o widget com suas imagens para cima modo que ele fique acima dos outros widgets.

Colocando vídeos do You Tube no Blogger

Nenhum comentário:
Para colocar vídeos nos postts dos Blogger é super fácil.
Ao encontrar o vídeo desejado, veja que ao lado do vídeo há uma caixinha como essa do foto. Copie o endereço.
Clique para ampliar
Pegue este endereço e cole-o em "Editar HTML" no local onde você escreve, coloque um título e publique.

Colocando vídeos nos posts do Blogger

Nenhum comentário:
Para colocar vídeos nas páginas do Blogger é bem fácil. Você poderá colocar subindo o vídeo direto do seu pc para o Blogger ou se quiser colocar hospede-o no You Tube e depois o coloque aqui.
Subindo o vídeo pelo Blogger
Leia tudo
Vá até o local onde você escreve e siga os passos.
Abrirá uma janela como essa.
Clique em "Fazer upload de vídeo"
Abrirá o browser do seu PC. Procure seu vídeo.
Depois que vc clicou no vídeo a janela ficará assim.
Coloque um título e clique na caixinha aceitando os termos do Blogger.
Agora, espere, espere...
Espere...
Espere...
ZZZ zzzzzzz z
zzzzz
zz zzzzzz
Se quiser pode ir tomar banho, preparar um lanchinho, dar uma voltinha...
20 minutos depois e nada...
30 minutos depois e nada...
45 minutos depois e nada...
1: 35 minutos depois e N A D A !!!!
Ops, apareceu a margarida !

Template Scripts

Um comentário:
Bom este template tem diversos scripts já instalados, dai o nome.
4 colunas
menu horizontal
título do post expandível
botões de navegação no lugar de "postagens mais antigas"
botão ir acima
scroller colorido
postagens relacionadas ao pé do post
data em forma de calendário
Clique AQUI para visualizar o template
Download
Pegue o código AQUI

Criando sua conta no Blogger de graça

6 comentários:
Algumas pessoas tem me escrito a respeito de abrir contas no Blogger e me dizem que agora é pago.
A verdade é que continua gratuito, mas é que há algum tempo a Globo negociou com o Blogger e quando se procura abrir uma conta aqui no Brasil através do Google, os primeiros links que abrem são de fato o da Globo, e pago pois para acessar só assinando a Globo.com.
Para ter uma conta no Blogger a primeira coisa que você precisará é de um endereço de email, pode ser qualquer um, mas se possível, dê preferência a um email do Gmail, para faze-lo, clique AQUI, é rápido e grátis.
Agora para acessar gratuitamente e abrir uma conta no Blogger, clique AQUI e preencha o formulário adequadamente.
Algumas dicas:
Dê preferência ao título de seu blog com palavras sem acentuação ou "ç"Coloque um título em seu blog que tenha relação com o que pretende postar.Não se esqueça de anotar a senha que você colocará no blog.

Dicas para iniciantes no Blogger

3 comentários:
Deixarei neste post as primeiras dicas para blogueiros iniciantes do Blogger
INICIANTES
Criando sua conta no Blogger de graça
Mudando o modelo do Blogger antigo para o modelo atual
Como baixar os templates
Onde estão os HTMLs do Blogger
HTML/Javascript
Aprenda a hospedar imagens
Localizar código no template com facilidade
Saiba quem te linka

12 de mai. de 2008

Saiba quem te linka

3 comentários:
Saiba quais os blogs que tem link para o seu automaticamente. Consulte abaixo.

Menu 3D Stu

9 comentários:
Baixei e instalei este menu para facilitar. Basta copiar e colar no local indicado.
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.
Vá até o HTML do seu blog e procure pela tag (código)
]]></b:skin>
Acima dele cole o código abaixo
/*Menu horizontal-------------------------------------------------*/
.preload16 {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1RQcid5umWEKY69Y5w4-CLEXMZ1-IG_B9YRgONhE4ftZNGhJRimhEfQmW-D4vbFOIijy7z1w_-qgumf_tdfMu12T2hS2RR2q0-WtimG0KEJeCi4sdzSVRzHEU7jd5VO3z3chN_tXqMsQ/s1600/pro162bf5.gif);
.preload16a {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlHzY_ytFlY_FRxvO2Le7xcxzz3NPv56uUKTR3CPrP5oOjoFWOMd6DjS_iFOTTL__NVM_2_xn3vRFugNUW3ckhrzOmwMygQfr0HIz7pp2CoPNuOYczClZTwf38ulw8EumM4fvGaPhpJcU/s1600/pro162azc0.gif);
.pro16 {
padding:0 0 0 1em;
margin:0;
list-style:none;
height:43px;
position:relative;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpAddObw75Pwc7-jiLrsiJybxD_xsgtPaYkdYkDdFxK-hQVcwPI3lymvPbEa_FXW6EpQeZNz_WWwJPhUhNgh1reXVlH4ZIdnirc0_VBDuJGcwMgPslReJFRtIauQQZlNMXLOVszQXF6h0/s1600/pro16backxl6.gif) repeat-x left top;
font-size:11px;
.pro16 li {
float:left;
height:43px;
.pro16 li a {
display:block;
float:left;
height:40px;
line-height:35px;
color:#888;
text-decoration:none;
font-family:arial, verdana, sans-serif;
font-weight:bold;
text-align:center;
padding:0 0 0 10px;
cursor:pointer;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyhkbyeqrAXOqXN1s1_KoYf8ya-dipu8GWfUhajOEAkRkMTMAM00QbJRQzaBXNco7ndGfrrPZNlTEhXbhIVDOQ1JCoTdmpVXkbXUnLgUccVntGh0T7uSDJA1SoW_4uYsU56d7MN1dtj3g/s1600/pro160fa8.gif) no-repeat;
.pro16 li a b {
float:left;
display:block;
padding:0 60px 0 0;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyhkbyeqrAXOqXN1s1_KoYf8ya-dipu8GWfUhajOEAkRkMTMAM00QbJRQzaBXNco7ndGfrrPZNlTEhXbhIVDOQ1JCoTdmpVXkbXUnLgUccVntGh0T7uSDJA1SoW_4uYsU56d7MN1dtj3g/s1600/pro160fa8.gif) no-repeat right top;
.pro16 li.current a {
color:#000; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlHzY_ytFlY_FRxvO2Le7xcxzz3NPv56uUKTR3CPrP5oOjoFWOMd6DjS_iFOTTL__NVM_2_xn3vRFugNUW3ckhrzOmwMygQfr0HIz7pp2CoPNuOYczClZTwf38ulw8EumM4fvGaPhpJcU/s1600/pro162azc0.gif) no-repeat;
.pro16 li.current a b {
color:#000;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1RQcid5umWEKY69Y5w4-CLEXMZ1-IG_B9YRgONhE4ftZNGhJRimhEfQmW-D4vbFOIijy7z1w_-qgumf_tdfMu12T2hS2RR2q0-WtimG0KEJeCi4sdzSVRzHEU7jd5VO3z3chN_tXqMsQ/s1600/pro162bf5.gif) no-repeat right top;
.pro16 li a:hover {
color:#000;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlHzY_ytFlY_FRxvO2Le7xcxzz3NPv56uUKTR3CPrP5oOjoFWOMd6DjS_iFOTTL__NVM_2_xn3vRFugNUW3ckhrzOmwMygQfr0HIz7pp2CoPNuOYczClZTwf38ulw8EumM4fvGaPhpJcU/s1600/pro162azc0.gif) no-repeat;
.pro16 li a:hover b {
color:#000; background:url(http://img222.imageshack.us/img222/8746/pro162pt0.gif) no-repeat right top;
.pro16 li.current a:hover {
color:#000;
cursor:default;
Salve !
Agora procure pela tag (código):
<div id='outer-wrapper'><div id='wrap2'>
Se não encontrou este acima, procure por:
<div class='header-outer'>
E cole abaixo o próximo código. Coloque seus links e salve.
<ul class='pro16'>
<li class='current'><a href='#'><b>HOME</b></a></li>
<li><a href='ENDEREÇO DO LINK 2'><b>LINK 2</b></a></li>
<li><a href='ENDEREÇO DO LINK 3'><b>LINK 3</b></a></li>
<li><a href='ENDEREÇO DO LINK 4'><b>LINK 4</b></a></li>
<li><a href='ENDEREÇO DO LINK 5'><b>LINK 5</b></a></li>
<li><a href='ENDEREÇO DO LINK 6'><b>LINK 6</b></a></li>
</ul>
Créditos: CSS Play

Feliz dia das mães

Nenhum comentário:
A todas as mamães.

11 de mai. de 2008

Banner de logos famosas

Um comentário:
Mais um site de logos famosas.

Botão sobe/desce seu blog

5 comentários:
Para ter dois botões em seu blog, um que faz a página descer e outro que faz a página subir é facil
Veja o exemplo AQUI
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.
Copie o  código vá até "Elementos de página", clique em "Adicionar um novo elemento de página", agora em HTML/Javasript e cole o código abaixo.
* Este seu widget deverá ficar posicionado na parte superior em seu blog pois é o botão para descer a página
<script language="JavaScript"> <!-- function SymError() { return true; } window.onerror = SymError; var SymRealWinOpen = window.open; function SymWinOpen(url, name, attributes) { return (new Object()); } window.open = SymWinOpen; //--> </script> <script language="JavaScript"> <!-- function scrolldown(){ for (I=1; I<=500; I++){ parent.scroll(1,I) } } function scrollup(){ for (I=1500; I>=1; I--){ parent.scroll(1500,I) } } //--> </script> <!--Começo ---> <center><input value="Desce Blog" onclick="scrolldown()" type="button"/></center> <!--Fim --->
Agora mais uma vez adicione um elemento de página, mas dessa vez o widget deverá ser arrastado para que fique na parte inferior de seu blog, pois é o botão para subir o blog.
<center><input type=button value="Desce Pagina" onClick="scrolldown()"></center>
Page 1 of 403123...403Next »Last

Copyright © 2025 Templates e Acessórios |

Design by Elke di Barros | Tecnologia do Blogger
    Twitter Facebook Google + YouTube