quarta-feira, 5 de julho de 2017

Lista de Postagens Populares na Horizontal

Enviado em 11:01
  
Um dos novos widgets que eu mais gosto (e uso nos meus outros blogs) é o de Postagens Populares. É uma maneira interessante de atrair seus visitantes para outros textos que talvez não se apresentem na página inicial, além de mostrar os assuntos que mais agradam seus leitores. No entanto, por padrão, a lista aparece na vertical, limitando a possibilidade de mostrá-la em outras áreas do blog que não a sidebar, além de ocupar bastante espaço da coluna lateral, mesmo que se escolha poucos posts a serem mostrados.
Uma maneira que considerei interessante foi mostrar esta mesma lista na horizontal, dentro de alguma div que ocupe toda a largura da página, como a div #crosscol-wrapper (e neste caso, apareceria abaixo do cabeçalho, como neste blog).

Também é possível arrastar o widget para o Footer, por exemplo, e a apresentação dos Posts Populares ficaria no final da página 

Tutorial para quem usa os Modelos de Layout(2006)

A primeira coisa que se deve fazer é se certificar da largura total de #outer-wrapper (a div que engloba todas as outras). Procure no CSS do seu template por #outer-wrapper e veja o valor que está em width. Se no seu template este valor for 100%, será preciso então definir um valor para #content-wrapper (a div que engloba #main-wrapper e #sidebar-wrapper). Se o valor de width em #outer-wrapper for algo como 980px, não será preciso definir #content-wrapper.

Para definir uma largura para content-wrapper, acrescente no CSS (imediatamente acima da tag ]]></b:skin> ):

#content-wrapper{margin: 0 auto; width: 990px}

o valor de width deve ser alterado conforme a largura que você desejar.

Tendo definido uma largura para content-wrapper, acrescente também este trecho (ainda acima da tag ]]></b:skin> ):

#crosscol-wrapper{margin: 0 auto; padding: 0px}
#PopularPosts1{width: 100%; margin: 0px auto; padding: 5px 0px} /*define que o widget ocupe 100% de largura */
#PopularPosts1 h2{font-size:18px;text-align:left; border-bottom: 1px dotted #fff} /*estilo para o título do widget */
.PopularPosts .widget-content{float:left;margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
.PopularPosts .widget-content ul {margin: 0px auto;padding: 0px 0px;width: 100%; list-style:none; } /* estilo para a lista de posts */
.PopularPosts .widget-content li {margin: 0px 6px 10px 6px;width: 182px;padding: 0px;height: 180px; overflow:hidden;list-style:none; float:left; border: 1px solid #fff;} /*estilo para cada item da lista. Altere os valores de width, height, border, etc, para que se encaixem na largura total. */
.item-content{font-size: 12px; text-align:left; padding: 5px 10px} /* estilo para o resumo do post */
.PopularPosts img{margin: 0px 0px;padding: 4px; background: #fff; float:right} /*estilo para a imagem */
.PopularPosts .item-title{line-height:1.3em} /* estilo para o titulo de cada post */

Salve a modificação. Em Elementos de Página, arraste o widget Postagens Populares para sob o cabeçalho (ao arrastar, deve aparecer um retângulo  onde se deve encaixar o widget), ou para #footer.

Se você desejar, poderá também colocar no início ou final da coluna dos posts, mas deverá modificar as medidas para que se encaixem na largura da coluna.  No meu exemplo, as medidas são ideais para #content-wrapper com width: 990px; mostrando cinco posts populares por 'linha'.

Se quiser mostrar os posts populares apenas na primeira página, vá em Editar HTML, clique em Expandir Modelo de Widget e encontre o widget PopularPosts expandido. É um código bastante extenso e a condicional (em vermelho) deve ser colocada logo após <b:includable id='main'> e seu fechamento logo antes de </b:includable> como mostrado abaixo:


<b:widget id='PopularPosts1' locked='false' title='Populares' type='PopularPosts'>
<b:includable id='main'><b:if cond='data:blog.url == data:blog.homepageUrl'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    <ul>
 ......... mais código .........


  </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div>
</b:if></b:includable>
</b:widget>

Para os que usam os Modelos de Designer

Para os que usam os novos modelos, fiz este teste mas é necessário fazer algumas aterações no HTML. Primeiro vá em Designer do Modelo => Avançado e em Adicionar CSS, acrescente os códigos passados acima (aqui, a única diferença será que você deve especificar uma medida exata de largura e altura para #crosscol-wrapper, como na imagem abaixo - clique para ampliar -):


Salve a modificação e vá em Editar HTML e procure por:

<div class='region-inner tabs-inner'>
      <b:section class='tabs' id='crosscol' maxwidgets='1' showaddelement='yes'/>
      <b:section class='tabs' id='crosscol-overflow' showaddelement='no'/>
    </div>

E acrescente depois de </div>:

<div id='crosscol-wrapper'>
<b:section class='crosscol' id='crosscol-wrapper' maxwidgets='1' showaddelement='yes'>
</b:section>
</div>
Salve as modificações e em Elementos de Página, arraste o widget Posts Populares para o espaço abaixo do cabeçalho.

Se quiser mostrar os posts populares apenas na primeira página, deixe desta maneira:

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<div id='crosscol-wrapper'>
<b:section class='crosscol' id='crosscol-wrapper' maxwidgets='1' showaddelement='yes'>
</b:section>
</div>

</b:if>

Como sempre, acho muito mais fácil fazer do que explicar, por isso, se tiverem dúvidas, não hesitem em deixar nos comentários.

Melhores programas de afiliados, O que são programas de afiliados.

Enviado em 10:59


Tenho recebido diversas mensagens por e-mail ou através da nossa página no Facebook, referente a dúvidas sobre programas de afiliados e como ganhar dinheiro na internet. Nessa postagem vou esclarecer algumas dúvidas sobre essas perguntas.
O que são programas de afiliados? 

Programa de afiliados é um sistema onde você cadastra seu blog ou site em um site de uma empresa em que faz afiliação e, a partir daí, você passa a exibir anúncios em sua página e ganhar dinheiro com isso.


Como me cadastrar? 

Existem vários programas de afiliados, uns são confiáveis, outros não. Ao se cadastrar no site do programa de afiliados, o seu site/blog passa por uma avaliação, caso seja aprovado, você receberá um código HTML que irá implantar no HTML do seu blog. Depois disso, os anúncios começam  a ser exibidos.



Como ganhar dinheiro exibindo anúncios no meu blog/site? 

Após implementar os anúncios no seu blog, você irá receber de acordo com o afiliado, por exemplo, pode ser por cliques, impressões, visualizações, etc.



Da pra ganhar dinheiro exibindo anúncios?

A resposta para essa pergunta é simples, sim. Mas isso depende de você.  Depende de quantas visitas seu blog/site tem por dia. Sites com muitas visitas tem condições de ganhar mais dinheiro do que aqueles que tem poucas visitas.

Antes de ne cadastrar em qualquer programa de afiliados, eu faço uma busca por relatos de cada um na internet. Procuro saber se eles são confiáveis, se pagam em dia, se existem muitas reclamações. Criei a lista abaixo de acordo com experiências que tive com cada um deles, e alguns ainda estou testando.



como ganhar dinheiro na internet

Google Adsense é  um dos melhores programas de afiliados, ele paga por clique e melhor ainda, paga em dólar. Porém, eles são muito rígidos, e se você clicar nos anúncios ou seu site não estiver dentro dos termos exigidos por eles, sua conta simplesmente é banida e você  nunca mais poderá voltar a usar o programa novamente. O sistema de pagamento deles é por conta corrente ou conta poupança. Assim que você atinge 10 dólares, eles enviam para seu endereço, uma carta em inglês com o número do seu PIN, a partir daí, você só irá receber seus ganhos, quando atingir 100 dólares. Eu já usei o Adsense em outros blogs, mas não tive tantos lucros quanto tenho com outros programas de afiliados. Clique aqui para se Cadastrar no Google Adsense.




http://ads.egrana.com.br/indica/25582

Na minha opinião, o egrana é o meu favorito. Já ouvi algumas pessoas falando mal sobre ele, que o egrana não paga corretamente, etc. Eu não tenho o que reclamar sobre esse programa de afiliados, eles sempre me pagam em dia e, sempre me respondem os e-mails sobre minhas dúvidas. O egrana paga por visualização. Como isso funciona?  É simples, você adiciona o código HTML que será criado por eles, no HTML do seu blog. A partir daí, apareceram janelas popunder todas as vezes que acessarem seu blog. Quando você atingir 1.000 visualizações, você ganha de RS 2,00 a RS 8, 00 por cada 1. 000. Então se seu site tem muitas visualizações, compensa muito. Eles pagam quando você atingir RS 50, 00. Assim como o Adsense, o engana também paga por conta corrente ou poupança.  Clique aqui e se Cadastre no Engrana.




Bom, eu testei o programa de afiliados AnunciaD aqui no blog e não obtive lucros muito bons. Andei pesquisando em sua página no Facebook e vi algumas reclamações referentes a contabilização de cliques e visualizações. Por esse motivo, e por achar que para mim não compensou, retirei os anúncios do blog. Não cheguei a receber deles porque nunca atingi o valor de RS 50,00 exigido para saque. Mas já li alguns relatos de pessoas que disseram que eles pagam em dia e são bons. Não posso dizer sobre isso, minha experiência não foi boa, mas pode ser que você consiga. Clique aqui e se Cadastre no AnunciaD





https://www.hotwords.com/pt
É um programa de afiliados muito bom. Ele 'marca' algumas palavras das suas postagens onde são exibidos anúncios. Infelizmente, eles não aceitam a plataforma blogger, por esse motivo, ainda não consegui testa lo. Já li vários depoimentos falando muito bem sobre ele, por isso o adicionei nessa listagem. Clique aqui para se cadastrar no HotWords.




UOL afiliados é um programa de afiliados é muito bom. Ele é semelhante ao Google Adsense é também paga por cliques. Por ser um programa de afiliados de um dos maiores provedores de internet do Brasil, isso faz desse afiliado um dos melhores e mais confiáveis. A única desvantagem é que eles somente pagam por conta corrente, não aceitando conta poupança ou Paypal. Clique aqui para se cadastrar no UOL Afiliados.



Existem uma série de programas de afiliados que são bons e que realmente você pode obter lucros com eles. Nessa postagem, optei por classificar apenas aqueles que eu já testei e indico, ou aqueles em que eu já ouvi falar muito bem. Em breve estarei publicando uma nova série de postagens sobre como ganhar dinheiro com seu sobre com programas de afiliados.

Se você usa ou conhece algum outro programa que não está na lista, deixe um comentário sobre sua experiência com eles.

Como colocar a Barra de Menus no Blogger

Enviado em 10:57

Vamos lá!
1º ) Clique em PÁGINAS
2º ) Clique em NOVA PÁGINA

Logo após irá aparecer uma página igual a de um novo post:
- Coloque o título (contato, sobre, diy, etc...)
- Escreva o conteúdo que você deseja informar
- Publicar
- Clique em Visualizar Blog para fazer um teste para ver se deu tudo certo
OBS.: Se for um botão só para informar um conteúdo, como o seu contato ou sobre o blog é só seguir os passos.


Se o botão que você criou deve ser um link, para assim que o leitor clicar e levar à outra página da web, faço o seguinte:
1º) Vá em Layout
2º) Clique em Adicionar um Gadget
3º) Adicione o Gadget Páginas


Em seguida aparecerá esta tela. Clique em Adicionar página de link.


Coloque o Título da sua página e abaixo o link da página que você quer que o botão redirecione os seus leitores.
Depois é só clicar em Salvar Link.

Prontinho!!! :D
Lembre-se: Sempre faça um teste antes pra ver se deu tudo certinho, ok?

Agora para você editar a fonte, cor e tamanho você vai em:
MODELO > PERSONALIZAR > AVANÇADO > TÍTULO DAS GUIAS.

Espero que tenha ajudado quem tinha dúvidas. 

Como Criar um Menu no blog

Enviado em 10:56
O Menu de um blog é uma das ferramentas principais. É Lá onde se localiza os principais assuntos e tópicos do seu blog. Vamos aprender através desse tutorial, a criar um menu de páginas para facilitar a navegação de seu blog.

Como Criar um Menu no blog



Para criar um menu de páginas no blog, primeiro você ira precisar criar suas páginas de menu. Para fazer isso você precisara ter alguns tópicos específicos de seu blog para que possa ser destacado nessa área. Recomenda-se colocar sempre no menu, os assuntos mais abordados de seu blog, assim como seu formulário de contatos, para que os leitores possam entrar em contato com você, e esse estando em destaque no menu facilita bastante o encontro dessa área. Também é aconselhável colocar o link da parte 'Sobre' que é a área do blog, onde você irá falar um pouco sobre você e seu blog. Esse dois tópicos são fundamentais em um bom menu de páginas. No restante você pode acrescentar páginas que você ache que irá interessar o leitor de seu blog. 


Para criar as páginas, você deverá acessar o menu de seu blog, lá escolher a opção páginas. Feito isso, escolha a opção, Nova página, para que assim você possa começar a criar o seu menu.
Como Criar um Menu no blog
Feito isso, irá abrir uma nova área para a criação da página, onde você deverá dar um nome para o link. Essa área é muito parecida com a área onde são criados os posts. Lá você deverá escreve no titulo, o nome que você deseja que apareça no menu de suas páginas, por exemplo se você deseja uma página que fale sobre seu blog, use o titulo como SOBRE. E assim por diante. Na área de postagem você irá preencher com o conteúdo que deseja que apareça dentro da página especifica. Lembre-se que a cada nova área em seu menu, você deverá criar uma nova página.

Por fim, quando todas as suas páginas já estiverem criadas, você irá visualiza-las da como mostra a imagem a seguir.
Como Criar um Menu no blog


Para que as página apareçam corretamente em seu blog, você devera adicionar o Gadget de páginas no Layout de seu blog. Agora as páginas estão corretamente adicionadas em seu blog. 

Como Criar um Menu no blog


Para que as páginas apareçam no seu layout, clique na aba páginas, Editar e em seguida clique nas páginas que você deseja que apareçam. Você pode arrastar para colocar na ordem que preferir.

Como remover propagandas indesejadas do seu blog

Enviado em 10:52
É comum instalarmos um programa em nosso computador, extensão no navegador ou complemento de origem desconhecida, sem saber que este programinha pode causar grandes problemas. Estes programas apresentam propagandas em suas páginas com um único objetivo: geral renda sobre seus cliques.

Resumindo tudo isso. Você instala um programa ou extensão qualquer, e ela exibe (geralmente sem sua permissão) diversas propagandas, banners, links, em seu blog e demais páginas acessadas e obtêm lucro sobre isso. Abaixo, listarei alguns procedimentos interessantes a serem feitos para acabar com esse problema:

1. REMOVA EXTENSÕES DO SEU NAVEGADOR

Extensões são uma das principais causas deste problemas. Extensões como Funmoods, Babylon, etc., são famosas quando se trata de problemas como estes.

Google Chrome

  1. Clique no menu do Google Chrome  na barra de ferramentas do navegador.
  2. Selecione Ferramentas › Extensões.
  3. Clique no ícone da lixeira  ao lado das extensões de origem desconhecida.

Mozilla Firefox

  1. Clique no ícone do Firefox  no canto superior esquerdo do navegador.
  2. Selecione Complementos › Extensões.
  3. Clique em "Excluir" ao lado das extensões desconhecidas.

Internet Explorer

  1. No canto superior direito, clique na engrenagem do IE.
  2. Selecione "Gerenciar Complementos".
  3. Na sessão "Barra de Ferramentas e Extensões", clique sobre a extensão e selecione "Desabilitar".

2. DESINSTALE PROGRAMAS SUSPEITOS


Como citado, programas também podem desencadear este tipo de problema.

Windows

  1. Clique no botão Iniciar .
  2. No lado direito, clique em "Painel de Controle".
  3. Procure pela opção "Programas".
  4. Selecione "Desinstalar um programa".
  5. De um clique duplo sobre o programa suspeito, e o desinstale.

3. FAÇA UMA VARREDURA EM SEU COMPUTADOR EM BUSCA DE MALWARE

Malwares de diversos tipos podem ocasionar problemas como estes, além de outros muitos incômodos e prejuízos a seu computador.

Use o AdwCleaner

  • Iniciar › Executar › Limpeza de disco › Execute a limpeza de todos os dados.

Opte por outros programas com funções semelhantes

  • Existem diversos softwares que podem ser úteis na remoção de malware, e até mesmo o seu bom e velho anti-vírus pode ser útil.

4. FAÇA A LIMPEZA DO CACHE E DOS COOKIES DO NAVEGADOR

Um procedimento antigo, que é útil em diversas situações.

Google Chrome

  1. Clique no menu do Google Chrome, na barra de ferramentas do navegador.
  2. Selecione "Ferramentas".
  3. Selecione Limpar dados de navegação;
  4. Marque todas as opções a serem excluídas, desconsiderando apenas opções de senhas e formulários salvos.
  5. Use o menu localizado na parte superior para selecionar a quantidade de dados que deseja excluir. Selecione desde o começo para excluir tudo.
  6. Clique em Limpar dados de navegação.

Mozilla Firefox

  1. No topo da janela do Firefox, clique no botão Firefox , selecione Opções, e clique no item Opções.
  2. Selecione o painel Avançado.
  3. Clique na aba Rede.
  4. Na seção Cache de conteúdo web, clique em Limpar agora.
  5. Clique em OK para fechar a janela de Opções.

Internet Explorer

  1. Abra a área de trabalho e toque ou clique no ícone do Internet Explorer na barra de tarefas.
  2. Toque ou clique no botão Ferramentas , aponte para Segurança e toque ou clique em Excluir histórico de navegação.
  3. Marque a caixa de seleção Cookies e dados de sites e toque ou clique em Excluir.

Outros navegadores

5. REMOVA GADGETS E CÓDIGOS INSERIDOS RECENTEMENTE EM SEU BLOG

Códigos JavaScript são conhecidos por ter diferentes funções. Comuns são os casos de erros e blogs provenientes de códigos JavaScript, desde simples anúncios não autorizados a até mesmo redirecionamentos para outras páginas, impossibilitando a visualização do blog.

Sabendo disso, é necessário que use apenas gadgets disponibilizados pelo Blogger, e insira códigos somente se forem de um site confiável e conhecido, pois você estará colocando seu blog em risco.

Gadget Postagens populares expansível com JQuery no Blogger

Enviado em 10:52
A maioria dos blogs que desejam uma maior divulgação do seu conteúdo possuem o gadget "Postagens Populares" instalado em seu layout. Este que por sua vez tem a função de agrupar as postagens com maior quantidade de visualizações em seu blog.

Já me ocorreram casos em que não pude inserir este gadget por falta de espaço, ou por uma certa desorganização, e com isso, procurei um método de torna-lo expansível. Um efeito com jQuerry Toggle me permitiu este feito! O código tem uma função simples, que ao mesmo tempo é muito útil em blogs compactos: ao clicar sobre o link, ele oculta/exibe o gadget de postagens populares.

O código é dividido em 3 partes: o link de exibição, o CSS, e JavaScript, que fará a mágica funcionar. A instalação pode ser feita com o código diretamente no HTML do blog (que considero um procedimento mais complexo, para que não tem conhecimento básico sobre o assunto), ou então através de um gadget HTML/JavaScript. Neste tutorial, estarei ensinando a inserir o código através do gadget HTML/JavaScript.

INSTALANDO O GADGET POSTAGENS POPULARES


Se você já tiver o gadget adicionado ao seu blog, desconsidere essa etapa.

No painel do blogger, clique em "Layout", "Adicionar um gadget", e na janela que for aberta, selecione o gadget "Postagens populares".


Configure o gadget da maneira que desejar, escolhendo a quantidade de postagens a exibir e também as configurações referentes as miniaturas e descrição de postagem (se deseja exibi-las ou não). No título do gadget, insira este código: <h2></h2> e salve (fará com que o título não apareça).

INSTALANDO O GADGET HTML/JAVASCRIPT E INSERINDO O CÓDIGO


Faça o mesmo procedimento anterior, só que desta vez, ao invés de inserir o gadget de Postagens populares, escolha o gadget "HTML/JavaScript".


No conteúdo do gadget, insira o seguinte código:
<style type="text/css">
#PopularPosts1{
    display:none;
}
</style>
<script src='http://code.jquery.com/jquery-1.9.1.min.js'> </script><!-- adiciona biblioteca jquery --><script type='text/javascript'>
$(document).ready(function() {
    $("#botao_pp").click(function(){
  $("#PopularPosts1").toggle("bounce");
    });
});
</script>
<a id="botao_pp" style="cursor: pointer;"><h2>[+/-] Postagens populares</h2>
</a>
Salve o gadget e verifique se tudo está funcionando corretamente no blog. Uma dica é que organize o gadget com o código acima do gadget de Postagens populares, para dar uma efeito mais interessante ao recurso, como se estivesse clicando no título do gadget de Postagens populares para o exibir.

ENTENDENDO O CÓDIGO

CSS - É bem simples, mas tem uma função essencial. A propriedade display:none faz com que o gadget de postagens populares fique oculto até o uso do código jQuery.
JavaScript - Responsável por toda a mágica de mostrar/ocultar no gadget, sem ele nada funcionaria.
HTML - Tem a função da criação do link. É possível que altere os valores que se encontram entre a tag <a>, por um botão, imagem, etc.

E SE NÃO FUNCIONAR?

Verifique se o valor indicado pela id no código do gadget é o mesmo que é indicado pelo gadget do blog. Pois em alguns casos (quando inserimos dois ou mais gadgets Postagens populares), o valor da id se torna PopularPosts23.. variando conforme a quantidade, e para que o código funcione, o código jQuery deve possuir a mesma id que o gadget possui no HTML. Esta postagem foi formulada através deste tutorial semelhante, no entanto com outro gadget e configurações diferentes.

Templates Responsivos (Profissionais) para Blogger

Enviado em 10:51
Um template responsivo, é um template que se adapta a todos os dispositivos onde ele é visualizado, sempre mostrando qualidade na exibição do conteúdo do seu blog. Um template assim que deixa seu blog com uma aparência profissional, além de ficar muito bonita. Nesta breve postagem, indico um site muito bom, com ótimos templates Responsivos e Profissionais para seu blog, deixando seu blog mais bonito visualmente, e também mais prático conforme é acessado por diferentes dimensões de tela. O site citado é o Templateism. No site você encontrará diversos templates, e certamente encontrará um que é a cara do seu blog.


Cada template possui os créditos ao autor e ao site que o produziu, e que o direito sobre o conteúdo do template registrado. Portanto, não remova os créditos, pois além de ser algo anti-ético, pode ocasionar problemas futuros ao seu blog, quanto ao uso indevido de material protegido por direitos autorais.

COMO INSTALAR NO SEU BLOG

O processo de instalação é feito através do Modelo do blogger, podendo ser realizado através da colagem do código XML diretamente no código do Blogger, ou do upload do arquivo .xml através da ferramenta "Fazer Backup/Restaurar", usada para importar/exportar modelos xml. 

© 2017 Webzoon. Designed by Bloggertheme9
Powered by Blogger.
back to top