0

Se você utiliza programas como ADSENSE, Buscapé Afiliados
ou MercadoSócio em seu Site/Blog, leia abaixo...

Você pode estar perdendo MUITO dinheiro!
A Prime Cursos do Brasil (CNPJ 09.408.027/0001-92) tem o orgulho de apresentar seu programa de pagamento de comissões por venda AfiliadosPrime, que paga a maior comissão Brasil (até 50% dos lucros sobre cada venda).

Ao participar do programa AfiliadosPrime, você estará trabalhando apenas com produtos de grande procura no Brasil e com ótimos preços o que garante grandes chances de conversões para seu site.

Divulgando os produtos através de banners em seu site, você poderá ganhar até R$ 10,00 reais em comissões por cada venda.

Como participar?

Participar do Programa AfiliadosPrime é simples. Basta preencher o formulário com todos os seus dados pessoais e de seu site/blog e nos enviar solicitando o cadastro em nosso programa.

A aprovação de seu cadastro é automática, e após ser aprovado, você irá receber de nossa equipe uma senha para acessar seu painel de afiliado, no qual você terá acesso a todas as informações referente sua conta de afiliado, banners, links úteis, dados para pagamento etc.

Faça seu cadastro agora mesmo, clicando aqui!

Como Ganhar Dinheiro com Blog

3

Efeitos animados

É possível animar alguns textos com efeitos especiais de formatação, sempre diretamente no código fonte.

É importante notar que recursos de animação devem ser utilizados com cuidado e parcimônia, pois em uma página que já apresenta vários motivos que chamam a atenção do leitor (figuras, cores, fontes) os efeitos animados são mais um deles, e seu uso pode ocasionar um resultado final cansativo e confuso.

Blink

A formatação Blink permite que um certo texto fique piscando em uma página, como no exemplo abaixo, centralizado e em amarelo. Pode-se aplicar outros formatos como cores, negrito, italic e alterar a fonte e o seu tamanho, normalmente.

O código é: <blink>Texto que deve piscar</blink>

Novo!
Exemplo 1: Acima foi utilizado:

<center><font
color=#FFFF00><blink>Novo!</blink></font></center>

Exemplo 2: Segue um código para a o texto aparecer em azul "Deep Sky Blue" e em negrito: <font
color=#00BFFF><b><blink>Novo!</b></blink></font>

Novo!

É recomendável que o comando blink seja usado somente em pequenos detalhes (palavras ou setas), mas não em grande número na mesma página, pois gera muito cansaço visual.

Deve-se ressaltar que nem todos os navegadores mostram o efeito dessa formatação.

Marquee

Um texto pode entrar na página e percorrê-la da direita para a esquerda ou em sentido contrário, como um letreiro. Isso é obtido usando-se a formatação Marquee.

O código é: <marquee>Texto que deve se movimentar</marquee>.

Esse comando admite atributos de direção e largura do efeito as quais possibilitam várias formas de apresentação.

Também pode-se aplicar cores, negrito, italic e alterar a fonte e o seu tamanho, normalmente.

O deslocamento pode ser só da direita para a esquerda:

Tô nem aí!
Exemplo 3: Acima foi utilizado: Tô nem aí!

Pode ser utilizada uma imagem:

Acima foi utilizado:

O atributo behavior="alternate" faz com que o elemento movimentado vá e volte.

Exemplo 4: Veja um exemplo de uso do tag Marquee com uma foto grande, clicando aqui.

Outros exemplos:

1. Interferindo na direção:

a. Da esquerda para a direita. O atributo slide direction="right" faz com que o elemento siga para a direita.

Elemento que se movimenta

A gente somos inútil
Exemplo 5: Acima foi utilizado: A gente somos inútil!

b. Da direita para a esquerda. O atributo slide direction="left" faz com que o elemento siga para a esquerda.

Elemento que se movimenta
Por isso corro demais: só pra te ver, meu bem!

Exemplo 6: Acima foi utilizado: Por
isso corro demais: só pra te ver, meu bem!

2. Interferindo na velocidade:

A especificação scrollDelay=um número indica a velocidade da rolagem: quanto menor for o número, mais rapidamente o texto corre. Exemplos:

Exemplo 7: Acima foi utilizado:

Exemplo 8: Acima foi utilizado:

Se o que vai se movimentar é um texto evidentemente ele pode ser formado: Cor, tipo e tamanhos de fonte etc.

Tomara que você volte depressa!
Acima foi utilizado: Tomara que você volte depressa!

3. Interferindo no sentido:

A especificação direction=up faz com que o texto fique na vertical. Nesse caso foi também centralizado e aparece na cor lilás (MediumSlateBlue). Exemplo:

Subindo!
Exemplo 9: Acima foi utilizado:

Subindo!
Fonte: Efeitos Animados

Efeitos animados

1

Para colocar os comentários recentes do seu blog na sidebar a vista para todos, basta copiar o seguinte código:

<div><span style="font-weight: bold; color: #666666;"><span style="color: #666666;"></span>
<script style="" src="http://blogergadgets.googlecode.com/files/recentcommentswidgetv1.js"></script><script style="">var a_rc=2;var m_rc=false;var n_rc=true;var o_rc=50;</script><script src="http://Seu-blog-aqui.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
</div></span></div>

O código está programado para mostrar os 2 comentários mais recentes! Se quiser diminuir ou aumentar essa quantidade, encontre o 2 e coloque o número que desejas.

Agora faça login do blogger, entre em "Layout" -> "Modelo" -> "Elementos da página" -> "Adicionar um elemento de página".

Agora escolha a opção "HTML/JavaScript" e clique em "Adicionar ao blog".

Cole todo o códigos acima com as alterações seguida abaixo.
Salve e pronto!
Para trocar as cores do texto troque os numeros (666666) pela cor que você desejar, no caso se seu blog é com o fundo preto
Troque por (ffffff) ou visite nossa tabela de cor html e escolha a cor desejada.

var a_rc=2;var: nesse trecho dentro do código você define a quantidade de comentários a ser exibido troque apenas o numero pelo qual você deseja qual seja a quantidade de comentáios a ser exibido.

http://Seu-blog-aqui.blogspot.com : nesse trecho dentro dos códigos troque pelo o endereço de seu blog.
Depois de tudo feito apenas click em salvar e pronto!

Comentários recentes no blog

4

Hoje, eu vou ensinar como adicionar um balão de comentário ao lado de cada título do post em blogs do Blogger. Normalmente em modelos padrão do Blogger ou o tema que estou usando para o meu blog, você pode ver o número de comentários abaixo o título do post é da seguinte forma: 3 comentários. Mas, para torná-la mais profissional podemos usar uma imagem de um balão de comentário onde o número comentário é mostrado dentro de uma "imagem", como mostrado na imagem ao lado.

Antes de começar a editar o seu modelo salve um backup do seu template. Após isso, siga esses passos simples abaixo.

1. Ir para Layout> Edit> Clique em HTML em "Expandir modelos de widgets"

2. Procure por esse código no seu CSS. Encontra-se geralmente no final da seção CSS.

]]></b:skin>

3. Substitua esse o código com o código abaixo.

/*------Commment Bubble Start------*/
.comment-bubble {
float : right;
width : 48px;
height : 48px;
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6xaGpiyyV7QSK_P36Ohyfnph4fCOGe5YTzYge9OwEzBl-xR6XuR_QmLyDV5a20T1xjw5I3lz8wGIfTP25Edm0GJCl-34kCrordNb3_cPHK0wC_pTGd8578FHrwGh4HMjl5itW98Fp5wA6/) no-repeat;
font-size : 18px;
margin-top : -15px;
margin-right : 2px;
text-align : center;
padding:0px 0px 0px 0px;
}
/*------Commment Bubble End ------*/

]]></b:skin>

4. Agora, procure por esse código tecle F3 para localizá-lo mais rápido

<h3 class='post-title entry-title'>

5. Imediatamente a após à entry-title'> class='post-title

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

<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>

</b:if>

E agora o código editado será parecido com este com este abaixo.

<b:includable id='post' var='post'>

<div class='post hentry uncustomized-post-template'>

<a expr:name='data:post.id'/>

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

<h3 class='post-title entry-title'><b:if cond='data:post.allowComments'>

<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

E está feito. Clique em salvar modelo.

Se você não gosta da bolha padrão que eu forneci, você pode usar o seu próprio. Tudo que você precisa fazer é apenas substituir a fonte de link da imagem (cor vermelha em CSS) e ajustar a largura e altura (cor azul em CSS) da bolha em conformidade. Se você não sabe fazer isso, você pode deixar um comentário abaixo deste post ou me envie um e-mail. Vou responder à sua pergunta dentro de 24 horas.

Como adicionar um balão de comentário ao lado título do post (posição) no Blogger blogspot blog /?

0

Está desenvolvendo um site ou sistema e precisa de um logotipo para a nova marca? Se você não está habituado com as ferramentas de criação de logotipos convencionais ou então não está disposto a desenvolver algo complexo, pode tentar alguma ferramenta mais simples, e, por que não, online? O LogoEase é um serviço online que disponibiliza uma série de recursos para desenvolvimento de logotipos. Seu diferencial é a simplicidade e interface intuitíva. Basta selecionar a imagem, avançar e escolher as fontes e cores para o texto desejado. O LogoEase não exige cadastro e é gratuíto, porém, para que a função “salvar” torne-se disponível, o usuário deverá fazer o cadastro, também gratuíto. Vale a pena dar uma olhada.

logoease

Site: http://www.logoease.com

Veja também!

Ótimo para criar textos em 3D
Xara

Para os que desejam um logotipo simples, mas que esteja na moda web 2.0.
Logocreator

Logoease
Ótimo site com para desenhar logos, já vem com objetos prédefinidos. Podemos editar cores, fonte, tamanho. Não se compara a um editor de imagens profissional, mas pela web tá valendo.

OnlineLogoMaker

Permite incluir imagens, textos, símbolos e cores para sua logomarca.
Online
Logo Maker

Fonte: http://br.wwwhatsnew.com/2009/09/programas-para-desenhar-logomarcas/

Como criar Logotipos online, simples e rápido

2

Facebook surgiu com um novo conjunto de plugins Social que lhe permitem fornecer experiências envolventes social para seus usuários com apenas uma linha de HTML. O Facebook Like Botão é um deles. O Facebook botão permitirá seus leitores compartilhar rapidamente suas mensagens com seus amigos no Facebook. Você pode também ficar a conhecendo quantas pessoas gostaram de seu blog.
Para implantar em seu blog:

1. Entre na sua conta do Blogger e navegue até Layout> Editar HTML e Expandir Widget seus modelos.

2. Procure por <data:post.body/> e imediatamente depois colocar o seguinte código.

<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>

3. Salve o modelo e você verá o botão abaixo de cada um de seus posts.

Facebook Like botão de Recomendações para o blogger

1

Ai gente vai uma curta é o poço dos desejos é bem legal essa, que pena que não é real!

via Humor tadela

Poço dos desejos

8

Sempre gostei muito dos recursos criado pelo Pro Blogger Abu Farhan, que com certeza é um dos mais dedicados a desenvolver novos scripts e inovações que sempre enaltece a plataforma do blogger positivamente, e gostaria de compartilhar um recurso que sempre gostei e até estou usando aqui mesmo no Tudo De Blog e que já usei em outros blogs.

Esse recurso é um hacks, que exibe as "Postagens recentes aleatória", muito atrativo e de fácil implantação nem é preciso mexer em seu código fonte, apenas colocar o endereço de seu blog, posta-lo dentro de um Html-java-script e salvar.

Para implantá-lo segue os passos a seguir:

1. Entre na sua conta do Blogger e navegue até Layout> escolhe a coluna onde você deseja colocar, click em adicionar um Gadget vai abrir uma janela pop-Up selecione a opção HTML/JavaScript adicionar funcionalidade de terceiros ou outro código a seu blog.

2. Copie o código abaixo .

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">

</style>

<script language='JavaScript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://Seu-blog-aqui.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

E cole dentro do HTML-JAVASCRISPT, salve e visualize e confira o resultado.
você pode alterar:
numposts = 10, você pode decidir quantos post a ser exibido.
largura
width: 220px;
width: 208px:
Personalizar com base em seu modelo de acordo com a largura da side bar.

É isso ai Thanks to Abu Farhan, por esse maravilhoso recurso!

Postagens recentes aleatória

4

Como todo blogueiro , tenho certeza que todo blogueiro quer saber quantas vezes seu post novo foi visto.
Existe uma maneira de identificar quais são os artigos de seu blog que mais recebe cliques é a análise das visitas por postagem.
Para que isso seja possivel vamos usar um hacks, que possibilita esse recurso no blogger que peguei de um tutorial do Allblogstools, esse recurso informa quantos cliques que cada postagem recebe e muito facíl de implanta-lo.
Click aqui para ver um demo

Então vamos lá!

1 Acesse o painel de Layout ==> Editar HTML;

2 Salve uma cópia de seu template;

3 Clique para marcar a caixinha "Expandir Modelos de Widgtes;

4 Localize o código do post-header-line-1

<div class='post-header-line-1'/>
</div>

Caso se você não encontrar o código acima em seu modelo, tente encontrar o seguinte:

<data:post.body/>

No caso de data:post.body; o código tem que ser colado antes dele!

E logo após , cole o código do widget que segue abaixo:

<b:if cond='data:blog.pageType == "item"'><div align='center' style='border:solid 2px #999999; padding:2px; margin:2px; width:100px; display:compact'><img height='16' src='http://forums.bit-tech.net/images-light/misc/stats.gif' width='16'/> <a href='http://www.tudodeblog.com'><b><font size='2'><script src='http://nirav07.ulmb.com/counter.php' type='text/javascript'/> Views</font></b></a></div></b:if>

Salve o seu template e pronto você tera um contador de cliques por postagem integrado em seus posts.

Contador de cliques por postagens

5

Para quem gosta de responder seus comentários dentro de seu próprio blog, essa dica é ótima por destacar o comentário do autor da postagem em relação com os comentários postados pelos leitores.
Então vamos lá para mais um tutorial sobre a area de comentários do blogger.

1.Faça login no Blogger

2.Vá para Layout->Editar HTML-> marque a caixinha Expandir modelos de Widget

Lembre-se de salvar uma Cópia do modelo (basta clicar em "Baixar o modelo completo" e depois selecionar o local que deseja salvar ).

3.Procure pelo seguinte trecho utilizando as teclas Ctrl e F:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>

Agora insira o código seguinte abaixo do código acima:

<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<p><data:comment.body/></p>
</dd>
<b:else/>

4.Agora procure pelo código abaixo:

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>

E insira o código seguinte abaixo do código acima:

</b:if>

5.Agora vamos alterar a CSS do Blog, procure pelo código seguinte:

.blog-author-comment {
margin:.25em 0 0;
}
.blog-author-comment p {
margin:0 0 .75em;
padding:5px 10px;
border:1px dotted #254117;
background:#C3FDB8;
}

6.Salve as alterações e confira o resultado, e boa sorte !!!

Destacando os comentários do autor

1

* Template com resumos automáticos de postagens com miniatura da imagem utilizada no post;
* Menu horizontal para lista de links ou gadget Páginas;
* Widgets fixas de imagens abaixo do cabeçalho que se revezam nas páginas internas;
* Artigos Relacionados abaixo dos posts;
* Possibilidade de alterar todas as cores do template através do Painel Fontes e Cores. Você pode criar uma combinação única de cores para seu layout.

Demo	Click aqui para Demo teste
Instruções	instruções
Designer	Autor tnb
Download	Boa Forma Blogger Template (13.5 KiB, 106 hits)

Template Boa Forma

4

Torne o seu Blog disponível em outros idiomas instantaneamente, com tradutor completo do Google.

Adicione o tradutor de sites do Google às suas páginas da web e ofereça acesso instantâneo a traduções automáticas dessas páginas. É rápido e fácil. Veja como fazer:

1. Entre na sua conta do Blogger e navegue até Layout> escolhe a coluna onde você deseja colocar, click em adicionar um Gadget vai abrir uma janela pop-Up selecione a opção HTML/JavaScript adicionar funcionalidade de terceiros ou outro código a seu blog.

2. Copie o código abaixo .

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'pt',
includedLanguages: 'de,zh-TW,es,fr,en,ja,ru'
}, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

Cole o código dentro do Java script, salve e pronto você tera um tradutor completo em seu blog..!

Tradutor completo para Blog

6

Adicionando Bookmarks no Blogger

Para uma postagem ser divulgda de uma forma mais abrangente, é necessário que ela seja divulgada em todas ou na maior parte das redes sociais. Para que isso aconteça existi um hacks que chama Bookmarks, e com este hacks que seu leitor vai te ajudar a divulgar seu post nas redes sociais mais conhecidas.

Bookmarks no rodapé da postagem faz com que você ganha muitas visitas em pouco tempo pois se você apenas publicar uma postagem, como alguém saberá que publicou? Por isso é importante a divulgação para inserir no seu blog veja o tutorial abaixo:

1.Acesse o painel do Blogger (blogger.com)
2.Vá em "Layout"->"Editar HTML"->Marque a caixa "Expandir Modelos de Widgets"
3.Utilize as teclas Ctrl e F para procurar o seguinte código:

<div class='post-footer-line post-footer-line-3'/>

Se você não encontrar pesquise por este:

<div class='post-footer-line post-footer-line-1'/>

4.Adicione o código seguinte abaixo do código anterior:

<style type='text/css'>
.bookmark img { border: 0;
padding:0px; }
.bookmark a:hover {
position: relative;
top: 1px;
left: 1px; }
</style><span class='bookmark'><table align='left' border='0' cellpadding='0' width='100%'><tr><td style='vertical-align:middle' valign='middle' width='30%'><div expr:id='"sbtxt"+data:post.id'>Marcar esata postagem:<span style='display:none'><a href='http://www.bloggerplugins.org'>blogger widgets</a> <a href='http://www.bloggerplugins.org/2007/09/social-bookmarking-elements-after-each.html'>Social Bookmarking Blogger Widget</a></span></div><script type='text/javascript'>showsbtextundefined"sbtxt" + "<data:post.id/>",0)</script></td><td><a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",19);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8aNm05XjgyPJBrqboLbm40URaDaGMluue0pkBJNabLwmZdxhBUsvVfF4mrcjxiN17-xiujJ-l6B4VVOkzg7twaP56inFm4JEkisRaqLW9VC5dDMtmdHrBRDsutGgkbqVRu6CLlpoGIkg/?imgmax=800'/></a> <a expr:href='"http://digg.com/submit?phase=3&url=" + data:post.url' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",1);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS49kCDAwJLipQ2D-icWtU9KOaS9bbRsubuuzE04Kqu_DxlO3u9bGhv13vu9zOtZWKKV_WYEqvGXVvqmzo1-37OomykLgnRFw2zyhxB5fx-dgT0qeHmwnYYGvWjZj3PVoRiYwlQYsJ43g/?imgmax=800'/></a> <a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",2);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6_y5P1WBsANnylX17hbuDEGqWdShku1ygOqeULRUvYgi0upqAcBQ7eMmToJXN1teSrKiFZY24Hacm9FZhwSkPGCkAhGwPD1mCkv70uCZiXNiuHEHLDB31NdSw2fTxuPiYVtrDPXPqNz8/?imgmax=800'/></a> <a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&Description=&Url=" + data:post.url + "&Title=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",3);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtJfhwKcjQNsP25vz7oDaActTsaBPSRaO6m74VRRtnS_k8FCn1y59PFjATPJ-ixHVDKHA6EGfiwBi6vjfZUAczE1DAvW0fFrQ9WflKazH9XH7RDhWGDfa51VJ_U0T9AaDkf4eFNfbtBj4/?imgmax=800'/></a> <a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",4);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjog2AjSU3Z5G8hyretiMnaXHR3NTeHvGoHAAZMuo-XXV2Dn_72X-XxjeRqJrrqIX7rKHplyp_MhV3HIEWHNVzvxMoakMDPa1XneaLo0rcljk2eZ8obCYTLNGw8obMi06aXFQKvieYgmwc/?imgmax=800'/></a> <a expr:href='"http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&t=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",8);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKZGUmuC7M5mufclYz53UoIKT7VP9wv2UMleTE9cuxmJklo74xMP00F3lcjGBUNs5eHQRscZ1FCMA8p1vX_Vypw-3fDXmO4LuFi8iCAUJk6OBcwGESdaOP5DF7hY3ycLEsfCeuKD1TNtA/?imgmax=800'/></a> <a expr:href='"http://www.technorati.com/cosmos/search.html?url=" + data:post.url' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",9);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLWcOswj29EkNLoxCJmU8OGGA4TrWsfXn4-xMCk0kR87oub6U_Taoe0etCP1xTucev6bWUmUT55wl7KdW1tY3XrShl56_1O8UH11X1dUOyxblc5Vioa8JF6QJq1zx3hgoVtwzeKUSbaoY/?imgmax=800'/></a> <a expr:href='"http://www.simpy.com/simpy/LinkAdd.do?href=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",10);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5rp77sorLfpU1FEdHVkyF8aUBwdJUIDe2lzPDuawHnIQmAvNnXNRRfYKxc5mBAhwVAljiGNPqgZgT48sKzoubN_SeBc3o4APnsV9nlYBVPKTmxbdUbhiTAoRRJFYKNimZA8W-Q_7L6b4/?imgmax=800'/></a> <a expr:href='"http://www.spurl.net/spurl.php?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",11);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibmKMq7avIJbHkXoypCAeuLuoSv3sS1noVKEfOK-EOOHoTTvHERdOHFI9ztPcdL3TPJqzolLbdEB9dW7flER4ejJ5uFo60Jj-0dPOw12UmKXSp8inMe-2rezYmjiqJt27jOsLfGn9A6Xw/?imgmax=800'/></a> <a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",17);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7NdYi7vm5TFcp7nNhU8hWzRH7i42WmrGfVMF8nogUUrzBFrvUE1BZagW7RJRenS4cKsEXU5yzOWoFx1r2vVG-ZeNZtmq0jyK4vswx77PsT14svNruGje2ftKR8MdyOvArEJsP-YXM76c/?imgmax=800'/></a><a expr:href='"http://tools.bloggerplugins.org/twitter.php?url=" + data:post.url + "&title="+data:post.title' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",21);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-wi0RL5vdI1518lVK3Ow2YWJQP2IqMFAW-qAx83InkLXrcUL16F2UwM6mv2q5msF4Kli7m-Up_gsh061ugXUCJRW3L_GXEt8F85wq4EvhJSpmPE6J-UUcWW0TARQp4uqdMo4NTYi42KY/?imgmax=800'/></a> <a expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url' expr:onmouseout='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtextundefined\"sbtxt" + data:post.id + "\",22);"' target='_blank'><img class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PWgZRHBR8EMbRGlITl3BmLohhtlxG30GPuJiJHepVy22Q2F9FQvFPlgZ5eaeYBtFuSA5RqsbncpcC_ZjI3SaMpNRatEz5H43tkKlDm8R4fx8Z1myHP3iqpzfQV0G0YkncX1Xh618njM/s400/fbicon.png'/></a>
</td>
</tr>
</table><br/>
</span>

Se você fez tudo direito o resultado será como no modelo abaixo:

Marcar esata postagem:

Tanks To Aneesh do Blogger Plugins por este maravilhoso Hacks

Adicionando Bookmarks no Blogger

0

HTML codificar online

Oque é isso?
Caráter codificador para HTML ferramenta pode ajudar você a mostrar os códigos de HTML para suas mensagens e comentários blogs.
Possivelmente já se deram conta que nos meus posts tenho necessidade de, muitas vezes, inserir código html.
Isso acontece sobretudo naqueles casos em que pretendo descrever a maneira de adicionar uma funcionalidade ao blog, mais um widget, enfim, tweakar um pouco o esquema do blogger.
Acontece que se inserimos directamente o código em html no corpo da mensagem, o compilador do blogger, quando vamos publicar o post, acusa erro pois ele está a tenatr interpretar aquelas linhas como código verdadeiro, que deve ser interpretado pelo browser, e não como código que queremos simplesmente publicar como "texto" então para que isso não aconteça é preciso codificar os caracteres.

O que ele faz é permitir que insiramos o código html normal e depois o codifiquemos para que fique numa forma tal que a sua inserção no meio do texto não seja interpretada como código real.

Exemplo. Se você postou esse código:
<body>
<p>Allblogtools.com</p>
</body>
Allblogtools.com

o navegador irá convertê-lo para
Allblogtools.com
Mas e se você quiser exibir esse código no seu post no mesmo formato,
apenas colá-lo na área da ferramenta de texto e clique em converter e copiar o código convertido, em seguida, adicione ao seu blog, então o seu browser e visitantes poderão vê-lo exatamente como você digitou.
Many Thanks to por gentilmente nos conceder essa ferramenta "Max" Allblogs Tools

Codificar HTML online

2

Esta página permite fazer a Conversão/Geração do Código de Cor HTML (em hexadecimal)
para R,G,B (em decimal) e vice-versa, assim como a visualização da cor.

Os dados podem ser entrados de diversas maneiras:

Posicionando as setas dos canais R, G, B no valor desejado (clique e arraste);

Entrando manualmente com os valores R, G, B nos campos texto correspondentes;

Entrando com o código HTML (Hexadecimal) no campo indicado com "#".

Gerador de Cores HTML

Gerador de Cores HTML

10

Personalizar Formulário de Comentários do Blogger!

Tutorial de hoje é a maior demanda e mais desejava, mas raramente respondidas na blogosfera. Para alguns designers personalizar o Blogger Formulário de comentário não é de alguma forma possível, enquanto para outros é complicado, mas a partir de hoje cada blogueiro vai realmente ser capaz de personalizar o formulário de comentário do Blogger, da melhor forma possível! Depois de algumas tentativas e erros que realmente conseguiu alterar a codificação do Blogger CSS oficial. Estamos felizes por ter trazido a você um tutorial que irá certamente permitir que você tenha um formulário personalizado comentar muito melhor do que o Wordpress, etc Typad Por favor, veja alguns exemplos abaixo:

Se você gostou desta nova descoberta! Vamos agora aprender a personalizar o formulário de comentário blogger / caixa para atender às suas preferências.

Adicionando um formulário para comentários personalizado para o seu Blog

Segui estes passos:

1. Vá para o Blogger> Layout> Edit HTML
2. Marque a caixa "Expandir modelos de widgets" no canto superior direito.
3. Procure o código abaixo, dica: - Pressione Ctrl + f

<div class='comment-form'>

4. Substitua este código com o código abaixo:

<div id='mbt-form'>

5. Agora procure por :]]></b:skin>

6. Logo antes de : ]]></b:skin> colar o código CSS abaixo:

#mbt-form iframe{
background:#ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1ewZSTFTcIa4fhYcGRyLxf5-yvFb4zU15JMl5kha3HiG-l3B1ht7BxDfAvrhy_2MIOIUMSUiFlKPoEUM3rhOXaCtzTzQwiassDzzn5kv5hncYAqrSAgeHHi66zv5q_cSA5F6MbtH2dfSD/s400/plz-do-not-spam1.gif) no-repeat bottom right;
border:7px solid #C7C7C7;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#7EB2AC;
width:450px;
}
#mbt-form iframe:hover{
background:#ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHW97Zv3sraWmKs5NdP2rkxe6wewn1-RtLl41gBQMeBdISCKaNAJyPqnGQ5chS2zgff6AvMK6tM83WMqkkaAwKEiF2x5hdHSPwz8PBvF2mTsmNej-6YLK6QyW39gRGLu8xkLyD0AfdIL45/s400/plz-do-not-spam2.gif)no-repeat bottom right;
border:7px solid #7EB2AC;
}
#mbt-form a{
color:#7EB2AC;
}

7. Salve o seu modelo e ver o seu blog para ver um toque diferente:>
Personalizar o Blogger Comentário formulário de acordo com o layout do seu Blog

Vamos agora discutir as áreas importantes no código CSS acima para ajudá-lo a personalizar o seu formulário de comentário do Blogger de acordo com suas preferências.

Há três áreas importantes, que são,

# iframe MBT-forma

# mbt iframe formulário: hover

# mbt em forma de um
Aqui estão os detalhes de cada seção

1. Personalização para o modo activo

# iframe MBT-forma

Esta parte é responsável pelo aparecimento da caixa de comentários activa quando o cursor do mouse não é pairava sobre ela. Ele inclui as propriedades de estilo a seguir,

background: Esta propriedade é responsável pela cor de fundo, imagem de fundo e posição da imagem de fundo. Onde,

* # Ffffff: Esta é a cor de fundo. Você pode mudá-lo, usando o nossoGerador de Croes HTML
* URL: Este é o URL para a imagem de fundo. Eu usei o bebê no presente caso. Você pode mudar essa imagem com qualquer coisa que você gosta.
* Canto inferior direito: Isto posiciona a imagem de fundo. Coloquei o bebê no canto inferior direito. Você pode posicionar a imagem na parte inferior direita ou da direita para a esquerda ou superior inferior ou superior esquerdo

border: Esta propriedade CSS define o tamanho da borda / largura, estilo e cor da caixa de comentário. Tenho definir esses valores para o formulário de comentário no modo ativo (e não o rato em cima),

* O tamanho da fronteira para 7px,
* Estilo de borda para sólido. Você pode escolher sólida, pontilhada, tracejada etc Veja esta página em estilos de borda
* A cor da borda para # C7C7C7. Utilize o nosso CSS Color Chart para usar uma cor diferente.

padding: Esta propriedade CSS é responsável pela distância / gap entre a fronteira formulário de comentário e sua área de texto. Você pode aumentar este valor se você deseja inserir uma imagem no canto superior direito ou no canto esquerdo superior do formulário.

font: Esta propriedade CSS define a ousadia, a família de fonte eo tamanho do texto. Tenho o seguinte para definir o texto "Comentários como:"

* Ousadia ao normal,
* O tamanho de 12pt
* Família de fonte a "ms sans serif". Se no caso o browser não tem o "MS Sans Serif" font então pus Arial como um backup.

color: Esta propriedade define a cor do texto "Comentário de:". Use uma tabela de cor html para mudar a cor do texto.

width: Esta propriedade define a largura do seu formulário de comentário. Você pode ver o comentário do do meu blog é mais amplo do que o normal, porque eu ter ajustado a sua largura. Defina a largura da sua forma de comentário um pouco menor que a largura do seu post. Você pode encontrar a sua largura post por encontrar o seguinte código em seu modelo (Edit HTML)

2. Personalização para Mouse Hover Mode

Agora vamos discutir as propriedades CSS para a aparência do formulário quando o cursor do mouse é pairava sobre ela.

# mbt iframe formulário: hover

Ele tem quase as mesmas explicações para o fundo ea borda, como discutimos anteriormente. A definição destas duas propriedades CSS terá efeito apenas a segunda imagem que aparece no foco do mouse.

3. Personalização para o link Cores

# mbt em forma de um

Esta parte define a cor dessas duas ligações -> "Sair" e "Assine por e-mail". Esses links aparecem no canto inferior direito de cada comentário Blogger formulário.

color: Define a cor do link. Definir uma cor de link como contraste com a cor de fundo.

Espero que este tutorial será de grande ajuda para blogueiros e designers. Pedimos a todos que gentilmente link de volta se você deseja compartilhar este tutorial exclusivo com seus leitores e amigos para o desenvolvedor do tutorial Bolgger Tricks. Agradecemos .

Personalizar Formulário de Comentários do Blogger!

0

Fashion Week Blogger Template

* Fashion Week é um lindo modelo para uso pessoal, em blogs feminino.
* Fashion Week Blogger Template
* Largura fixa, 2 lateral.
* Colorido, fundo vermelho.
* 3 coluna, direita, lateral esquerda

Demo	Click aqui para Demo test
Página instruções	Página instruções click aqui
Fonte e Autor do Designer	Autor
Download	Fashion Week Blogger Template (11.6 KiB, 10 hits)

Fashion Week Blogger Template

1

Como Otimizar o Título do Blog

Para você otimizar o título do seu blog, basta fazer uma pequena modificação, que irá inverter o título da postagem no Blog, ficando assim: Título da Postagem - Título do Blog.
Isso também facilita os buscadores a interpretar melhor o seu conteudo, e auxilia em uma melhor indexação.

Aqui está uma pequena dica para inverter o título do seu blog, veja um exemplo abaixo:

Faça login no Blogger, vá em Painel, clique em Layout --> Editar HTML

1. Procure por este código, ele fica bem no inicio :

<title><data:blog.pagetitle/></title>

2. Substitua o código acima por esse abaixo:

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> - <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

3. Salve o modelo, e pronto.

Como Otimizar o Título do Blog

Assinar: Postagens (Atom)