iceBreaker
Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.
Entrar

Esqueci-me da senha

Blogger
WordPress
Divulgue seu Blog
Software
Hardware
Geral






Últimos assuntos
» Site de seguidores
WidGet Posts Mais Acessados (Top Posts) EmptyTer Out 14, 2014 6:03 am por David70

» Promoção: Você no Guia Twitter!
WidGet Posts Mais Acessados (Top Posts) EmptySex Set 12, 2014 3:34 am por ashley1

» Como colocar marcador como menu no blogger
WidGet Posts Mais Acessados (Top Posts) EmptyDom Set 07, 2014 8:13 pm por Giovanne

» Como colocar caixa de comentarios do facebook no blogger com modelo Dinâmico
WidGet Posts Mais Acessados (Top Posts) EmptyDom Set 07, 2014 7:58 pm por Giovanne

» Posts Divididos Categoria na Pagina Incial (Seções)
WidGet Posts Mais Acessados (Top Posts) EmptyQui maio 15, 2014 10:14 am por Claudiney W.

» TgaDowns Confiram! e Acessem!
WidGet Posts Mais Acessados (Top Posts) EmptyQua Out 30, 2013 8:24 am por zohanx747

» Download do Chrome OS Beta (Versão não oficial)
WidGet Posts Mais Acessados (Top Posts) EmptyTer Out 08, 2013 7:58 am por blackrose

» Novas tecnologias
WidGet Posts Mais Acessados (Top Posts) EmptySeg Set 16, 2013 6:04 am por timpane

» Good webcam for desktop?
WidGet Posts Mais Acessados (Top Posts) EmptySex Ago 30, 2013 3:13 am por stive951

» Promoção: Quer Ganhar Um Domínio Próprio(.com ou .net) para seu Blog?
WidGet Posts Mais Acessados (Top Posts) EmptyTer Jun 25, 2013 1:12 am por gilroy

Últimas Atualizações

WidGet Posts Mais Acessados (Top Posts)

2 participantes

Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty WidGet Posts Mais Acessados (Top Posts)

Mensagem por Felipe CDs Ter Mar 16, 2010 12:17 pm

Neste tutorial, irei encinar a como deixar a widget do PostRank exibir somente lista de link das postagens mais acessadas, como mostra a imagem abaixo.

WidGet Posts Mais Acessados (Top Posts) 29cswfp
(ScreenShot do meu blog)

Espero que gostem do tutorial e támbem itendam. ;D

Bem, eu vinha procurando uma solução para uma windget dos posts mais acessados para o Blogger, mas a única opção e única alternativa que tinha era o PostRank. Então o que fiz foi tentar melhorar o visual e deixar apenas a lista de links, e depois de tantas tentativas sem sucesso já tinha desistido, pois apenas o que eu conseguia era retirar o background da widget do PostRank padrão, até ai ficou tudo perfeito, ficou a lista de links normal, mais ainda havia um campo para busca por postagem na widget, e ai começou o problema. Tentei tirar modificando a CSS, depois Javascript, procurei soluções pela web e a mais de 5 meses procurando e sem sucesso, acabei desistindo. Depois de um bom tempo, pelo menos 1 ano, olhando meu site, pensei em um pequeno detalhe que nunca havia pensado. Ontem pensei, "Eu sou muito burro mesmo!", a solução: colocar um comando para a "‹table›" não aparecer "Simple! XD".

Tutorial:

------------------------------------
Links Úteis PostRank:
Registre-se
Customizar WidGet
------------------------------------


Primeiro precisa cadastrar-se no site do PostRank Clicando Aqui. Na parte de customização da widget o site vai lhe fornecer um código para colocar no Blogger. Pegue apenas o ID que fica na seção "feed_hash".
Exemplo:

"feed_hash": "d426737211cd3361524d42e6c4f319d3",

Copie apenas o ID entre as aspas depois de "feed_hash".

Abra uma nova GadGet no Blogger e coloque o código abaixo e substitua a
frase "SEU ID AQUI" pelo seu ID gerado no site do PostRank.

Código:
<script src="http://www.yourjavascript.com/1219553607/mais_acessados.js" type="text/javascript"></script>
<script type="text/javascript">
var options = {
    "feed_hash": "SEU ID AQUI",
    "num":                  6,
    "theme":            "diy",
    "hasLink":            true
};
new PostRankWidget(options);
</script>

Este é o link para o Javascript da WidGet modificado: http://www.yourjavascript.com/1219553607/mais_acessados.js

Recomendo que hospede em outro servidor.

Explicação para entender melhor a configuração da widget:
---------------------------------------------------------------------------

"feed_hash": "SEU ID AQUI", --> ID de identificação da sua widget;
"num": 6 , --> Número de posts a serem exibidos;
"theme": "diy", -->Tema da widget;
"hasLink": true --> Link para a postagem (true: Ativa | false: Desativa).

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

Ocultando o campo de busca "
table":

Para ocultar o campo de busca, basta procurar na CSS do Template o trecho
referente a gadget onde a widget do PostRank está, no meu caso era o seguinte:

Código:
.sidebar {
    color: #ffffff;
    line-height: 1.6em;
    text-align: left;
    margin: 0;
  }

Basta adicionar o seguinte trecho:

Código:
.sidebar table {
    display: none;
    }

Obs.: A CSS que usei é no caso a do meu template, referente a minha gadget caso a classe ou ID da sua gadget for diferente, substitua a classe sidebar pela classe referente a sua gadget.

Pronto, agora basta visualizar o template e ver se está tudo correto.

Se você quizer ver a widget funcionando para ver como ficou basta acessar meu site: www.felipecd.com

Bem galera, é isso. Espero que goste do tutorial.

Atenciosamente,
Felipe Florindo.


Última edição por Felipe CDs em Seg Mar 29, 2010 10:03 am, editado 2 vez(es)
Felipe CDs
Felipe CDs

Mensagens : 16
Pontos : 5201
Data de inscrição : 10/02/2010
Idade : 35

http://www.felipecd.com http://twitter.com/Felipe_CDs http://www.blogger.com/profile/09636033705757089270 http://www.orkut.com.br/Main#Profile?uid=1470927253263607316

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Mais Acessados

Mensagem por miler Dom Mar 21, 2010 3:59 pm

Muito bom este tutorial!

Valeu e Obrigado!

Anonymous
miler
Convidado


Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Marcos Ter Mar 23, 2010 1:16 pm

1° É ERRADO fazer isto, eu fazia mas vique nãoera justo com o site post Rank.
2° masja que vc ja esta fazendo vou dar uma dica,n precisa hospedar o script em seu servidor o proprio postrank lhe da uma URL de script e a personalização é a mesma...
Marcos
Marcos

Mensagens : 61
Pontos : 5414
Data de inscrição : 05/10/2009
Idade : 32

http://wormswebgroup.blogspot.com/ http://twitter.com/vmarcosv

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Felipe CDs Ter Mar 23, 2010 8:18 pm

Marcos, só fiz isso porque fica deselegante o blog com o widget do PostRank completo, pois ele exibe numerações com cores definídas e para que não seja exibido as numerações e backgrounds do postRank e fique só a lista de links é preciso usar o javascript modificado que se encontra na URL que informei. se quizer podem usar o link hospedado no meu host, pois não vou excluir ele. Mas por via das dúvidas, recomendo que hospede ele em seu próprio servidor.

Mas quem quizer exibir os créditos do PostRank basta adicionar o código abaixo no final da widget:


Código:
<div style="text-align: center;"><span style="color: #484848; font: normal 11px Arial;">By <a href="http://www.postrank.com/" target="_blank" style="color: #ff9900; font: bold 11px Arial; text-decoration: none;">PostRank</a></span></div>

vlw! Wink
Felipe CDs
Felipe CDs

Mensagens : 16
Pontos : 5201
Data de inscrição : 10/02/2010
Idade : 35

http://www.felipecd.com http://twitter.com/Felipe_CDs http://www.blogger.com/profile/09636033705757089270 http://www.orkut.com.br/Main#Profile?uid=1470927253263607316

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Marcos Ter Mar 23, 2010 9:58 pm

na verdade o propriopost rank da uma versão sem NAD e garantoque deixoIGUAL AO SEU.
mas eu estou criticandoo fato de vc usar o post rank e n dar os devidos creditos.
E volto dizerque vc n precisa hospedar o script no seu servidor o proprio post rank lhe da uma URL...
e da para personalizar da mesma forma ...
Marcos
Marcos

Mensagens : 61
Pontos : 5414
Data de inscrição : 05/10/2009
Idade : 32

http://wormswebgroup.blogspot.com/ http://twitter.com/vmarcosv

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Felipe CDs Qui Mar 25, 2010 6:59 pm

Sei que o PostRank disponibiliza um script próprio e o tema limpo, mas não é perfeito. Daria até para bloquear a exibição de alguns caracteres com CSS, mas ele exibe outros elementos que não são ocutaveis com CSS, como o titulo ou a média de popularidade do post. Pois o script fornecido pelo PostRank cria como uma pagina html completa. Se você abrir o script, notará que há um link CSS que é esse (http://api.postrank.com/static/widget-v2.css), e no CSS existe definições para as TAGs "ol", "ul" e "li", sendo que no próprio template já criamos uma definição para as TAGs. O resultado disso ultilizando o javascript do PostRank é que ele aplica duas definições ao mesmo tempo. O resultado utilizando o JS do PostRank você pode ver na imagem abaixo, e o resultado usando o JS modificado você pode ver na imagem no topo deste tópico.

WidGet Posts Mais Acessados (Top Posts) 80518468

O resultado mesmo com o tema limpo da widget fica desastroso. É adicionado um segundo titulo a widget, é as médias de popularidade e o titulo das postagens aparecem em linhas individuais alem de aparecer campo de busca e o link do PostRank no início da widget.

O que fiz no JavaScript, foi apenas apagar os chamados de CSS do PostRank e que eu possa dar minhas próprias definições a lista de links. O proposito deste tópico foi oferecer uma widget limpa para que qualquer usuário possa dar uma aparencia própria a suas widget para que fique mais elegante.

No caso dos créditos, eu estava pensando em colocar uma barra no final da página, dando os créditos aos criadores de widgets, hacks Blogger, imagens, entre outros. Até porque devo créditos a muita gente! XD
Preciso dar créditos ao próprio IceBreaker (Sergio Estrela), porque os comentários me basiei nos blog dele, o PostRank, Usuário Compusivo, Dicas Blogger, jQuery, etc.

Marcos, gostei de você pelas suas idéias, críticas e sugestões. Espero colher idéias e cultivar uma amizade com você e todos que acessam o IceBreaker. Gosto muito de desafios, design e estou aberto para novas idéias. Wink

Vlw... Abraços!!!

________________________
www.felipecd.com | www.felipecds.net
Felipe CDs
Felipe CDs

Mensagens : 16
Pontos : 5201
Data de inscrição : 10/02/2010
Idade : 35

http://www.felipecd.com http://twitter.com/Felipe_CDs http://www.blogger.com/profile/09636033705757089270 http://www.orkut.com.br/Main#Profile?uid=1470927253263607316

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Marcos Qui Mar 25, 2010 10:06 pm

cara... vou ter quedizerque vc esta errado pela 3° vez...da para ocultar TUDO sim ...
falo pq eu SEI E JA FIZ ...
basta vc olhar um pouco mais...
vc n disse que gosta de desafio?
eu digoue da para deixr como esta o seu...
sem hospedar o proprio arquivo =) .
então esta feito o desafio lkkk
Marcos
Marcos

Mensagens : 61
Pontos : 5414
Data de inscrição : 05/10/2009
Idade : 32

http://wormswebgroup.blogspot.com/ http://twitter.com/vmarcosv

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Funciona imediatamente?

Mensagem por Rafael Ter maio 18, 2010 11:14 pm

O meu tá aparecendo os top posts do post rank. Como faço para ser os top do meu blog? Será que nau fuciona em blogs com templates com thumbnails?

Ou será q precisa esperar ter os acessos para que saia alguma coisa especifico do meu blog?
Anonymous
Rafael
Convidado


Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Felipe CDs Qua maio 26, 2010 12:19 pm

Rafael escreveu:O meu tá aparecendo os top posts do post rank. Como faço para ser os top do meu blog? Será que nau fuciona em blogs com templates com thumbnails?

Ou será q precisa esperar ter os acessos para que saia alguma coisa especifico do meu blog?

Você deve fazer primeiro o cadastro no PageRank, depois vvocê precisa customizar o widget, como mostra no tutorial. Na área de customização pede para que você insira sua URL do seu blog, onde vai ser gerada uma ID.

Leia o tutorial atentamente que você fará a widget funcionar.

Atenciosamente,
Felipe Florindo.
www.felipecds.net | www.felipecd.com
Felipe CDs
Felipe CDs

Mensagens : 16
Pontos : 5201
Data de inscrição : 10/02/2010
Idade : 35

http://www.felipecd.com http://twitter.com/Felipe_CDs http://www.blogger.com/profile/09636033705757089270 http://www.orkut.com.br/Main#Profile?uid=1470927253263607316

Ir para o topo Ir para baixo

WidGet Posts Mais Acessados (Top Posts) Empty Re: WidGet Posts Mais Acessados (Top Posts)

Mensagem por Conteúdo patrocinado


Conteúdo patrocinado


Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos