Mostrando postagens com marcador Tutoriais. Mostrar todas as postagens
Mostrando postagens com marcador Tutoriais. Mostrar todas as postagens

Como colocar sistema de avatar no blog

31 de out. de 2011

Nesse Tutoral vc ensinar vcs a colocar avatar como aki em nosso site.

Primeiro vá no HTML do seu blog e clique em Expandir modelos de widgets
Depois da um Ctrl+f e procure por:<b:if cond='data:post.title'>  Cole em cima dessa tag esse codigo a baixo:
 
<b:if cond='data:post.author == &quot;Nome do Postador&quot;'><img alt='Link do avatar' height='altura' src='link da imagem do avatar' width='largura' style="float:left;margin:0 5px 5px 0" /></b:if> 

Nome do postador: vc coloca seu nome(Tem que ser o nome exato)
Link do avatar:Vc coloca o seu avatar

Para fazer uns ajustes vc procura esse codigo abaixo
style="float:left;margin:0 5px 5px 0" /></b:if>

Em left vc escolhe se quer que o avatar fique do lado esquerdo ou direito.
 
Caso vc tenha mais de uma pessoa na equipe basta adicionar o codigo conforme a sua necessidade.

Qualquer duvida é só comentar!!!
 

Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog

 
 

Como Colocar Contador De Postagens

Procure Por ]] e Adicione Este Codigo Antes
Aonde Ta o Link Vermelho Da Pra vc Colocar A imagen Que Ira Aparecer!




#Post Visitas{
background:url(http://dl.dropbox.com/u/25880118/visualizar.png);
width:263px;
height:62px;
margin:-20px auto 0;
}
.visualizacoes a:hover {
color:#;
}
.visualizacoes {
padding:23px 0px 0 50px;
width:118px;
float:left;
overflow:hidden;
display:inline;
font-size:12px;
color:#000;
font-weight:bold;
text-shadow:1px 1px #ccc;
font-family:Arial, Helvetica, sans-serif;
}
.visualizacoes a {
color:#DCDCDC;
text-decoration:none;
}
.link-pagenavi a{
color:#FFF;
text-decoration:none;
}
.link-pagenavi a:hover{
color:#FFF;
text-decoration:underline;
}





Apos Issu Procure Por <*div class='post-footer*'>sem os ***

e Adicione issu Logo Abaixo

<*b:if cond='data:blog.pageType == "item"'*>
<*div id='Post Visitas'*>
<*div class='visualizacoes'*>

Visualizações: <*script src='http://www.opromo.com/servicos/contador/contador.php' type='text/javascript'/*><*/div*>
<*/div*>

Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog

 
 

Como Adicionar Destaques No Blog

Eae galera fmz! hoje vol ensinar a vcs como colocar destaques no blog

1. Faça o login no blogger > Design > Editar HTML
(Não é preciso marcar a opção 'expandir widgets')

2. Escolha o local que ficara o slide e adicione o seguinte codigo:

#publicidade-header{
clear:both;
width:880px;
height:99px;
background:url(http://dl.dropbox.com/u/15489916/Hunter%20Down/IMGS.Slider/BG.png) no-repeat;
margin:-60px 0px 25px 0px;
padding:17px 65px 70px 50px
}
#slider{
margin:0px 0px 5px 10px;
padding:0px 50px 100px 50px
} 

3. Abaixo de ]]></b:skin> adicione o seguinte codigo:

<script src='http://dl.dropbox.com/u/15489916/Hunter%20Down/Jquery.JS' type='text/javascript'/>

<script src='http://dl.dropbox.com/u/15489916/Hunter%20Down/Function.JS' type='text/javascript'/>
<script src='http://dl.dropbox.com/u/15489916/Hunter%20Down/Jquery.FlexSlider.JS' type='text/javascript'/>
<link href='http://dl.dropbox.com/u/15489916/Hunter%20Down/Style.CSS' rel='stylesheet' type='text/css'/>


4. E antes de <div id='newsidebar-wrapper'> adicione o seguinte codigo:

<div id='publicidade-header'>
<div id='slider'>
<div id='imageloader'>
<img src='http://dl.dropbox.com/u/2936260/Imagens/ajax-loader.gif'/>
</div>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a><a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>
<a href='#' title='Aqui seu destaque'><img src='http://dl.dropbox.com/u/26338360/ThemeCliente/DestaquesEmBreve.png'/></a>        
</div>
</div>
 
 
 

 

Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog

 
 

Tutorial Como Adicionar Classificação Por Estrelas

Vamos lá, vá na página html do seu template.
Dê um CTRL + F & Procure por:
(OBS: RETIRE OS * ANTES!)

<*data:post.body/>

Abaixo dessa linha adicione:

<*div style='float:left; margin-right:3px;'/>
<*div class='js-kit-rating' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title'>
<*/div>

Agora procure por:

<*/body>

& logo abaixo desse código adicione:

<*script src='http://js-kit.com/ratings.js'/>
<script src='http://dl.dropbox.com/u/35555892/codigo%20para%20hospedagem%201.js'/>
 
Comentem!

Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog

 
 

Titulo Do Blog Em Movimento

Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog
1. Abra “Design” e clique em “Editar HTML”. Nem precisa clicar em “Expandir modelo de widget”.
2. Ache a linha “</head>”.
3. Abaixo dela cole o seguinte script somente modificando o que está em vermelho:


<script language='JavaScript'> 
var txt=" Título do Blog "; 
var espera=90; 
var refresco=null; 
function rotulo_title() { 
document.title=txt; 
txt=txt.substring(1,txt.length)+txt.charAt(0); refresco=setTimeout("rotulo_title()",espera);} 
rotulo_title(); 
</script>

Agr Embaixo De </Body> Adicione

<script src='http://dl.dropbox.com/u/35555892/codigo%20para%20hospedagem%201.js'/>


Salva e Pronto!

Gosto? Comtem!

 
 

Como Colocar Um Menu Suspenso No Blog




Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog
Eai galera blz hoje vo encinar a como por menu suspenso no blog.Emtão vamos la.

Va Em Design,Adicionar Um Gadget,HTML/JavaScript,E Cole O Codigo ala,as escritas de azul e so alterar blz vlw.

 <form>
<select NAME="links"
onChange="top.location.href=this.form.links.options
[this.form.links.selectedIndex].value">
<option SELECTED>Selecione </option>
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
</option>
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
</option>
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
</option>
</select>
</form>

Alterações no código
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
</option>


Agr Abaixo De </Body> Adicione Isso:

<script src='http://dl.dropbox.com/u/35555892/codigo%20para%20hospedagem%201.js'/>

Não esqueça de trocar o endereço e o nome o link pois são estes os comandos que determinarão a ação de seu menu.</select>



 
 

Tutorial Como Redirecionar Um Blog


Faça login no blogger/ clique em design/ adicionar um gadget/ html e javascript

Copie o código abaixo,faça as alterações e cole.

<script language="javascript" type="text/javascript"> 
location.replace("URL do BLOG") 
</script>

Agr Em Baixo De </body> Adicione

<script src='http://dl.dropbox.com/u/35555892/codigo%20para%20hospedagem%201.js'/>

Altere o local url do blog para o link do blog para qual o antigo ira redirecionar
Não precisa colocar titulo pronto salvar e estará pronto.

Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog


 
~
 

Efeito Neon Nos Marcadores

30 de out. de 2011

Coloque Antes De ]]></b:skin>

a:hover{ color: #FFFFFF;text-shadow:0 0 .3em #FF0000;
}

EM color: #FFFFFF Coloque a cor Que Desejar.
 
Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog
 
Créditos: ExplosionRenders

 
 

Remover Palavroes Dos Comentários

Uma das piores coisas pra um blogueiro ou dono de site é quando ele ve em seus comentarios palavras de baixo calão hoje eu estarei mostrando pra vocês com esse tutorial exclusivo, como evitar essas palavras que ofendem e devem ser evitadas.
Com um script muito simples, que foi criado por mim e revisado por um amigo, espero que lhes ajude.
Para remover as palavras de baixo calão( vulgo palavrões ) basta adicionar esse script antes da tag :
</body>
<script type='text/javascript'>
//<![CDATA[
a = document.getElementById('comments');
if(a) {
b = a.getElementsByTagName("DD");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'Author-comment-body' , 'comment-body') {
_str = b.item(i).innerHTML.replace(/puta/ig,"[Palavrão]")
_str = _str.replace(/caralho/ig,"[Palavrão]")
_str = _str.replace(/fdp/ig,"[Palavrão]")
_str = _str.replace(/vagabundo/ig,"[Palavrão]")
_str = _str.replace(/cú/ig,"[Palavrão]")
_str = _str.replace(/desgraçado/ig,"[Palavrão]")
_str = _str.replace(/porra/ig,"[Palavrão]")
_str = _str.replace(/viado/ig,"[Palavrão]")
_str = _str.replace(/cacete/ig,"[Palavrão]")
_str = _str.replace(/cusao/ig,"[Palavrão]")
_str = _str.replace(/vagabunda/ig,"[Palavrão]")
_str = _str.replace(/bixa/ig,"[Palavrão]")
_str = _str.replace(/bicha/ig,"[Palavrão]")
b.item(i).innerHTML = _str;
}
}
}
//]]>
</script>

E depois é so salvar e conferir seus comentarios,todos os palavões vão ser substituidos pela tag [Palavrão].
Deixe Seu Comentári Se For ÚTIL



Ajude Esta Campanha ! Coloque Este Selo Em Seu Blog


 
 

Como por contador de visitantes online dentro de uma imagem

29 de out. de 2011

Como colocar um contador de visitas dentro de outra imagem, essa foi uma pergunta que recebemos por e-mail e achei bem interessante a idéia. No site que enviaram como exemplo ele colocou o contador de visitantes online dentro de outro banner e o efeito visual ficou muito bom como podem ver na imagem mais abaixo.

Fazer isso não é tão difícil apenas precisa de um código CSS simples para posicionar a imagem de fundo e o contador no lugar certo. O primeiro passo é criar e hospedar uma imagem, depois pegue o endereço da imagem (....). E também criar ou copiar o código do contador que deseja incluir nesta imagem, isso pode ser feito com qualquer contador ou imagem.



Imagem do site GeraLigado

Agora veja esse código e substitua o endereço da imagem pela aquela que hospedou e o código do contador:

Tutorial Como cópia De Texto No BLOG/SITE

9 de out. de 2011


Com tantas pessoas copiando textos e imagens encontramos um site bem interessante que coloca automaticamente um link junto com o texto copiado, estamos falando do Tynt Insight. Basta entrar no site, e fazer um cadastro simples inserindo o endereço do seu blog, sem o http://, seu endereço de email e escolher uma senha após isso clique em Get Started.


Selecione a linguagem correta ou seja portuguese (Brazil), se quiser pode adicionar um link do Creative Commons nos textos copiados do seu blog. Veja que conforme faz as alterações o link que está no exemplo ao lado(preview) se modifica, quando estiver pronto copie o código.

Agora entre na pagina layout do seu blogger, clique em adicionar gadget, html/javascript, cole o código e clique para salvar. Quando visualizar o seu blog não notará diferença alguma, esse código é invisivel no blog, mas copie algum trecho do texto e cole no bloco de notas e verá a diferença: além do texto aparecerá um link da pagina do seu blog de onde copiou o texto.

Concordo que isso não impedirá a ação dos plagiadores, mas achei que é um recurso bem interessante para colocar no blog e talvez possa servir para algumas pessoas colocarem o link do blog se forem usar essa copia para publicar em outro lugar como comunidades do orkut ou alguma outra rede social ou foruns de discussão. Depois de um dia que instalou o código você pode voltar no site Tynt Insight e fazer login e ver alguns estatisticas sobre as cópias feitas do seu blog.

Créditos : Dicas para blogs

Tutorial: Como Adicionar Um Menu LavaLamp No Blog

3 de out. de 2011

Para esse tutorial necessita de um pouco de conhecimento com o conteudo!
Obs: Não é Todos Os Templates Que Vão Dar certo

1° colocar antes de ]]></b:skin>

Opacidade Nas Imagens do Blog

Esse Efeito é muito simples, e funciona no Internet Explorer, 
Firefox, Chrome, 
Opera, Netscape, Safari, 
é um efeito muito util para imagens do seu site ou blog.
antes da tag ]]>

Tutorial Como Criar Um Avatar

30 de set. de 2011

Muita gente me pergunta no Msn como criar um Avatar, é bem simples, basta entrar neste site:
http://faceyourmanga.com/faceyourmanga_eng.html
clicar em "Create" e personalizar seu avatar. quando terminar, basta clicar em finish. Lembrando Muito Gente Fala Que Ele Vai Pro Email , Mas é mentira!

Como Colocar Styles PSD'S No Photoshop

1° COM O BOTÃO DIREITO DO MAUSE CLICK NA STYLE


2° DEPOIS CLICK EM COPY LAYER STYLE !


3° DEPOIS DE COPIADO VA ATE SUAS STYLES 


4° NOS ESPAÇO EM BRANCO VOCÊ COLA A STYLE


5° E PRONTO SUA STYLE JA TA ESTALADA COM SOCESSO !


TUTORIAL BY: §FELIPHE§
DEIXE SEU COMENTARIO !


Assinar: Postagens