Coisinhas Para Blogss: Tutorias

Como Arredondar A Borda Das Imagens

Gente Arredondar A Borda Das Imagens é Super Simples ~~Apesar De Muitas Pessoas Não Acharem~~

Primeiro Vc Vai No CSS Do Seu Blog. Ai Vcs Me Perguntam:

Aonde Eu Vou Achar Esse Tal "Css"???

Tb é Super Simpes :)

Vá Em Layout, Ai Em Cima Vai Ta Escrito:

Adicione, remova e edite gadgets em seu blog. Clique e arraste para reorganizar os gadgets. Para alterar as colunas e larguras, use o Designer De Modelo <--- Clik Em Designer De Modelo, Ai Vc Vai Ver Escrito "Avançado" <--- Clik, Ai Vai Ta Escrito Várias Coisinhas Tipo Assim:

Rola Esse Negócio Pra Baixo. Ai A Última Coisa Que Vai Estar Escrito é "Adicionar CSS"

Clik Lá (Adicionar CSS) E Vai Abrir Isso:

Ai Dps é Só Colar Esse Código:

.post img {

-moz-border-radius: 10px;

-webkit-boder-radius: 10px;

border-radius: 10px;

}

Onde Eu Puis "10" é Só o Tamanho Da Borda. Se Vc Por Vai, 20 A Borda Vai Ficar Maior, Se Vc Por 5 Vai Ficar Menor :)

------------------------------------------------

Como Deixar O Link Em Efeito "Arco-Íris"

Para Deixar O Link Em Efeito Arco-Íris é Super Fácil :)

Copie O Seguinte Código:

<script src='http://dl.getdropbox.com/u/647003/CiudadBlogger/Scripts/rainbowlinks.js'/>

Agora Vá Em Designer>Layout>Adicionar Um GadGet>HTML/JavaScript

E Cole! Pronto :) Fácil Não?

------------------------------------------------

Como Por O Contador De Visitas

Primeiro Vá Em Designer>Layout>Adicionar Um GadGet>Estatísticas do blog

Super Fácil!!!

=====================================================

Como Por Efeito "Opacity" Nas Imagens

Vá no HTML do seu blog, aperte Ctrl + F e procure por:

]]></b:skin>

Depois que você achar, cole esse código ACIMA dele:

.main img {

filter:alpha(opacity=82);

-moz-opacity:0.82;

opacity:0.82;

}

.main img:hover {

filter:alpha(opacity=100);

-moz-opacity:1.0;

opacity:1.0;

duration: 50s;

}

Clique em vizualizar, e veja se as imagens estão 'apagadas'

Então, clique em salvar.

Não é facil? Demora 2 minutos no máximo *o*

Gente Olhem O Resultado:

Legal Né?

====================================================================

Como Por Comentários Personalizados

vá no seu HTML marque a opção expandir modelos de widgets pressione as teclas CTRL F e pesquise por: <class='post-title entry-title'>

Se não encontrar pesquise por: <b:includable id='post' var='post'>

Então coloque esse código logo abaixo, do código destacado (de laranja)

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

</b:if>

</span>

Ficando assim:

Alguns trechos editaveis e como trocar a imagem do balão Mini gif 161

Trocar a imagem do balão no trecho: (http://i.imgur.com/lfGb2.jpg) apague e coloque a URL da imagem desejada (só apague onde está grifado de azul)

Algumas imagens que eu fiz:

''Para pegar a URL de uma imagem é só clicar com o botão direito do mouse sobre ela e selecionar a opção COPIAR URL DA IMAGEM''

====================================================

Como Por Elite De Afiliados

Você vai abrir seu blog e vai em:

→ Design→Elementos da Página→e vc vai em Adicionar Um Gadget→Preocure por:HTML/JavaScript dê um clique.Para quem não tá intendo porque tem gente que ainda não sabe mecher muito nessas coisas.

Lembre-se de colocar o nome afiliados lá em cima no título!

Feito isso,cole o código abaixo:

<a href="ENDEREÇO-DO-BLOG"><img src="ENDEREÇO-DA-IMAGEM" title="TITULO DO BLOG" target="blank" /></a>

Vamo Editar?

01.Aonde tem Endereço do Blog,você vai apagar e vai colocar o endereço do blog que vai ser seu afiliado.

02.Endereço da Imagem,você vai apagar e substituir pela url da imagem que vai ficar nos seu afiliados sugiro que faça uma imagem de 50x50.

03.Título do Blog,você vai apagar e vai colocar o título do blog que vai ser seu afiliado.

Prontinho,agora é só salvar,e depois visualizar.

Afiliados,com nome do blog e gif ao lado:

Vá em:

→ Design>Elementos da Página>Adicionar um Gadget e procure por:

Texto,abaixo de html/javascript procure por Texto,dê um clique.

Escreva o nome do blog que vai ser seu afiliado e copie a url(link) do blog que vai ser seu afiliado.Após escrever o nome e ter copiado a url do blog que vai se afiliar clique aonde tem tipo uma circulo verde,que é criar link:

Você vai clicar e vai colar o link do blog que vai ser seu afiliado.

Após isso é só colocar o gif do lado do nome do blog,copie a url do gif em algum site.

E depois cole do lado esquerdo. Pronto,você faz todos que você quiser e depois você salva

========================================================

como colocar estrelinhas caindo do mouse com "efeito arco-íris"

1° copie o código enorme :

// <![CDATA[

function initCursor() {

if (document.getElementById) {

var i, rats, rlef, rdow;

for (var i=0; i<sparkles; i++) {

var rats=createDiv(3, 3);

rats.style.visibility="hidden";

document.body.appendChild(tiny[i]=rats);

starv[i]=0;

tinyv[i]=0;

var rats=createDiv(5, 5);

rats.style.backgroundColor="transparent";

rats.style.visibility="hidden";

var rlef=createDiv(1, 5);

var rdow=createDiv(5, 1);

rats.appendChild(rlef);

rats.appendChild(rdow);

rlef.style.top="2px";

rlef.style.left="0px";

rdow.style.top="0px";

rdow.style.left="2px";

document.body.appendChild(star[i]=rats);

}

set_width();

sparkle();

}}

var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")

var r=1

var g=1

var b=1

var seq=1

var sparkles = 35;

var x=ox=400;

var y=oy=300;

var swide=800;

var shigh=600;

var sleft=sdown=0;

var tiny=new Array();

var star=new Array();

var starv=new Array();

var starx=new Array();

var stary=new Array();

var tinyx=new Array();

var tinyy=new Array();

var tinyv=new Array();

function sparkle() {

var c;

if (x!=ox || y!=oy) {

ox=x;

oy=y;

for (c=0; c<sparkles; c++) if (!starv[c]) {

star[c].style.left=(starx[c]=x)+"px";

star[c].style.top=(stary[c]=y)+"px";

star[c].style.clip="rect(0px, 5px, 5px, 0px)";

star[c].style.visibility="visible";

starv[c]=50;

break;

}

for (c=0; c<sparkles; c++) {

if (starv[c]) update_star(c);

if (tinyv[c]) update_tiny(c);

}

setTimeout("sparkle()", 40);

}

function update_star(i) {

if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";

if (starv[i]) {

stary[i]+=1+Math.random()*3;

if (stary[i]<shigh+sdown) {

star[i].style.top=stary[i]+"px";

starx[i]+=(i%5-2)/5;

star[i].style.left=starx[i]+"px";

}

else {

star[i].style.visibility="hidden";

starv[i]=0;

return;

}

else {

tinyv[i]=50;

tiny[i].style.top=(tinyy[i]=stary[i])+"px";

tiny[i].style.left=(tinyx[i]=starx[i])+"px";

tiny[i].style.width="2px";

tiny[i].style.height="2px";

star[i].style.visibility="hidden";

tiny[i].style.visibility="visible"

}

function update_tiny(i) {

if (--tinyv[i]==25) {

tiny[i].style.width="1px";

tiny[i].style.height="1px";

}

if (tinyv[i]) {

tinyy[i]+=1+Math.random()*3;

if (tinyy[i]<shigh+sdown) {

tiny[i].style.top=tinyy[i]+"px";

tinyx[i]+=(i%5-2)/5;

tiny[i].style.left=tinyx[i]+"px";

}

else {

tiny[i].style.visibility="hidden";

tinyv[i]=0;

return;

}

else tiny[i].style.visibility="hidden";

}

document.onmousemove=mouse;

function mouse(e) {

set_scroll();

y=(e)?e.pageY:event.y+sdown;

x=(e)?e.pageX:event.x+sleft;

}

function set_scroll() {

if (typeof(self.pageYOffset)=="number") {

sdown=self.pageYOffset;

sleft=self.pageXOffset;

}

else if (document.body.scrollTop || document.body.scrollLeft) {

sdown=document.body.scrollTop;

sleft=document.body.scrollLeft;

}

else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {

sleft=document.documentElement.scrollLeft;

sdown=document.documentElement.scrollTop;

}

else {

sdown=0;

sleft=0;

}

window.onresize=set_width;

function set_width() {

if (typeof(self.innerWidth)=="number") {

swide=self.innerWidth;

shigh=self.innerHeight;

}

else if (document.documentElement && document.documentElement.clientWidth) {

swide=document.documentElement.clientWidth;

shigh=document.documentElement.clientHeight;

}

else if (document.body.clientWidth) {

swide=document.body.clientWidth;

shigh=document.body.clientHeight;

}

function createDiv(height, width) {

var div=document.createElement("div");

rainbow="#"+hex[r]+hex[g]+hex[b]

if (seq==6){

b--

if (b==0)

seq=1

}

if (seq==5){

r++

if (r==12)

seq=6

}

if (seq==4){

g--

if (g==0)

seq=5

}

if (seq==3){

b++

if (b==12)

seq=4

}

if (seq==2){

r--

if (r==0)

seq=3

}

if (seq==1){

g++

if (g==12)

seq=2

}

div.style.position="absolute";

div.style.height=height+"px";

div.style.width=width+"px";

div.style.overflow="hidden";

div.style.zIndex="10";

div.style.backgroundColor=rainbow;

return (div);

}

window.onload=function()

{

initCursor()

initImage()

startTime()

}

function initImage() {

imageId = 'menu'

image = document.getElementById(imageId);

setOpacity(image, 0);

image.style.visibility = "visible";

fadeIn(imageId,0);

}

function fadeIn(objId,opacity) {

if (document.getElementById) {

obj = document.getElementById(objId);

if (opacity <= 100) {

setOpacity(obj, opacity);

opacity += 10;

window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 120);

}

function setOpacity(obj, opacity) {

opacity = (opacity == 100)?99.999:opacity;

// IE/Win

obj.style.filter = "alpha(opacity:"+opacity+")";

// Safari<1.2, Konqueror

obj.style.KHTMLOpacity = opacity/100;

// Older Mozilla and Firefox

obj.style.MozOpacity = opacity/100;

// Safari 1.2, newer Firefox and Mozilla, CSS3

obj.style.opacity = opacity/100;

}

function changeNav(id) {

document.getElementById('content').innerHTML=document.getElementById(id).innerHTML;

document.getElementById('main').innerHTML=document.getElementById('home').innerHTML;

document.getElementById('rabbit').style.top="275px"

document.getElementById('penguin').style.top="532px"

}

function hidestatus(){

window.status=""

return true

}

// ]]>

</script>

if (window.jstiming) window.jstiming.load.tick('headEnd');

</script>

function setAttributeOnload(object, attribute, val) {

if(window.addEventListener) {

window.addEventListener("load",

function(){ object[attribute] = val; }, false);

} else {

window.attachEvent('onload', function(){ object[attribute] = val; });

}

function showRelatedContent(args) {

var el = document.getElementById('related-iframe');

if (el.parentNode.style.display != 'none') {

el.parentNode.style.display = 'none';

document.onclick = showRelatedContent.prevOnClick;

return;

}

var match = /(?:^[?]|&)c=([0-9]+)(?:&|(?!.))/.exec(args);

if (match !== null) {

document.getElementById('related-loading').style.left = match[1] + 'px';

el.style.left = Math.max(0, match[1] - parseInt(el.width) / 2) + 'px';

}

el.src = "http://www.essenciiaisparameninas.blogspot.com.br"

+ '/related-content.g?q='

+ window.location.href

+ '&id=' + "7792698363959436653";

el.parentNode.style.display = 'block';

showRelatedContent.prevOnClick = document.onclick;

// Hide related-content dropdown when clicking anywhere but on it.

document.onclick = function() {

var el = document.getElementById('related-iframe');

if (el.parentNode.style.display != 'none') {

el.parentNode.style.display = 'none';

}

document.onclick = showRelatedContent.prevOnClick;

};

}

</script></div></div>

2° Vá em design -> Adicionar Gadget -> HTML/JavaScript -> Cole o código enorme

(mais não coloque título )

=================================================================

Como Colocar "Mini Gif" No Título Do Post:

1-Vá em Designer > Editar html
2-Clique na opção: Expandir modelos de widget

3-Dê ctrl + F e procure por:
data:post.link'><data:post.title/></a>

4-Você vai encontrar o seguinte código:

<b:else/>

5-.Cole ao lado:<img src='Url do Gif ' style='vertical-align: middle;'/>

Onde Ta Escrito Url do Gif Cole O Url Do Gif (~~AVÁ~~)

Alguns Sites/Blogs Mini Gifs:

http://evelyns-place.com.br/mini-gifs/

http://educandocomcarinhoo.blogspot.com.br/2009/09/mini-gifs.html

http://cantinhoencantado.loveblog.com.br/r3288/8594-Mini-Gifs/

=============================================================

Como Por Blockquete

1- Vá em Design-> Editar HTML ->Aperte CTRL+F ou F3 e pesquise por: ]]></b:skin>
2- Coloque o código abaixo acima de ]]></b:skin> para ter um blockquote com este efeito:

Blockquete Personalizado Por Coisinhas Para Blogss

blockquote {
border: 1px solid #00BFFF; /* cor da borda */
background-color: #F8F8FF; /* cor de fundo */
padding: 10px;
font-size: 12px; /* tamanho da fonte */
color: #696969; /* cor da fonte */
text-align: justify;
-webkit-border-radius: 0px 9px 0px 9px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao bockquete acima */
box-shadow: -2px 4px 15px #ADD8E6; /*Sombra do bockquete/ coloque os quatro igual ou não irá conseguir fazer o efeito*/
-moz-box-shadow: -2px 2px 5px #ADD8E6; /*Sombra do bockquete/ coloque os quatro igual ou não irá conseguir fazer o efeito*/
-webkit-box-shadow: -2px 2px 5px #ADD8E6; /*Sombra do bockquete/ coloque os quatro igual ou não irá conseguir fazer o efeito*/
-khtml-box-shadow: -2px 2px 5px #ADD8E6; /*Sombra do bockquete/ coloque os quatro igual ou não irá conseguir fazer o efeito*/
}

Eu coloquei tudo explicadinho no código caso vocês queiram mudar as cores. É bem facil por né?

=======================================================

Como Por Afiliados Giratórios

1- Vá na aba de HTML do seu blog, aperte Ctrl + F, e procure por:

]]></b:skin>

2- E acima dessa tag, cole o seguinte código:

.afiliados {

box-shadow: 2px 1px 3px #909090;border-radius: 50px;-moz-border-radius: 50px;-webkit-border-radius: 50px;transition-duration: 3s;-moz-transition-duration: 3s;-webkit-transition-duration: 3s;}.afiliados:hover {transform: rotate(-360deg) scale(1) skew(0deg);-moz-transform: rotate(-360deg) scale(1) skew(0deg);-webkit-transform: rotate(-360deg) scale(1) skew(0deg);-o-transform: rotate(-360deg) scale(1) skew(0deg);}

3- Depois disso, salve e vá em Elementos da página. Lá, adicione um gadget Html/Javascript, e cole isso:

<center><a href=" Link do Blog" title="Nome do blog"><img src="Imagem aqui" class="afiliados"/></a>

4- Substitua o nome, o link e a imagem, e pronto! Salve!

==================================================================

Tutoooo: Como Colocar Os Comentários Para Serem Aprovados?

1. Vá No Designer Do Seu Blog

2.Clique Em Configurações No Canto Inferior Esquerdo

3. Clique Em Postagens e Comentários.

4. Ai Vai Aparecer Assim:

Fácil Não?

=========================================================

O Nome Do Blog Rolando Na Aba:

<--- Tipo Assim

Primeiro Vá Em Designer>Layout>Adicionar GadGet>HTML/JavaScript

E Cole Esse Código:

Aonde Está Escrito NOME Poem O Nome Do Seu Blog Ou Alguma Outra Coisa

==============================================================

Como Poem Xat No Blog?

Tudo Começa Aqui

Depois clique em widgets:

Ok depois disso aperte em free chat a box:

apareceu isso certo?:

Agora vc vai escolher a medida:

Depois q escolher a medida clique em "update e get code" !!!

Agora se quiser mudar de fundo clique em qual vc vai querer numa tabela q fica acima das medidas ^^

Nao quer usar nem um desses? Quer usar um q vc fez ? Então clique em "click for more or use your own" e se vc tiver photobucket vai aparecer todas as suas imagens da conta e vc podera usar uma delas ou se vc nao tiver crie um é bem simples *-* (depois ensino outra maneira ^^)

Continuando...

Um pouco la pra baixo vai ter o codigo para vc pegar:

Antes de pega-lo va em design-->adicionar um gadget-->HTML/javascript

=================================================================

Como Bloquear As Cópias Do Blog

Eis um código que pode usar no seu site ou blog para prevenir a cópia dos textos e imagens, ao desligar as funções do botão direito do Mouse. Coloque o mesmo depois da tag <head> e antes da tag </head>.

Código:

Atenção que este código não funciona no FireFox. Apenas funciona no Internet Explorer.

===============================================================

Tutorial Como Deixar Estrelinhas Caindo Do Mouse

Primeiro Vá Em Editar HMTL, e Procure Pela Tag </head>. Use F3 Para Ajudar

Copie Esse Lindo e Perfumado Código XD :

É Um Código Lindamente Grande Eu Sei XD...

Aonde Tá Escrito #FFC0CB É Só O Código a Cor :)

E Para Ver O Código Da Cor Eu Geralmente Vou:

Designer>Designer De Modelo>Avançado

========================================================

Vim Fazer O Tuto De Como Por Seta De Voltar Ao Topo :)

Bom Primeiro, Antes De Tudo Da Sua Vida, Vc Vai Precisar

De Uma Seta De Voltar Ao Topo (Avá!) De Sua Preferência.

Eu Escolhi A Do Kurto Muito Monster High <--- Créditos

Ai Vc Copia Esse Código:

div style='float:right;'>

</a>

</div> div style='float:right;'>

Dps Aonde Está Escrito: URL DA SETA Vc Cola O Url Da Imagem ^.^

Olhem:

Designer>Layout>Adicionar Um GadGet>HTML/JavaScript

Cole O Código Com O Url Da Imagem (Como Expliquei Em Cima) E Pronto!!!

==================================================================

Como Por O Contador De Visitas

Primeiro Vá Em Designer>Layout>Adicionar Um GadGet>Estatísticas do blog

Super Fácil!!!

================================================================

Deixar O Link Em Efeito Arco-Íris é Super Fácil :)

Copie O Seguinte Código:

<script src='http://dl.getdropbox.com/u/647003/CiudadBlogger/Scripts/rainbowlinks.js'/>

Agora Vá Em Designer>Layout>Adicionar Um GadGet>HTML/JavaScript

E Cole! Pronto :) Fácil Não?

============================================================

Tutorias

2 comentários: