Botão Postagem Aleatória e Flutuante - Dicadedica

Olá criei um botão para a distração dos leitores do seu blog, oferecendo uma postagem aleatória a cada click.

Para adicionar este widget é só clicar no botão "+Add ao meu blogger" e escolher o blog que quer colocar esse widget, se quiser remover posteriormente, é só entrar no painel de controle do blogger >> layout>>elementos de página> abrir o componete e clicar em remover.

Botão de postagens aleatórias

<div id="myLuckyPost" style='display:scroll;position:fixed;top:400px;right:5px;' ></div> <script type="text/javascript"> function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = '<img src="http://imj.tw/21w-full.gif" border="0" alt="Ver post Aleatório" title="Ver postagem aleatória"/>'; document.getElementById('myLuckyPost').appendChild(a); } </script> <script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky"></script><p><a href="http://www.dicadedica.blogspot.com/">+ Botão aleatório Dicadedica</a></p>

Script adaptado do blog: http://www.geekblogger.org/2009/12/show-random-posts-in-blogger-widget-for.html

Gerador de Botões Siga-me Flutuantes Dicadedica

Olá, Vocês devem ter reparado nos botões siga-me aqui do blogger ao lado direito da página, eles dão ao usuário o acesso as páginas do Twitter, Google Buzz e ao Rss do blog.

Para colocar esses botões flutuando com os links que vocês quiserem é só seguir os 3 passos:

1 - preencher o campo (1) com o endereço do seu link do twitter por exemplo
2 - Clicar em um dos botões do campo (3) correspondente ao link que você colocou.
3 - Na parte inferior desta página irá aparecer o código do widget campo (4), para você copiar e colar como elemento de pagina no seu blog.

Aproveite é grátis para quem mantém os créditos!!!!


Gerador de Botões Siga-me Flutuantes

Cole o endereço do link: Clique para gerar código widget:

Copie o código abaixo e add como um elemento de página no seu blog.

Por: Moises Rabelo (Dicadedica)

Versão Corrigida!!!

Posicione qualquer elemento de página em uma Div usando CSS Styles no blogger

Trenamento Expresso sobre alinhamentos CSS
Se você tem um código javascript ou Html de um widget contendo texto, formulários, banners, imagens ou qualquer outro elemento, você pode posiciona lo em local diferente do tradicional colocando o elemento dentro de um div e formatando via CSS styles para que fique em local oportuno.


Para que você precisaria mudar o posicionamento de um widget?
(EX:)

• Você pode ter um banner suspenso como um popup
• Um formulário de busca que em cima de uma imagem
• Um menu com categorias para o blog que flutuando
• Uma imagem alinhada no topo a direita do blog

Referência da posição:

Relativo (position: relative;)
O alinhamento esta referindo-se a posição do último elemento html colocado antes dele.
Absoluto(position: absolute;)
O alinhamento estará referindo-se a posição em relação ao navegador, portanto ao mover o rolamento da página o elemento não mudará sua posição, dando o efeito de flutuante ou suspenso.


-Alinhamentos css:-
alinhado ao topo
top:0px;

alinhado ao direita
right:0px;

alinhado em baixo
bottom:0px;

alinhado esquerda
left:0px;

EX:(topo 5px, direita 10px pixels de distancia da margem absoluta)

<div style="top: 5px; right:
10px; position: absolute;"
>

código do widget vem aqui!

</div>



No painel de controles do blogger acesse add um elemento de página javascript/html e cole o código do exemplo substituindo a frase código do widget vem aqui! pelo código da imagem, banner, widget, busca ou qualquer outro conteúdo que deseja alinhar no blog.

Clique na imagem ao lado para ampliar um exemplo de imagem!

NO blog estou usando o código de alinhamento para o top menu e imagens das latinhas flutuantes como absolutas e o posicionamento do banner do blog bem como o campo de busca como imagens com posicionamento relativas!!!


Veja tambem:

1. Menu flutuante
2. Rodapé 3 colunas
3. Banner flutuante
4. Banner entre postagens

Espero que este tutorial esclareça algumas dúvidas, existem muitos outros comando de alinhamento, porém estes são os fundamentais poderá conseguir novos códigos no endereço http://www.w3schools.com/css/default.asp , agradecimento especial ao @LucasPompeu que solicitou esta dica.

Tutorial Ícone Adicionar aos Favoritos Crossbrowser e Flutuante no Blogger

Bom dia, ontem fui acionado via Twitter pelo (a) @d20009, com um desafio muito interessante...

"Como faço para usar aquele seu tutorial de imagens e icones flutuantes com um ícone para add aos favoritos no meu blogger?"

Adorei a idéia, e fiz várias tentativas, porem descobri que o código que funcionava no Mozila Firefox, não funcionava no internet explorer ai eu descobri um código crossbroser mais que era incompatível com o blogger e seria necessário hospedar um arquivo .js em um servidor aparte...

O mais importante é que descobri outro código que funciona perfeitamente, depois ajustei ele para ficar flutuante e coloquei a imagem da latinha com a estrela que já havia baixado no tutorial anterior e pronto.

Segue abaixo o script para ser add como widget (Elemento de página gadget) no painel de controle do blogger, ainda não testei no wordpress, mais acredito que não ha nada que impossibilite o seu funcionamento, se alguém testar avisa aqui pra galera ok....



Código do wídget

<script language="JavaScript" type="text/JavaScript">
function favoritos() {
if ( navigator.appName != 'Microsoft Internet Explorer' )
{ window.sidebar.addPanel("Muito mais do que dicas para
Blogs","http://dicas.dicadedica.com","");
}
else { window.external.AddFavorite("http://dicas.dicadedica.com","Muito
mais do que dicas para Blogs"); } }
// Fonte: dicasparablogs.com.br mais alterações do site dicas.dicadedica.com
</script>
<a href="javascript:void(favoritos());"><img title='Add aos favoritos' style='display:scroll;position:fixed;top:440px;right:-5px;'
src='http://img2.imagedash.com/1gZ9.png'
border='0'></a>

Se o código código anterior der problemas na instalação, instale este com as mesmas modificações...
<script language="JavaScript" type="text/JavaScript">function favoritos() {if ( navigator.appName != 'Microsoft Internet Explorer' ){ window.sidebar.addPanel("Muito mais do que dicas para Blogs","http://dicas.dicadedica.com","");}else { window.external.AddFavorite("http://dicas.dicadedica.com","Muito mais do que dicas para Blogs"); } }// Fonte: dicasparablogs.com.br mais alterações do site dicas.dicadedica.com </script><a href="javascript:void(favoritos());"><img border="0" style="display:scroll;position:fixed;top:440px;right:-5px;" src="http://img2.imagedash.com/1gZ9.png" title="add aos favoritos"/></a>



Altere o que estiver em vermelho pelos paramentos do seu blogger:

• Titulo do blog
  Muitomais do que dicas para Blogs
• Endereço do blog
  http://dicas.dicadedica.com
• Endereço da imagem
  http://img2.imagedash.com/1gZ9.png

Pegue mais ícones grátis aqui
http://dicas.dicadedica.com/2009/07/colocando-imagens-banners-ou-icones-com.html

É isso ai até a próxima dica, você pode informar onde pegou este tutorial caso alguém pergunte foi aqui no Dicadedica. Me add no twitter ok!!! t+

Colocar Destaque Postagens Relacionadas com Imagem e Leia Mais no Blog

Quem reparou no rodapé de todas as postagens do dicadedica, viu algo diferente, é widget dos destaques em miniaturas das postagens relacionadas do blogger.

Eu estava a procura de colocar um item de tópcos relacionados que fosse útil e atraente ao mesmo tempo, e então me deparei com este widget que você vê ao lado.

Me surpreendeu a facilidade em que foi para inserir no blog com apenas alguns cliques você pode ter issto no seu blog tambem.
Outra coisa que gostei, é que que o site o ingles onde peguei o widget estava em inglês, ele veio em português, "Poderá também gostar de: "

Sem mais delongas...

O site gerador widget de imagens miniatura das postagens em destaque é o Linkwithin
Para colocar este elemento de página acesse e siga:
http://www.linkwithin.com/learn?ref=widget
1 - Ao abrir o site, de cara você vai ver campos
coloque nestes campos: Email, Link para o seu blog, a platforma do blog, e a Color.
2 - Agora clique no botão "Get Widget"

Irá abrir uma página com o tutorial de como inserir o widget, muito fácil por sinal...
segue abaixo a tradução para colocar no blogger mais tambem da para colocar em outras plataformas:

Instale o Widget no Blogger

<script> var linkwithin_site_id = 39520; (function () { var elem = document.createElement('script'); elem.type = 'text/javascript'; elem.src = 'http://www.linkwithin.com/widget.js?rand=' + Math.random(); document.getElementsByTagName('head')[0].appendChild(elem); })(); </script> <a href="http://www.linkwithin.com/"><img src="http://www.linkwithin.com/pixel.png" alt="Blog Widget by LinkWithin" style="border: 0" /></a> <b:includable id="main"><data:content></b:includable>

1. Clique [no botao] para abrir Blogger em uma nova janela, e siga os passos abaixo nessa janela. Faça login, se necessário.

2. Escolha um blog, se tiver mais de um e, em seguida, clique em Adicionar Widget.

3. (Opcional) Para um melhor desempenho, arraste e solte a caixa do LinkWithin da caixa para baixo das "Postagens do Blog".

4. clique em Salvar.

E pronto! O item deverá aparecer no seu blog.

NOTA: A qualidade das histórias recomendado vai melhorar assim que concluir o nosso processo de verificação do seu blog. Isso pode levar até várias horas, dependendo do número de notícias no seu blog.
Instalar o widget em outro blog?

----------------------
Aqui funcionou tudo direitinho, mais se ai deu problema é só falar _o/

Exiba Marcadores no Menu Expansível Drop Down no Blogger

O seu blogger está cheio de marcadores e você já não vê espaço no seu template para tanta marcação?

Então este tutorial pode lhe ser de grande utilidade.

Eu estava com este problema, meu blogger foi crescendo e já tinha tentado
de tudo par reduzir o numero de tags, estes marcadores ajudam os leitores a
localisar de forma categórica e rápidamente todas as postagens do blogger,
pensei em encontrar uma solução para reduzir o volume, tentei nuvens de tags, e
funcionou por um tempo, logo também não havia espaço suficiente para tanta tag
então, a solução era mesmo colocando em um drop down!!!

Chega de historinhas veja o tutorial para inserir menu dropdown no
template do blog

É necessário iserir os marcadores em
1 - layout,
2 - elementos de páginas
3 - marcadores

1 - Faça backup do template para evitar perdas

Em editar código html no painel do blogger,

é só clicar em baixar modelo completo.

2 - Clique em qualquer parte do códigose [ctrl] + [f] e localise
o trecho de código:

<b:widget id='Label1' locked='false' title='Marcadores' type='Label'>

3 - Selecione até a tag </b:widget> próxima.



4 - Substitua todo o trecho pelo trecho de código abaixo:

<b:widget id='Label1' locked='false' title='Marcadores' type='Label'>


<b:includable id='main'>

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

<h2><data:title/></h2>

</b:if>

<div class='widget-content'>



<br />

<select onchange='location=this.options[this.selectedIndex].value;'>

<option>Select a label</option>

<b:loop values='data:labels' var='label'>

<option expr:value='data:label.url'><data:label.name/>

(<data:label.count/>)

</option>

</b:loop>

</select>



<b:include name='quickedit'/>

</div>

</b:includable>

</b:widget>

5 - Salve e veja o resultado!!!

Colocando imagens banners ou ícones com links flutuantes no blogger

Viu estes ícones de latinhas de refrigerastes flutuando no blog? são bem atrativos não!!! acabei de colocar e pretendo conseguir bons seguidos no meu twitter e rss.

Ficou de olho né? Pode pegar , aqui eu vou encinar como para colocar de forma simples estas e outras imagens de ícones com links flutuando suspensa no seu blogger!

Basta copiar o código com as devidas alterações em azul e colar o código abaixo como elemento de pagina javascript/html.

Código da imagem flutuante do twitter:

<a style="display:scroll;position:fixed;top:200px;right:5px;" target="_blank"
href="https://twitter.com/dicadedica" title="Siga-me no Twitter"><img src="http://cache02.us.twitfs.com/Download/7/20090714/4140252/icontexto-drink-web20-twitter.png"/></a>

Pode ser qualquer imagem ou banner é só trocar os valores:

Posição:

• top ou buton 200

magrgem direita:

• right 5px

Endereço do link:

• href="https://twitter.com/dicadedica"

Endereço da imagem:

• img src="http://cache02.us.twitfs.com/Download/7/20090714/4140252/icontexto-drink-web20-twitter.png"

Ícones de latinhas social networks grátis aqui:
Baixar

Faça upload das imagens para um servidor storage gratuito aqui:
Imagedash (banco de imagens gratuito)

Outros elementos de pagina suspensos
Widgets flutuantes dicadedica

http://dicas.dicadedica.com/2009/07/tutorial-blogger-menu-de-rolamento.html
Fácil né, espero que tenham gostado e me siga no twitter ok!!!

Hack Blogger: Linkou? Apareceu aqui no Widget

Hoje vou ensinar a colocar o RSS dos últimos blogs que colocaram um link para o seu blog,

Porque colocar o RSS FEED "Linkou? Apareceu aqui no Widget" no meu blog?

Para aumentar suas visitas lógico! Mostrar o Hack dos últimos que te linkaram em um hack widget no seu blog, irá influenciar e até impulsionar que mais e mais vezes outros sites e blogs te linkem, já que sempre que algum link novo é apontado para o seu site ele aparece automaticamente no topo da lista. assim também seu blog vai está sempre apontando para outros blogs que te mandam visitas e estão em constante atualização, já que o widgets mostra apenas os blogs com links mais recentes.

Eu já tinha colocado este widget que mostrava quem tinha me linkado antes, porém eu retirei porque o mesmo não funcionava direito e apontava apenas para pessoas do meu blogroll, então decidi olhar o fonte e modificar alguns parâmetros da busca e cheguei ao seguinte url

Endereço do RSS:
---------------------------------
http://blogsearch.google.com/blogsearch_feeds?hl=pt-BR&q=link:http://dicas.dicadedica.com/&lr=&safe=images&scoring=d&ie=utf-8&num=10&output=rss
---------------------------------

Passo a Passo:
Então para descobrir os últimos blogs que colocaram links para suas postagens ou para sua página inicial, apenas siga os seguintes passos:

1. No endereço do rss acima, substitua todo o trecho em vermelho que equivale ao endereço do blog pelo endereço do seu blog ou site.
   (Pode usar o bloco de notas para editar o endereço)
   
   
2. Agora conforme a figura 1 acesse o painel de controles do seu blogspot clicando aqui:
   blogger.com
   
   
   
3. Fazendo igual a figura 2 clique em Layout
   
   
   
   
   
4. Seguindo a figura 3 clique em Adicionar novo elemento de página
   
   
   
   
5. Escolha o elemento FEED rss veja na figura 4
   
   
   
   
   
6. Por último copie e cole o endereço do lincoume já com o url do seu site ou blog alterado.

Pronto, agora é só esperar alguem te linkar e eles vão aparecer na sua lista, aproveita e linka o http://dicas.dicadedica.com e apareça na minha lista também ok!!!

Mais fácil do que isso impossível..., mesmo assim, qualquer eventualidade é só comentar, terei o prazer em ajudar...

Novos Tradutores Para Blogger

Olá hoje eu trago dicas de ótimos tradutores para colocar no seu blog, uns em forma de elementos de página para serem colocados na slide bar lateral do blogger, já outros, no formato widget para colocar no topo da pagina do site ou do blogspot.

Este aqui é um fácil porem não da para fazer nenhuma personalização.

Para adicionar é só copiar e colar como elemento de página:

<script language="JavaScript1.2" src="http://www.altavista.com/static/scripts/translate_engl.js"></script>

Personalizeveis:
Após escolher o tradutor se você quiser mexer no código ou trocar as imagens das bandeirinhas é só localizar o código da imagen e quer fica geralmente [img src="AQUI.png"] e substituir por uma outra imagem aqui do site FamFam Flags que tem ótimas imagens gifs para downloads e você pode hospedar as imagens aqui no novo site imagesharing para linkar diretamente as imagens deles, caso você não tenha onde hospeda-las.

São os melhores hacks Traduzires o blogs que encontrei traduza instantaneamente seu blog do portugues brasil (pt/br), para os idiomas mais falados do mundo (Chinese, Hindi, Spanish, English, Arabic, Portuguese, Bengali, Russian, Japanese, German ...) fazendo seu blog mas acessível e acessado também pelos gringos.

Os Melhores Tradutores que funciona no Blogspot são:

1. Tuto de tudo: Estilizando um tradutor para o site ou blog
   
2. Renatotavares: Tradutor para Blogger
3. Dicas Blogger: Translator Widget - um novo tradutor para blogs
4. Templates Blogger: Tradutor no blog
5. 4shared: Baixar Código para traduzir blogge

Mais Tradutores Widgets

Translator widgets for your language:
From: (Estes você cliqua copia e cola como elementos de páginas widgets javascript e HTML no blogspot)

1. Todos os Idiomas
2. Portuguese para English
3. Spanish para English
4. Japanese para English
5. Korean para English
6. Arabic para English
7. Chinese para English
8. Russian para English
9. Italian para English
10. German para English e French

Agora é só incluir o código preferido no seu blog ou template, deu erro? não deu certo? comenta!!!

Tutorial -> Como Colocar Comentários em uma Janela Pop-up+

Beleza pessoal, hoje vou atender ao pedido do amigo ADM do blog Telemensagens, Assim como ele outros leitores tem me mandado emails me perguntando a mesma coisa, por isso vou mostra um print screen que tirei das configurações do blog e que mostra como é simples fazer a caixinha dos comentários abrir em um popup, embutido ou em nova janela com o fácil tutorial abaixo.
Clique na imagem da dica para ampliar


------------------------------------------------------------------------
Telemensagens recados do Coração disse...

amigo eu queria abrir um popup no meu blogger só que alem de configurar a altura e a largura eu gostaria de escolher só a parte que me enteressa dessa pagina para abrir nesse popup eu tenho esse codigo clique "width=400,height=550,top=100,left=100"); para abrir só que eu gostaria por exemplo abrir só este quadrado aqui de comentarios entende espero que possa me ajudar
------------------------------------------------------------------------

Sim amigo, existe varias formas de fazer um popup abrir, e pelo que eu percebi você quer um popup dos comentários, e o próprio blogger já tem uma opção para este tipo de pop-up e se você quer que ele estenda por completo em nova página também tem esta opção pronta e a outra opção é o comentário embutido na página.

Siga os passos:

• 1 - Logue no painel de controles do blogger blogspot.com;
• 2 - Acesse no menu Configurações;
• 3 - Clique na aba Comentários;
• 4 - Agora marque a opção Sim em "Mostrar comentários em uma janela pop-up?"
  

Pronto amigos espero ter ajudado, caso vocês estejam esperando um dica de como Criar uma popup em div ou javascript acesse aqui

Digitação em Game Flash gadget no seu Blog

Pessoal, hoje termino de desenvolver o widget de digitação dicadedica, nele podemos praticar digitação a partir de qualquer site ou blog em que o mesmo for inserido, o widget feito na tecnologia flash tem apenas 55 kb por isso não pesa o blog conheça os motivos que o levará a inserir no seu blog...


Porque colocar no meu blog?

1. Útil - Tenha um widget que é um programa que ajuda os usuários praticar digitação de forma divertida direto do seu blog.
2. Divertido - Seu blog sera lembrado sempre que um usuário precisar de um passatempo.
3. Leve - Como eu disse são apenas 55kb e com preload, para rodar apenas quando terminar de carregar.
   
4. Fácil instalação - Procedimento padrão copiar e colar tanto como widget, gadget ou na postagem.
   
5. Designer - Foi feito de forma a ficar adaptavel e atraente em qualquer site de qualquer cor, tamanho e formato
6. Gratuito - Pode ser usado livremente só não retire os créditos
   

O widget de digitação Dicadedica, é um modulo api, widget, e um elemento de página para blogs e sites como o blogger, netvibes e outros agregadores como o igoogle.

Para usar é só clicar no botão que se parece com o iniciar do windows e todo o resto é intuitivo...

Como estou na faze inicial de lançamento aceito sujestões para a melhoria do mesmo, é só deixar um comentário nesse post, vlw!!!

+++++++++++ Embed Code widget:
<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script>if (WIDGETBOX) WIDGETBOX.renderWidget('d145002c-3021-4b3d-a7bc-143c1e55b00a');</script><noscript>Get the <a href="http://www.widgetbox.com/widget/widget-digitao">Widget Digitação</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>!</noscript>
Se não conseguir instalar assim acesse o link: http://www.widgetbox.com/widget/widget-digitao

Top 5 Widget Rank Postagens Populares para Blog

Você tem um blog, gostaria de colocar um widget, gadget ou simplesmente uma caixinha do lado esquerdo do template do seu blog, com as o elemento de pagina das postagens que tiveram maior aceitação pelos leitores? As melhores notícias certamente atrairam mais visitas e merece destaque, não acha? sabe a postagem com o maior numero de comentários? essa também continuará a atrair maior numero de comentários, e assim por diante... Por isso não perca tempo você vai ter que ativar o rss do seu blog ou site e então...

Ativando RSS
Acesse:
1 - Painel de controle do blogger ou outro blog
2 - Configurações / Site Feed
3 - Permitir feeds do blog / completa

Colocando Widget RostRank
4 - Agora acesse no link 1 que está baixo a pagina do postrank,
5 - No campo Analyse digite o endereço do seu blog já com o rss ativado ou o endereço do seu rss.

Aproveitando assine o rss do Dicadedica
http://feeds2.feedburner.com/blogspot/dicadedica
Este foi gerado com feedburner é melhor porque te da estatísticas e outros recursos.

6 - Clique em Analyse e quando ele gerar o resultado clique em "Get this widget"
7 - Agora verifique e escolha o melhor designer para o widget e aceite a inclusão no blogger clicando em "add to blogger" se for wordpress tem um outro link do lado direito.
8 - Pronto na tela seguinte se você ainda estiver logado no blogger ou wordpress irá pedir para confirmar, confirme e acabou.

Confira os melhores widget top bloggers para ser colocado no seu blog

Link 1
Postrank - Antigo Aiderss - Mostra a lista com as melhores postagens do seu blogger
Top Populares

Link 2 - Mostra a lista dos que mais comentam no seu blogspot
Top comentaristas

Link 3 - Mostra a lista com os sites que mais madam visitas para o seu site blog
Top Referência

Link 4 - Exibe a lista com o top rss feeds do postrank diretamente no firefox
AideRSS + Google Read Estenção do Firefox

Link 5 - Mostra a lista das top postagens mais comentadas do seu blog feita pelo blogbuster
Top Comentados

Opcional, é possível tabém compiar o código gerado e colocar manualmente no seu site de outra plataforma diferente do blogger, um site por exemplo, basta ele ter rss e ser possível colar um código em JavaScript.


Esta é uma dica simples mais que pode bombar seu site, pode ter certeza. existem outros tipos de tops que precisam ser mencionados, favor comenta-los ok! Pronto galera agradeço pela preferência fui.

Coloque widget voltar ao topo flutuante do blog DicaDeDica!

Galera, sabe aqueles templates legais que tem um botão para o usuário voltar ao topo do blog que fica flutuando quando mexemos na barra de rolagem? Vários novatos já me pediram para disponibilizar um tutorial ensinado a colocar este recurso no blog, então hoje trago duas coisas, um widget hack que insere isto automaticamente, só copiar e colar e um tutorial completo para você montar o seu com suas próprias imagens. Vamos lá!



Primeiro o widget altomático Flutuante!
1 - Selecione e copie todo o código do widget:

<a style="display:scroll;position:fixed;bottom:72px;right:50px;" href="#" title="VOLTAR AO TOPO (do blog DicaDeDica)"><img src="http://lh4.ggpht.com/_eZ4RDyPwpoA/SagWzGVD6mI/AAAAAAAAAw4/LivJ__3Qot0/s144/TOPO_FLUTUANTE_DICADEDICA.png"/></a> <a href="http://www.dicadedica.blogspot.com/"> <span >Voltar ao topo flutuante Dicadedica</span></a> </span>

2 - No painel de controle do Blogger (Blogspot) acesse:

• Layout
• Adicionar um widget
• HTML/JavaScript
  

3 - Cole o código e salve o widget

Pronto seu widget estará configurado da forma automática.
(Funciona nos templates do novo blogger)

Agora o tutorial extensivo!

Tutorial Widget Hack Botão Voltar ao Topo Flutuante

1 - Primeiro o que faz cada tag:

• title=" xxxx " = o comando title com é o texto que a parece quando passamos o mouse.

EX: topo

• img src="iiiiiii.gif" = A tag img é responsável pela visalização da imagem

EX: http://lh4.ggpht.com/_eZ4RDyPwpoA/SagWzGVD6mI/AAAAAAAAAw4/LivJ__3Qot0/s144/TOPO_FLUTUANTE_DICADEDICA.png

• a href="#" = Esta é responsável pelo link para o topo da página
  
• style="display: scroll = Este comando desabilita a barra de rolagem dando a aparência de flutuar na tela.
  
• position: fixed = Fala que a imagem ficará em uma posição fixa
  
• right: XXpx = Alinhamento da imagem a direita e com XX de tamanho em pixels.

EX: 72px

• bottom: YYpx = Faz a imagem aparecer a XX pixels da parte de baixo da tela do navegador.

EX: 50 px

2 - Agora que já sabe o que faz cada comando substitua no codigo abaixo o que lhe for do agrado e cole no html da pagina do blogger imediatamente antes da tag </dody>

<a style="display:scroll;position:fixed;bottom:XXpx;right:YYpx;" href="#" title="xxxx"><img src="iiiiiii.gif"/></a>

Duvidas é só perguntar, obrigado por escolher o DicaDeDica!!!

Mais uma dica!!!
3 - Na falta de ícones, acesse o site

Iconlet
http://www.iconlet.com/search?n=arrow+up

com ótimos ícones no estilo web 2.0 e gratuitos.

Gostou? Então copie este post para seu Blog:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr6MnPXVEhdmCibIY7nmaXgZcmbLyCqhoWFIvwWMYaZKVHvqGP-v_fUHQubENUQxq0t_CTtbuOZfsweq34Uia7eLoJ_2zadTftMQ9Yk9uugSOVL99rT5NBn_M8S-uxbzMsHFHLKyj6QZ4/s1600-h/TOPO+copy.png"><img style="margin: 0pt 10px 10px 0pt; float: left; cursor: pointer; width: 200px; height: 160px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr6MnPXVEhdmCibIY7nmaXgZcmbLyCqhoWFIvwWMYaZKVHvqGP-v_fUHQubENUQxq0t_CTtbuOZfsweq34Uia7eLoJ_2zadTftMQ9Yk9uugSOVL99rT5NBn_M8S-uxbzMsHFHLKyj6QZ4/s200/TOPO+copy.png" alt="" id="BLOGGER_PHOTO_ID_5307552435495897234" border="0" /></a>Galera, sabe aqueles templates legais que tem um botão para o usuário voltar ao topo do blog que fica flutuando quando mexemos na barra de rolagem? Vários novatos já me pediram para disponibilizar um tutorial ensinado a colocar este recurso no blog, então hoje trago duas coisas, um widget hack que insere isto <span style="font-weight: bold;">automaticamente</span>, só copiar e colar e um <span style="font-weight: bold;">tutorial completo</span> para você montar o seu com suas próprias imagens. Vamos lá!<br /><br /><span style="font-weight: bold;">Primeiro o widget altomático.</span><br />1 - Selecione e copie todo o código do widget:<br /><br /><blockquote style="color: rgb(153, 153, 153);"><a style="display:scroll;position:fixed;bottom:72px;right:50px;" href="#" title="VOLTAR AO TOPO (do blog DicaDeDica)"><img src="http://lh4.ggpht.com/_eZ4RDyPwpoA/SagWzGVD6mI/AAAAAAAAAw4/LivJ__3Qot0/s144/TOPO_FLUTUANTE_DICADEDICA.png"/></a> <a href="http://www.dicadedica.blogspot.com/"> <span >Voltar ao topo flutuante Dicadedica</span></a> </span> </blockquote><br /><br />2 - No painel de controle do Blogger (Blogspot) acesse:<br /><ul><li> Layout</li><li>Adicionar um widget</li><li><span class="title">HTML/JavaScript</span><br /></li></ul>3 - Cole o código e salve o widget<br /><br />Pronto seu widget estará configurado da forma automática.<br />(Funciona nos templates do novo blogger)<br /><br /><span style="font-weight: bold;">Agora o tutorial extensivo:</span><br /><h1>Tutorial Widget Hack Botão Voltar ao Topo Flutuante</h1><br />1 - Primeiro o que faz cada tag:<br /><ul><li><span style="font-weight: bold;">title="<span style="color: rgb(204, 153, 51);"> xxxx</span> "</span> = o comando title com é o texto que a parece quando passamos o mouse.</li></ul>EX: topo<br /><ul><li><span style="font-weight: bold;">img src="<span style="color: rgb(204, 153, 51);">iiiiiii.gif</span>"</span> = A tag img é responsável pela visalização da imagem</li></ul>EX: http://lh4.ggpht.com/_eZ4RDyPwpoA/SagWzGVD6mI/AAAAAAAAAw4/LivJ__3Qot0/s144/TOPO_FLUTUANTE_DICADEDICA.png<ul><li><span style="font-weight: bold;">a href="<span style="color: rgb(204, 153, 51);">#</span>" </span>= Esta é responsável pelo link para o topo da página<br /></li><li><span style="font-weight: bold;">style="<span style="color: rgb(204, 153, 51);">display: scroll</span> =</span> Este comando desabilita a barra de rolagem dando a aparência de flutuar na tela.<br /></li><li><span style="font-weight: bold;">position: <span style="color: rgb(153, 102, 51);"><span style="color: rgb(204, 153, 51);">fixed</span> </span>= </span>Fala que a imagem ficará em uma posição fixa<br /></li><li><span style="font-weight: bold;">right: <span style="color: rgb(204, 153, 51);">XXpx</span> = </span> Alinhamento da imagem a direita e com <span style="color: rgb(204, 153, 51); font-weight: bold;">XX</span> de tamanho em pixels.</li></ul>EX: 72px<br /><ul><li><span style="font-weight: bold;">bottom: <span style="color: rgb(204, 153, 51);">YYpx</span> = </span>Faz a imagem aparecer a <span style="color: rgb(204, 153, 51); font-weight: bold;">XX</span> pixels da parte de baixo da tela do navegador.</li></ul>EX: 50 px<p>2 - Agora que já sabe o que faz cada comando substitua no codigo abaixo o que lhe for do agrado e cole no html da pagina do blogger imediatamente antes da tag<span style="font-weight: bold;"> </dody></span></p><p style="color: rgb(153, 153, 153);"></p><blockquote><a style="display:scroll;position:<span style="color: rgb(204, 153, 51); font-weight: bold;">fixed</span>;bottom:<span style="color: rgb(204, 153, 51); font-weight: bold;">XXpx</span>;right:<span style="color: rgb(204, 153, 51); font-weight: bold;">YYpx</span>;" href="<span style="color: rgb(204, 153, 51);">#</span>" title="<span style="color: rgb(204, 153, 51); font-weight: bold;">xxxx</span>"><img src="<span style="font-weight: bold;"><span style="color: rgb(204, 153, 51);">iiiiiii.gif</span></span>"/></a><br /><br /><span style="color: rgb(0, 0, 0);"><blockquote><br />Duvidas é só perguntar, obrigado por escolher o DicaDeDica!!!<br /><br /><span style="font-weight: bold;">Mais uma dica!!!</span><br />Na falta de icones acesse o site<br /><br /><a href="http://www.iconlet.com/search?n=arrow+up">Iconlet</a><br />http://www.iconlet.com/search?n=arrow+up<br /><br />com ótimos ícones no estilo web 2.0 e gratuitos.<br /></blockquote></span><br /></blockquote><p></p><p><br /></p>

Gerador Widget de Popular post ou Top comentados Blogger Blogspot

É muito importante que usuário saiba quais são as notícias mais interessantes do seu blog, você pode verificar que as noticias com mais postagens, são tambem as que mais trazem leitores para o seu blog, por terem maior relevancia nos buscadores.
Mostre o que tem de melhor no seu blog e assim o leitor vai se sentir motivado a postar comentários em outros posts não tão populares.

Existe várias formas para colocar um widgets na slidebar com os top 10 mais comentados do seu blog, eu escolhoi mostrar o gerador automático online de widget Popular Posts (Most Commented) Widget for Blogger Blogs:

Esse nome grande é só uma maneira rápida para ser encontrado pelos usuarios nas pesquisas do Google, mais o widget faz exatamente isso e é de simples instalação. Exibe os mais comentados do seu blgo na coluna de widgets.

Instalação:

1. Acesse: http://www.bloggerbuster.com/2008/04/popular-posts-most-commented-widget-for.html
2. No final da postagem tera um formulário para a customização do widget.
3. Em Widget Title: entre com o título do widget, eu sugiro Top Populares ou Top Comentados.
4. Em Blog url: http://: entre com o endereço do seu blog sem o http:// assim www.dicadedica.blogspot.com
5. Agora clique em customize e em Add to Blog.
6. Pronto, agora você sera redirecionado para o blogger painel, ai é só logar e aceitar a instalação do widget.

Viu tudo simples, no dicadedica vc encontra outros widgets para promover o seu blog e melhorar a navegação e interação com os usuários.

Gusto? Então copie esse post para seu Blog:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj17CogowYRc9Hemqhn7nVOhqVNDG4nqeXL2JqexWBdA0LxJwU3UrnHD2WFtVjHFJV5Lo8FvEnA3XflpgnlwOtnqQMw89s2IH2Z_Z4YlyPW6-xaQ_97p_2bm1FaEVQkdRFuMJE3L_N79OA/s1600-h/popular_post_widget.png"><img style="margin: 0pt 10px 10px 0pt; float: left; cursor: pointer; width: 200px; height: 117px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj17CogowYRc9Hemqhn7nVOhqVNDG4nqeXL2JqexWBdA0LxJwU3UrnHD2WFtVjHFJV5Lo8FvEnA3XflpgnlwOtnqQMw89s2IH2Z_Z4YlyPW6-xaQ_97p_2bm1FaEVQkdRFuMJE3L_N79OA/s200/popular_post_widget.png" alt="" id="BLOGGER_PHOTO_ID_5279999605254964946" border="0" /></a><br />É muito importante que usuário saiba qual são as notícias mais interessantes do seu blog, você pode verificar que as noticias com mais postagens tambem são as que transem mais leitores para o seu blog e as mais relevantes nos buscadores. por isso é importante que o usuário saiba o que tem de melhor no seu blog, assim ele vai se sentir motivado a postar comentários em outros posts não tão populares.<br /><span id="fullpost"><br />Existe varias formas de se colocar um widgets na slidebar com os top 10 mais comentados do seu blog, eu vos apresento o <span style="font-weight: bold;">gerador automático online de widget Popular Posts (Most Commented) Widget for Blogger Blogs:</span><br /><br />Esse nome grande é só para se achado pelos usuarios nas pesquisas do google, mais o widget faz exatamente isso e é de simples instalação.<br /><br /><span style="font-weight: bold;font-size:130%;">Instalação:</span><br /><ol><li><span id="fullpost">Acesse: http://www.bloggerbuster.com/2008/04/popular-posts-most-commented-widget-for.html</span></li><li><span id="fullpost">No final da postagem tera um formulário para a customização do widget.</span></li><li><span id="fullpost">Em </span><span style="width: 130px; font-weight: bold;">Widget Title</span><span style="font-weight: bold;">:</span> entre com o título do widget, eu sugiro <span style="font-weight: bold;">Top Populares</span> ou<span style="font-weight: bold;"> Top Comentados.</span></li><li>Em <span style="width: 130px; font-weight: bold;">Blog url</span><span style="font-weight: bold;">: http://: </span>entre com o endereço do seu blog <span style="color: rgb(204, 0, 0);">sem</span> o http:// assim <a href="http://www.blogger.com/www.dicadedica.blogspot.com">www.dicadedica.blogspot.com</a><span style="font-weight: bold;"> </span></li><li>Agora clique em customize e em Add to Blog<span style="font-weight: bold;">.</span></li><li><span style="font-weight: bold;">Pronto, agora você sera redirecionado para o blogger painel, ai é só logar e aceitar a instalação do widget.</span></li></ol>Viu tudo simples, no dicadedica vc encontra outros widgets para promover o seu blog e melhorar a navegação e interação com os usuários.<br />

Video Tutorial -> Hack Gostou? Então Copia para o seu Blogue!

Bem vindos mais uma vez aqui no DicaDeDica, hoje vou disponibilizar para vocês esse tutorial:
Gostou Então Copia para o seu blog mais primeiro vou falar onde eu consegui e porque recomendo o uso da ferramenta.

Origem:

Este tutorial estava disponibilizado no blogspot www.jinranger.blogspot.com, que infelizmente se encontra indisponível hoje, porém as pessoas tem me perguntado se eu poderia fazer um tutorial a mostrando novamente porque o link estava indisponível.... Em fim resolvi fazer um tutorial com vídeo, o vídeo foi inspirado na postagem do Diego Soares do Profissional Blogger após ver um tutorial que ensina a criar vídeos tutoriais blz, então vamos lá>>>


Vídeo Tutorial:

Inserindo o Hack

1. No painel de cotrole do blogger entre em configurações
2. Copie todo o texto do script que está no arquivo de bloco de notas txt chamado entao_copia.txt
   
3. No subitem da aba configurações entre em Formatação
4. Role a pagina até o final, lá encontrará o titulo Modelo de postagem com uma caixa de texto ao lado diretio da mesma.
   
5. Cole nessa caixa de texto, o conteúdo do arquivo entao_copia.txt
6. Agora é só clicar em Salvar as Configurações e Pronto!

Usando o Hack

1. Agora que você já inseriu o scritp pronto, entra em postagem, e ira encontrar o scritp, é só Escrever sua postagem normalmente acima do script.
2. Agora para disponibilizar alguma postagem para seus parceiros de blogger é só, clicar em Editar Html , copiar tudo o que está nessa postagem menos o codigo referente ao script hack copia para o seu blog.
3. E colar tudo no espaço do código onde está escrito COLA AKI
4. Agora visualiza, e publica! dúvidas é só fazer um comentário.

Download link:
http://moisesrlima.googlepages.com/no-seu-blog_DicaDeDica2009.txt

Funcionando!

Colocar o Hack Leia Mais no Blogspot do Blogger

Galera, primeiramente quero pedir desculpas pelo atraso nas postagens deste mês, o motivo é porque estou desenvolvendo uns jogos para disponibilizar aqui no blog, jogos em flash mesmo... eles tem consumido todo meu tempo extra mais espero que fique bem legal e viciante.
Voltando ao assunto o colega do blog Area51 Downloads perguntou o seguinte:
-------------------
"aew blz seu blog eh show queria um tutorial de como por igual ao seu "leia Mais...'' resumi as postagem vlw sucesso"
-----------------
O leia mais do meu blog eu usei o tutorial do blog blosque.com o link para o tutorial está aqui:
http://blosque.com/2007/07/como-exibir-sumrios-dos-posts-com-link.html
No google vc acha vários blogs que demonstra o mesmo tutorial com algumas adaptações, porem o do blog blosque eu considero melhor hack adaptado para o novo blogger.

Eu consegui colocar aqui e posso te ajudar em alguma dúvida, é só comentar vlw. Vou procurar terminar logo o jogo para voltar a postar todos os dias, Fui.........

Gusto? Então copie esse post para seu Blog:
Galera, primeiramente quero pedir desculpas pelo atraso nas postagens deste mês, o motivo é porque estou desenvolvendo uns jogos para disponibilizar aqui no blog, jogos em flash mesmo... eles tem consumido todo meu tempo extra mais espero que fique bem legal e viciante.<br /><br />Voltando ao assunto o colega do blog <b><a href="http://www.area-51downloads.blogspot.com/" target="_blank"><b class="pn_std">Area51 Downloads</b></a> </b>perguntou o seguinte:<br />-------------------<br />"aew blz seu blog eh show queria um tutorial de como por igual ao seu "leia Mais...'' resumi as postagem vlw sucesso"<br />-----------------<br />O leia mais do meu blog eu usei o tutorial do blog <a href="http://blosque.com/2007/07/como-exibir-sumrios-dos-posts-com-link.html">blosque.com</a> o link para o tutorial está aqui:<br />http://blosque.com/2007/07/como-exibir-sumrios-dos-posts-com-link.html<br />No google vc acha vários blogs que demonstra o mesmo tutorial com algumas adaptações, porem o do blog blosque eu considero melhor hack adaptado para o novo blogger.<br /><br />Eu consegui colocar aqui e posso te ajudar em alguma dúvida, é só comentar vlw. Vou procurar terminar logo o jogo para voltar a postar todos os dias, Fui.........<br />Ass: <a href="http://www.dicadedica.blogspot.com/">DicaDeDica - Dicas sobre blogspot e muito mais</a>

Tutorial Hack -> Como dividir postagem em colunas

Oi, hoje vou mostrar essa dica fascinante que ensina como dividir a postagem em duas colunas, você vê por ai vários sites usando esse recurso e agora tambem vai poderá implementar esse recurso de layout de maneira fácil no seu blog:Sua postagem vai ficar dividida em duas colunas de texto iguais as que estão logo abaixo.

Modo 1- Desse modo, você terá que repetir o procedimento, sempre que desejar colocar mais colunas em novas postagens!

* 1 - Para começar copie o trecho de código que está em vermelho.

 <div style="float: left; WIDTH: 45%">

Texto da Esquerda </div>



<div style="float: right; WIDTH: 45%">
Texto da

Direita </div>



<div style="clear: both"></div>


* 2 - Crie uma nova postagem e na aba(guia) "Editar HTML" cole.
* 3 - Agora é só substituir os textos correspondentes ao lado direito e esquerdo das colunas.

Modo 2 - Desse modo, você vai ter o código das colunas sempre disponíveis ao criar novas postagens.


* 1 - Primeiro acesse o seu painel de controle do blogger e siga o caminho (configurações -> formatação -> e em formatação role a pagina até o final tera um campo de texto com o título "Modelo de postagem".

* 2 - Nesse campo cole o trecho de código que está em vermelho e salve as configurações.

* 3 - Quando for criar uma nova postagem, já aparecerá o código das colunas ai é só fazer a parte 3 do modo 1 que está tudo certo.



Moleza né, qualquer dúvida é só postar um comentário.

Modo 2 - Desse modo, você vai ter o código das colunas sempre disponíveis ao criar novas postagens.

* 1 - Primeiro acesse o seu painel de controle do blogger e siga o caminho (configurações -> formatação -> e em formatação role a pagina até o final tera um campo de texto com o título "Modelo de postagem".

* 2 - Nesse campo cole o trecho de código que está em vermelho e salve as configurações.

* 3 - Quando for criar uma nova postagem, já aparecerá o código das colunas ai é só fazer a parte 3 do modo 1 que está tudo certo.





Moleza né, qualquer dúvida é só postar um comentário.

Rss Ultimos Comentários e Hank dos 10+ Mais Comentados No Blogspot

O Renan, do blog s3x0 pede o seguinte:
-----------------------
Renan: Eu aqui de novo. Amigo, eu não consegui adicionar os últimos comentários no blog seguindo seu tutorial, fica tudo em branco na área que era para ser mostrado os links p/ os comentários.
---------------
Amigo Renan, acredito que o que você pode fazer é verificar se o seu blog está com o rss ativo:

No painel de controle do blogger:
1 - Clica na aba Configurações

2 - Clica em Site Feed
3 - Em Permitir feeds do blog Marque completa

e salve as configurações.

Depois clique no link 1 e siga as intruções da próxima tela.
Link1

Outra dica que é fundamental para aumentar a velocidade e os controles sobre os rss, é queima-lo com o FeedBurner

Blogger redirecionará todo o tráfego de postagem do feed para o endereço criado no feedburner.
faça isso com o blogger e com todos os rss que você tiver, inclusive o rss dos ultimos comentários.
É só se cadastrar e tentar, acredito que seja simples, porem se ouver dúvidas é só comentar aqui no dicadedica, a sua dúvida pode ser a de mais alguem e se eu não souber eu tambem pergunto a outros bloggers.

Hank dos 10 posts mais comentados
Se quiser um hank do mais comentados, tambem pode acessar o link2 e se cadastrar analizar seu blog e gerar um Sharing & Widgets dos 10 +

Link2

Fácil porem duvidas já sabe Obrigado!

Hack Navegador de Paginas Para Blogger Blogspot

Respondendo ao pedido do adm do blog "Eusocurtooqueebom":
EU SO CURTO O QUE E BOM: Eu queria saber se tem como inserir um navegador de paginas no blogger, e possivel isso, vou ti mando o link da imagem e o site que encontrei esse assunto.
Ele quer um navegador como o da imagem abaixo, então encontrei um site que explicasse melhor os códigos do gosublogger e traduzi e adaptei algumas coisas:

Vamos começar:

Passo 1: Faça login na sua conta do Blogger e navegue até a seção Layout .
Agora acesse a subguia editar HTML.

Etapa 2: Pesquise e encontre
esta linha

]]></b:skin>

e adicione o esse código CSS acima dessa linha.

CSS CODE WITH IMAGE :

.showpageArea {font-size: 11px;
width:470px;background: url(http://i263.photobucket.com/albums/ii150/mohamedrias/ShowPagenavbar.jpg)
no-repeat left top; padding-top:10px;padding-bottom:10px;padding-right:15px;padding-left:30px;
color:#003366;text-align:left;

}

.showpageArea a {

color:#0F0;

text-decoration:underline;

}

.showpageNum a {

text-decoration:none;

color:#0F0;

border:1px solid #FFF;

margin:0 10px;

padding:0 5px 0 8px;

}

.showpageNum a:hover {

color:#FE8314;

border:1px solid #0071A5;

background-color:#FFF;

}

.showpagePoint {

color:#FE8314;

margin:0 8px 0 4px;

}

.showpage a {

text-decoration:none;

color:#FFF;

padding:0 2px 0 4px;

}

.showpage a:hover {

color:#FE8314;

text-decoration:underline;

} .showpageNum a:link,.showpage a:link {

text-decoration:none;

color:#cc0000;

}

Se você não quiser imagem de fundo, remova a URL da imagem e coloque o código da
cor lá.

Você pode ver alguns textos estão em vermelho, você pode alterar os textos a sua
escolha.

Ele deve ser semelhante a este:

Quando você adiciona CSS código para o seu modelo, ele deve ser semelhante a
esta

Etapa 3: Agora busca por este código ou relacionados em seu modelo (não há
necessidade de ampliar widgets)

<b:section class='main' id='main' showaddelement='yes'>

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

</b:section>

Agora Adicione Este script logo abaixo do </b:section>

&lt;script type=&quot;text/javascript&quot;&gt;



function showpageCount(json) {

var thisUrl = location.href;

var htmlMap = new Array();

var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==&quot;.blogspot.com/&quot;;

var isLablePage = thisUrl.indexOf(&quot;/search/label/&quot;)!=-1;

var isPage = thisUrl.indexOf(&quot;/search?updated&quot;)!=-1;

var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.length)
: &quot;&quot;;

thisLable = thisLable.indexOf(&quot;?&quot;)!=-1 ? thisLable.substr(0,thisLable.indexOf(&quot;?&quot;))
: thisLable;

var thisNum = 1;

var postNum=1;

var itemCount = 0;

var fFlag = 0;

var eFlag = 0;

var html= &#39;&#39;;

var upPageHtml =&#39;&#39;;

var downPageHtml =&#39;&#39;;



var pageCount =
2;

var displayPageNum =
3;

var upPageWord = &#39;Back&#39;;

var downPageWord = &#39;Next&#39;;







var labelHtml = &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a
href=&quot;/search/label/&#39;+thisLable+&#39;?&amp;max-results=&#39;+pageCount+&#39;&quot;&gt;&#39;;



for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp = post.published.$t.substr(0,10);

var title = post.title.$t;

if(isLablePage){

if(title!=&#39;&#39;){

if(post.category){

for(var c=0, post_category; post_category = post.category[c]; c++) {

if(encodeURIComponent(post_category.term)==thisLable){

if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){

if(thisUrl.indexOf(timestamp)!=-1 ){

thisNum = postNum;

}



postNum++;

htmlMap[htmlMap.length] = &#39;/search/label/&#39;+thisLable+&#39;?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount;

}

}

}

}//end if(post.category){



itemCount++;

}



}else{

if(title!=&#39;&#39;){

if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){

if(thisUrl.indexOf(timestamp)!=-1 ){

thisNum = postNum;

}



if(title!=&#39;&#39;) postNum++;

htmlMap[htmlMap.length] = &#39;/search?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount;

}

}

itemCount++;

}

}



for(var p =0;p&lt; htmlMap.length;p++){

if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){

if(fFlag ==0 &amp;&amp; p == thisNum-2){

if(thisNum==2){

if(isLablePage){

upPageHtml = labelHtml + upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}else{

upPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;/&quot;&gt;&#39;+
upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}

}else{

upPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+
upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}



fFlag++;

}



if(p==(thisNum-1)){

html += &#39;&lt;span class=&quot;showpagePoint&quot;&gt;&lt;u&gt;&#39;+thisNum+&#39;&lt;/u&gt;&lt;/span&gt;&#39;;

}else{

if(p==0){

if(isLablePage){

html = labelHtml+&#39;1&lt;/a&gt;&lt;/span&gt;&#39;;

}else{

html += &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/&quot;&gt;1&lt;/a&gt;&lt;/span&gt;&#39;;

}

}else{

html += &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+
(p+1) +&#39; &lt;/a&gt;&lt;/span&gt;&#39;;

}

}



if(eFlag ==0 &amp;&amp; p == thisNum){

downPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt; &lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+
downPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

eFlag++;

}

}//end if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){

}//end for(var p =0;p&lt; htmlMap.length;p++){



if(thisNum&gt;1){

if(!isLablePage){

html = &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;/&quot;&gt;&lt;/a&gt;&lt;/span&gt;&#39;+upPageHtml+&#39;
&#39;+html +&#39; &#39;;

}else{

html = &#39;&#39;+labelHtml + +&#39; &lt;/a&gt;&lt;/span&gt;&#39;+upPageHtml+&#39;
&#39;+html +&#39; &#39;;

}

}



html = &#39;&lt;div class=&quot;showpageArea&quot;&gt;&lt;span style=&quot;COLOR:
#000;&quot; class=&quot;showpage&quot;&gt; Pages (&#39;+(postNum-1)+&#39;):
&lt;/span&gt;&#39;+html;



if(thisNum&lt;(postNum-1)){

html += downPageHtml;



}



if(postNum==1) postNum++;

html += &#39;&lt;/div&gt;&#39;;



if(isPage || isFirstPage || isLablePage){

var pageArea = document.getElementsByName(&quot;pageArea&quot;);

var blogPager = document.getElementById(&quot;blog-pager&quot;);



if(postNum &lt;= 2){

html =&#39;&#39;;

}



for(var p =0;p&lt; pageArea.length;p++){

pageArea[p].innerHTML = html;

}



if(pageArea&amp;&amp;pageArea.length&gt;0){

html =&#39;&#39;;

}



if(blogPager){

blogPager.innerHTML = html;

}

}



}

&lt;/script&gt;



&lt;script src=&quot;/feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999&quot;;
type=&quot;text/javascript&quot;&gt;&lt;/script&gt;<div style='text-align:right;font-size:10px;color:000000;margin-top:15px;'>
<a href='http://rias-techno-wizard.blogspot.com/2008/07/page-navigation-hack-for-blogger.html'>Grab
this Widget ~ </a><a href="http://www.gosublogger.com/">GosuBlogger</a></div>

No código acima você pode editar o código das cores ao seu gosto.



1: pageCount var = 2;



O dígito em vermelho representa número de postos de trabalho a ser apresentado
na única página. Altere o dígito para mostrar as muitas páginas que você deseja.




por exemplo:



No meu blog eu ter colocado esse valor como 2. Em
cada página, você pode ver apenas 2 lugares.





2: displayPageNum var = 3;



aqui em vermelho representa o dígito do número de páginas a serem listados.



Por exemplo:



No meu blog eu ter escolhido 3 e, em seguida, 3 páginas serão mostradas.



É isso que agora temos acrescentado Page menu de navegação hack para o nosso
blog com êxito.



CSS código que irá atender quase todos os modelos. Por favor, não retire o link
de crédito.



Se você tiver alguma dúvida pergunte no comentário dessa seção. Os comentários
são muito bem-vindos, por favor, dar-me os seus comentários sobre este Blogger
Hack.

Conteúdo Traduzido e adaptado dos sites:

http://rias-techno-wizard.blogspot.com
http://www.gosublogger.com

Tutorial -> Código para copiar post para o seu blog

Refiz este tutorial e coloquei aqui: http://dicadedica.blogspot.com/2008/11/video-tutorial-hack-gostou-ento-copia.html

A pedido do ADM Downage abaixo o tutorial que ensina a colocar o código para copiar este post ,esse artigo ou essa notícia para o seu blog:

Gosto? Então copie esse post para seu Blog:



Download Do Tutorial

Esse Tutorial e Muito Util Para Os Bloggueiros

Você ira aprender Como colocar em baixo das suas postagem

Gostou ? então copie o Post

Assim outros Bloggueiros Podem Copiar seu post.

fonte: www.jinranger.blogspot.com

Refiz este tutorial e coloquei aqui: http://dicadedica.blogspot.com/2008/11/video-tutorial-hack-gostou-ento-copia.html