Novo codigo para tradutor apenas copie o codigo abaixo e coloque como elemento de pagina no seu blog , so não se esquece de adicionar ao codigo o link de seu blog:
<div align="center"><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=en&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/2903/3dflagsusa0001000dacb1.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=es&wl_url=http://grand-theft-auto-san-andreas-brasil.blogspot.com/"><img border="0" src="http://img502.imageshack.us/img502/29/3dflagsesp0001000dacc7.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=ja&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/3096/3dflagsjpn0001000dasx3.gif"/></a><br/><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=fr&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/5033/3dflagsfra0001000dakb7.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=it&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/2261/3dflagsita0001000daqg1.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=de&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/4136/3dflagsdeu0001000dawl2.gif"/></a><br/><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=sv&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/4752/3dflagsswe0001000dawn7.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=nl&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/5214/3dflagsnld0001000danx1.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=el&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/2797/3dflagsgrc0001000daut3.gif"/></a><br/><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=ar&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/8199/3dflagssau0001000dant7.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=ru&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/1546/3dflagsrus0001000dary0.gif"/></a><a target="_blank" href="http://www.worldlingo.com/S1790.5/translation?wl_srclang=PT&wl_trglang=zh_cn&wl_url=LINK DO BLOG AQUI"><img border="0" src="http://img502.imageshack.us/img502/4259/3dflagschn0001000dajn7.gif"/></a></div>
Veja como ira ficar no seu blog:
Novo tradutor
Marcadores: Codigos, Tutoriais 8 comentáriosPostado por Ev@dro às 05:17
Colocando imagens ou frase aletóriamente
Marcadores: Codigos, Tutoriais 5 comentáriosEste código serve para colocar frases ou imagens aleatórias no site ou blog. Ele faz aparecer somente uma das frases por vez. Você só precisa copiar o código e colocar as frases que desejar onde está escrito frase um, frase dois.... e assim por diante. Para mudar a quantidade de frases aleatórias você deve repetir quantas vezes forem necessárias esse trecho do código:
if (numero == 5){
frase = "Frase Seis"
}
Mas não esqueça de continuar a seqüência da numeração, portanto cuidado para não repetir os números senão o script não funcionará corretamente. Outra coisa que precisa ser alterada é o numero 6 nesta linha numero_de_imagens = 6, isto significa que temos 6 opções portanto se adicionar ou remover opções altere esse numero também.
Este código funciona também para imagens aleatórias para fazer isso basta colocar no lugar das frases o código das imagens, e funcionará normalmente, aparecendo uma imagem diferente cada vez que o blog for visitado.
<script language="JavaScript">
hoje = new Date()
numero_de_imagens = 6
segundos = hoje.getSeconds()
numero = segundos % numero_de_imagens
if (numero == 0){
frase = "Frase Um"
}
if (numero == 1){
frase = "Frase Dois"
}
if (numero == 2){
frase = "Frase Três"
}
if (numero == 3){
frase = "Frase Quatro"
}
if (numero == 4){
frase = "Frase Cinco"
}
if (numero == 5){
frase = "Frase Seis"
}
document.write(frase)
</script>
Postado por Ev@dro às 11:26
Fazendo um menu com barra de rolagem
Marcadores: Codigos, Tutoriais 2 comentáriosO código para fazer esse menu é dividido em duas partes:
O estilo CSS do botão que deve ser colocado junto com o restante do CSS do seu site:
.botao a, .botao a:visited{
width: 220px;
color: #000000;
text-decoration: none;
padding-top: 3px;
display: block;
padding-bottom: 3px;margin-bottom: 1px;
background-image: url(Imagem do botão);
font-family: "Comic Sans MS";
font-size: 10pt;
text-align: left;
text-indent: 6px;
}
.botao a:hover{
color: #0000FF;
background-color: #FFFFCC;
background-image: url(Imagem do botão quando o mouse estiver sobre ele);
}
E a outra parte que deve ser colocada onde o menu irá aparecer, no caso do Blogspot isso é na pagina layout, adicionar elemento, html/javascript.
<div style="width: 240px;height: 295px; overflow: auto;border: 1px
solid #999999">
<div class="botao">
<a href=”Endereço do Site” target="_blank">Nome
do Site</a>
</div></div>
Na parte do CSS a linha background-image: url(Imagem do botão); e background-image: url(Imagem do botão quando o mouse estiver sobre ele), você deve hospedar a imagem em algum site e colocar a url aqui. Se preferir pode usar uma cor de fundo trocando essas linhas por background-color: #CCCCCC; escolhendo a cor que desejar, caso use uma cor de fundo em vez de uma imagem sugiro que coloque bordas(adicione essa linha jundo com a outra border: 1px solid #333333;) está também pode ser de qualquer cor. Lembre-se de colocar a cor de fundo e borda nas duas partes do CSS. Sobre o tamanho pode ser alterado como você quiser: width: 240px é a largura do menu e width: 220px é do botão, quando fizer alterações faça nas duas larguras.
Postado por Ev@dro às 11:19
Colocando barra de rolagem nas postagens
Marcadores: Tutoriais 1 comentáriosPara colocar uma barra de rolagem nas postagens vá até a pagina editar html procure por:
#main-wrapper {
width: 410px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
e coloque essa linha:
height: 400px;
O numero 400 é o espaço na vertical que suas postagens ocuparão, esse também será o tamanho da barra de rolagem (altura).
Depois na ultima linha tire a palavra "hidden" e coloque auto.
Isso vai fazer aparecer a barra de rolagem nas postagens, depois você ajusta o numero 400 do tamanho que desejar.
Postado por Ev@dro às 11:16
Postar códigos html/java no post
Marcadores: Tutoriais 7 comentáriosPara postar códigos html/javascript no post sem que ele seja 'interpretado' pelo navegador, ou seja, postar o código puro, basta substituir todos os símbolos < e > por < e >
Exemplo: Para conseguir postar o código de imagem aqui, sem que a imagem apareça, coloco:
<img src="endereço da imagem">
Sem isso, apareceria a imagem (havendo um endereço real) ou absolutamente nada, já que no exemplo não existe um endereço de imagem real.
Quando publicado o post, aparecerá o código html puro, assim:
<img src="endereço da imagem>
Outra forma de postar codigo html é usar um javascript auto executavel feito por mim
basta você começar uma nova postagem ai digita todo o seu texto e coloca os codigos que você quer que apareça na postagem,não use nenhum outro codigo html(negrito,sublinhado,etc.)deixe para enfeita o seu vodigo mais tarde
depois de fizer toda a postagem copie o codigo abaixo e cole na barra de navegação(la onde fica o endereço do blogspot,onde você digita o endereço dos sites)
e aperta enter,automaticamente todos os caracteres com < e > vao ser substituidos por < e >
Codigo:
Postado por Ev@dro às 09:07
Redimensionando imagens
Marcadores: Tutoriais 0 comentáriosPara redimensionar imagens hospedadas no blogger
basta quando você for fazer upload escolher o tamanho e em que posição ela irá ficar
Mas se você quer redimencionar um imagem de outro servidor ai você vai ter que adicionar ao codigo da imagem o seguinte codigo:
width="150"
Exemplo:
<img src="http://img529.imageshack.us/img529/3250/bloggerlogo1wf7.png" border="0" width="150"/></a>
Acima eu ja adicionei o width="150",você pode mudar a numeração de width pelo tamanho que você quiser.
Postado por Ev@dro às 06:37
Fazendo um menu horizontal
Marcadores: Tutoriais 4 comentários1ºA primeira parte do código deve ser colocada de preferência logo depois de tudo que se refere a header.Então vá até o codigo do seu template e procure pelo seguinte codigo:
/* Header
-----------------------------------------------
*/
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#header-inner {
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
#header a {
color:$pagetitlecolor;
text-decoration:none;
}
#header a:hover {
color:$pagetitlecolor;
}
#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
#navigation{
height:40px;
width: 890px;
line-height:2.9em;
margin:-12px 10px 10px 5px;
background: url(ENDEREÇO DA SUA IMAGEM) repeat-x;
}
#navigation li{
float:left;
list-style-type:none;
border-right:1px solid #787878;
white-space:nowrap;
}
#navigation li a{
display:block;
padding:0 10px;
font-size:0.8em;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #000000;
}
* html #navigation a {width:1%;}
#navigation .selected,#navigation a:hover{
background:#808080;
color:#000000;
text-decoration:none;
}
2ºAgora adicione o codigo em vermelho como mostra o exemplo acima.
3ºAgora vamos ao segundo codigo,encontre o seguinte trecho no codigo do seu template:
<body>
<div id='outer-wrapper'><div id='wrap2'>
<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a>
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='TPBB (Header)' type='Header'/>
</b:section>
</div>
<!-- Não esqueça de colocar aqui os seus links!!-->
<div id='navigation'>
<ul>
<li><a href='inserir link do seu blog' title=''>Home</a></li>
<li><a href='inserir link aqui' title=''>Artigos</a></li>
<li><a href='inserir link aqui' title=''>Fotos</a></li>
<li><a href='inserir link aqui' title=''>Links</a></li>
<li><a href='inserir link aqui' title=''>Forum</a></li>
<li><a href='inserir link aqui' title=''>Outros Sites</a></li>
<li><a href='inserir link aqui' title=''>FAQ</a></li>
<li><a href='inserir link aqui' title=''>Contato</a></li>
</ul>
</div>
4ºAdicione o codigo vermelho como aparece no exemplo acima.Onde esta 'insirir link aqui' é opnde você irá colocar os links.E as partes em amarelo do codigo acima você pode mudar de nome pelo que você quer que apareça.
Bom eras isso espero ter ajudado.
Postado por Ev@dro às 06:17