Globo Web

Mostrando postagens com marcador Códigos. Mostrar todas as postagens

segunda-feira, 18 de junho de 2012

Inserir um botão RECOMENDE em seu Site

Aprenda a colocar um botão de recomendações em seu site.Assim os usuários que gostarem de seu Blog poderão recomenda-lo aos amigos gerando assim mais tráfego.Copie o código abaixo e cole em um Widgjet em seu Blog.

MODELO

<center><a href="http://www.nafaixa.net/recomende/?pg=recomenda&site=http://seuSITEaqui.com&nome=NomeDoSiteAqui" target="_brank"><img border="0" src="http://i.nafaixa.net/omural/recomende/1.gif" /></a></center>
ou se quiser uma versão mais completa que abre em uma caixa de dialogo copie o código abaixo.
MODELO

<center><div class="widget-content"><script language="JavaScript">function RecHoaxNFfBf(URL) { var width = 200;var height = 200;var left = 99;var top = 99;window.open(URL,'recomendhoaxbynffbf', 'width='+width+', height='+height+', top='+top+', left='+left+', scrollbars=no, status=no, toolbar=no, location=no, directories=no, menubar=no, resizable=no, fullscreen=no');}</script><a href="javascript:RecHoaxNFfBf('http://www.nafaixa.net/recomende/?pg=recomenda&site=http://seuSITEaqui.com&nome=NomeDoSiteAqui');"><img src="http://i.nafaixa.net/omural/recomende/1.gif" border="0" /> </a></div></center>
Coloque em seu site e teste ...
Clique aqui e leia sobre mais métodos de divulgação para seu site

terça-feira, 16 de agosto de 2011

Inserindo uma nuvem de TAGs no Blog - Modelo de Código Simples

Para inserir uma nuvem de tags como aqui vê acima, basta utilizar esse código:

<a style="color:#9b2230; font-size: 11px;" href="#">TEXTO</a>

<a style="color:#000000; font-size: 14px;" href="#">TEXTO</a>

<a style="color:#940f04; font-size: 42px;" href="#">TEXTO</a>

<a style="color:#999999; font-size:17px;" href="#">TEXTO</a>

</div>

Insira quantas linhas forem necessárias
color é a cor da fonte
font-size é o tamanho da fonte
“#” é a url do marcador
TEXTO é nome do marcador

domingo, 14 de agosto de 2011

Caixa de texto com barra de Rolagem

Pra quem tem blog não existe nada melhor do que ferramentas que economizam espaço na Home Page, Caixa de texto com uma barra de rolagem pode diminuir esse espaço em até 90%. Outra boa forma de diminuir espaço na Home Page é o link Leia Mais

Bom esse modelo de caixa serve para manter os links intáctos ouu seja, o script não tem efeito dentro dela, o que a torna perfeita para colocar códigos de banner e JS ou outros códigos que você deseja que não faça efeito.

Continue Lendo...

terça-feira, 26 de julho de 2011

Inserindo banner's entre as postagens

Aprenda a inserir banner de publicidade entre as postagens de seu blog.
Acesse seu blog clique em design/ editar HTML.

Continue Lendo...

terça-feira, 12 de julho de 2011

Como construir um blog profissional de sucesso

Mediante à dificuldade que tive quando resolvi criar meu primeiro blog decidi reuni neste poste alguns de meus arquivos, idéias e pesquisas.
conteudo do arquivo.
- ferramentas (barra de pesquisa, caixa de texto, como personalizar seu favicon, redirecionador, tradutores de blog).
- Programa e modelos para criar seu próprio banner .
- dicas para criar um blog de sucesso.
- templates para começar a montar seu blog.
- livro ''como transformar seu blog desconhecido em um super blog''
- Como criar um blog profissional e lucrar muito com ele.
e muito mais, baixe o arquivo e veja você mesmo.

Clique aqui para baixar o arquivo.

Opção 2

O arquivo está compactado e com senha: globoweb.blogspot.com

Não copie e cole, digite a senha para que a estração funcione corretamente.

Qualquer duvida comentem .....

Contador de Postagem e Comentários

Responda rápido e sem olhar estatísticas: Qual o total de comentários e artigos atualmente no seu blog? Não sabe? Eu seeei, ná-ná-ná-ná... =P

E porque essa informação é importante? Claro que você, enquanto editor é fanático por estatísticas, se ainda não é, logo será... Mas tem mais gente olhando esses números.

Os anunciantes por exemplo, avaliam diversos dados para determinar quais os blogs mais relevantes dentro de determinado nicho. E qual a melhor forma de avaliar a influência de um blogueiro, que a quantidade de comentários que seus artigos recebem?

Pensando nisso, bolei um widget simples, mas que pode ser facilmente personalizado, para exibir a quantidade total de artigos e comentários de qualquer blog hospedado no Blogspot:

Este site possui atualmente:

3086 Comentários em 362 Artigos!

Widget GloboWEB

Para instalar é fácil, é só usar o código abaixo na sua barra lateral, moleza!

<div id='contador-compulsivo' align='right'><b>Este blog possui atualmente:</b><br/>
<script style='text/javascript'>
function showpostcount(json) {
document.write(parseInt(json.feed.openSearch$totalResults.$t,10));
}</script>
<script src='http://seublog.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showpostcount'></script> Comentários em <script src='http://seublog.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount'></script> Posts
!

insira também um contador de visitas, assim você terá um exelente controle de quantos acessos diarios, mensais e anuais tem em média. Clique aqui e veja.

domingo, 10 de julho de 2011

Como Exibir Sumários dos Posts com Link de “Leia Mais” No Blogger

Este é um dos Hacks para Blogger – Blogspot mais pedidos de todos os tempos: Posts Resumidos na Home Page do Blog, com link de “Continue Lendo” ou “Leia Mais” no final do resumo.

Existem outros hacks que cumprem a mesma função, de diferentes formas; mas depois de vários testes, este é o melhor, na minha opinião. Ele permite que você resuma somente os posts que desejar, como você já deve ter visto por aqui.

Vamos ao Hack! Preste atenção, pois ele está dividido em 3 partes:

I – Configurando o script
II – Modificando o Template
III – Configurando o Editor do Blogger

Continue Lendo...

Tradutores para Blog / Site

Senhores, recebi vários pedidos para postar um tradutor para tradução das páginas dos sites.
Bom segue abaixo dois tradutores testados por mim, eu recomento o do google pois tem mais línguas e é mais simples de de ser usado, mas testem os 2 e vejam qual se encaixa melhor em seu estilo.

Tradutor da Google

<center><div class="widget-content">
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=pt&w=160&h=60&title=&border=&output=js"></script>
</div></center>

Tradutor Simple Desenvolvido pelo GloboWeb

<center><img src="http://img176.imageshack.us/img176/6091/84056383at1.png"/></center>
<center><form id="translateForm" action="http://www.worldlingo.com/S1790.5/translation" target="_blank">
<input value="PT" name="wl_srclang" type="hidden"/>
<center><select style="font-size: 80%; width: 160px;" name="wl_trglang">
<option value="EN"/>Português - Inglês
<option value="FR"/>Português - Francês
<option value="DE"/>Português - Alemão
<option value="IT"/>Português - Italiano
<option value="PT"/>Português - Português
<option value="ES"/>Português - Espanhol
<option value="RU"/>Português - Russo
</select>
<input value="http://alexandrecoqueiro.blogspot.com/" name="wl_url" type="hidden"/>
<input style="font-size: 80%; width: 50px;" value="Traduza" type="submit"/>
</center></form></center>

quinta-feira, 7 de julho de 2011

Dividir o Header (Cabeçalho) - Para novos Templates

Este tutorial se aplica aos novos modelos de template (Designer do Modelo)
Para dividir o cabeçalho (header) nos novos modelos de template:

1- procure pelo seguinte trecho de código, no template (Editar HTML):

2- Substitua tudo por:

3- Salve a modificação e veja em Elementos de Página, como deve ficar o cabeçalho já dividido:

4- Dependendo da largura do layout (eu usei 990px) será preciso fazer ajustes na posição do banner. Para isso, vá em Designer do Modelo -> Avançado e em Adicionar CSS coloque o seguinte código:

#banner{margin: 20px 20px 0px 0px;}

Vá alterando os valores de margin até que o banner ocupe a posição desejada.

Meu modelo, antes e depois da alteração:

Antes

Depois

Fonte: Templatenovoblog

domingo, 3 de julho de 2011

Acelerar a indexação de seu site com o PING - Colocando site na primeira página do google e outros buscadores

No meu blog eu escrevo sobre variedades e, como são muitos artigos por dia tem a necessidade da indexação ser mais acelerada.

Quando começamos um blog, a primeira coisa que queremos é aparecer na primeira página do Google. Mas isso leva tempo e, não é uma tarefa fácil, é necessário enviar o link do nosso blog para os buscadores e, aguardar para que ele comece a ser indexado.

Mas depois que o nosso blog é indexado pela primeira vez demora dias para que o buscador volte para indexar os mais novos artigos. Além de colocar o feed do nosso blog na Central do Webmaster do buscador, existe também outra solução para resolver esse problema.

Ele se chama Ping e, serve para chamar a atenção de um servidor. Neste caso serve para avisar que o seu blog foi atualizado. Aqui está os links para você pingar o seu blog em cada serviço. Lembre-se de alterar “http://seusite.com” pela url do seu site.

Atenção: Onde está escrito seusite.com coloque o link de seu site/blog

Use esse link para acelerar a indexação do seu blog no Google
http://www.google.com/webmasters/tools/ping?sitemap=http://seusite.com/atom.xml?redirect=false

Use esse link para acelerar a indexação do seu blog no Bing
http://www.bing.com/webmaster/ping.aspx?siteMap=http://seusite.com/atom.xml?redirect=false

Por algum motivo o Ping do Yahoo não funciona, mas o link está aqui caso você queira testar
http://search.yahooapis.com/SiteExplorerService/V1/ping?sitemap=http://seusite.com/atom.xml?redirect=false

Caso você use o FeedBurner como feed do seu blog, existe também este link, já que para o seu feed ser atualizado automaticamente demora cerca de 30 minutos.
http://feedburner.google.com/fb/a/pingSubmit?bloglink=http://seusite.com/

Com estas dicas seu blog será indexado mais rapidamente.

Fonte: criarsite

sábado, 18 de junho de 2011

Criando um JS - PopUnder para parcerias

Pessoal acho que todo mundo já presenciou alguns fatos interessantes na internet, como por exemplo alguns sites que quando clicados abrem outro site...
Pois então esse método se chama JS de Parceria e funciona da seguinte forma, o dono de um determinado site insere o código do js no seu site e todo primeiro clique que o usuário der em seu site ele abrirá também o site que está endereçado ao js que vc colocou em seu site.
Bom chega de ladainha, agora vou ensinar como se faz um js.

primeiro baixe o arquivo abaixo:

Clique aqui para baixar
ou
clique aqui caso a primeira opção não funcione

o arquivo de estenção .js vc vai clicar com o botão direito e pedir para abrir com o notepad.
no campo onde ta escrito
var qburl = "http://www.alexandrecoqueiro.blogspot.com/"; /*< --- cole se link onde está alexandre coqueiro*/

vc vai substituir o link http://www.alexandrecoqueiro.blogspot.com pelo link do seu blog/site

depois disso vc vai ter que hospedar esse arquivo em um servidor FTP eu recomendo o XPG.COM.BR pois ele é gratuito (opte por criar uma página em HTML), depois de realizar o cadastro os dados para acesso ao servidor FTP serão enviados para seu email, eu recomendo utilizar o programa FILEZILA para manipular seu servidor FTP, ou após simplesmente acesse o site com seu usuario e senha e clique no botão acessar FTP WEB na parte inferior esquerda da sua tela.

Depois de hospedado copie a URL (url do local onde vc hospedou seu js, se foi no XPG deve ficar mais ou menos assim, www.nomeescolhido.xpg.com.br/nomedoarquivojs) e cole dentro deste código

<script src='cole o link do seu js aqui'/>

Agora vá em DESIGN (no seu blog), Editar HTML, procure o código: </body> e cole o código do JS após ele, boa sorte.

clique aqui para ver um vídeo esplicativo

clique aqui para ver tutorial xpg

segunda-feira, 13 de junho de 2011

Relógios para blog/site - Signos

Para utilizar os relógios abaixo basta copiar o código em vermelho e colar em seu blog

<div align="center"><embed src="http://www.cryd.com.br/relogios-feitos-em-flash/swf/09-09/28.swf" quality="high" wmode="transparent" type="application/x-shockwave-flash" width="170" height="170"></embed></div>

Fonte: Cryd

Relógios para blog/site - Racionais

Copie o código abaixo e cole em seu blog para usar esse relógio

Fonte: Cryd

sábado, 4 de junho de 2011

Mundando a cor do Menu e link OnMouse

Esse menu é fácil, muda de cor e a fonte aumenta ao passar o mouse, os dois efeitos são opcionais assim como pode ser adicionado outros efeitos, esse é feito usando css mas vou deixar um link para outro menu usando DHTML(tags JavaScript) nesse segundo menu não requer o uso de um script, apenas as tags onmouseover, e poucas outras, todas elas vão diretamente no link o que o torna muito simples,(Bom para usar em poucos locais) só que tem um porém esse segundo menu que está em outro post não tem seus efeitos de mudança de cor se o navegador do usuário não tiver JavaScript ativado.
Menu muda de cor com DHTML
Aumenta link ao passar o mouse(rato) a:hover {font-weight:bold;} no css.
Aumenta bastante o link ao passar o mouse a:hover {font-weight:bolder;} no css.

Menu muda de cor com css

O menu usa estilo css e div mais se quiser pode ser feito com table apesar de estar meio ultrapassado e se for observar poucos sites e blogs novos as utilizam.
Vou começar com o style css que deve ir entre as tags <head></head> ou arquivo.css externo:

<head>
<style type="text/css">

.lateral {border:1px solid #ccc;
position:relative;
width:270px;
text-decoration:none;}

a.menu {border:1px solid #ccc;
position:relative;
font: 12px Arial, Helvetica, sans-serif;
color:blue;
text-decoration:none;
display:block;
background-color:#CCFFFF;}

a.menu:hover {font-weight:bolder;
color:red;
background-color:#CCC;
text-decoration:none;
}</style>
</head>

Agora a parte que vai no <body>corpo</body> do html, no caso do blogspot é mais aconselhável inserir em layout, add elemento, HTML/JavaScript(apesar de não usar JavaScript):

Eu vou explicar algumas tags mais fáceis de mudar e que fazem modificações na apresentação do menu:
Uma explicação sobre o código css(não use esses):

DIV que "segura" os links do menu
.lateral { pode ser mudado as configurações da DIV onde fica os liks width:270px;(largura) deve ser maior que o tamanho do link}

configuração do link antes de passar o rato(mouse)
a.menu {
font: 12px Arial, Helvetica, sans-serif;(tamanho e tipo de fonte do link)color:blue;(cor azul da fonte do link, poderia ser #0066CC)
text-decoration:none;(não permite que o link fique com um traço embaixo...)
display:block; (vai fazer o link se estender lateralmente até a largura total da div)
background-color:#CCFFFF;(cor de fundo do link)}

configuração do link ao passar o rato
a.menu:hover {
font-weight:bolder;(faz a fonte "aumentar" muito, negrito)
color:red;(cor vermelha da fonte do link)
background-color:#CCC;(cor cinza, fundo do link)}

Para a fonte aumentar(negrito) um pouco font-weight:bold;
font: 14px Arial, Helvetica, sans-serif; (poderia ser adicionado, para aumentar o link ao passar o mouse uma fonte maior) no css para a.menu:hover{ }

Se for usar no blogspot e mexer no HTML faça uma cópia dele antes se vc não está muito habituado, o próprio css de um blog ou site pode influenciar, mas dificilmente da grande diferença, faça testes o pior que pode acontecer é aprender com algum erro.
Se usar folha de estilo externa e existir estilização css no seu html(in line)essa terá prioridade. Para saber tudo de css visite o site do maujor.
Agora vou colocar o css no HTML, fazer o teste no blog e ver como funciona.

Agora sem usar a div lateral na volta dos links, e, sem o display:block;(no css) que tem a função de ocupar espaço lateral total. Se tiver espaço os links do menu ficarão lado a lado:

<a class="menu" href="#">Link imagem blogger</a>
<a class="menu" href="#">Link favoritos</a>
<a class="menu" href="#">Menu dhtml</a>

segunda-feira, 30 de maio de 2011

Personalizando seu Favicon

Favicon e aquele icone que fica junto a barra de endereços do navegador:

Você pode substituir o favicon do blogger por um personalizado:
Crie uma imagem 16x16 e hospede o link em um servidor,depois va em editar html e localize o código a seguir:

b:include data='blog' name='all-head-content'/

ele esta bem no começo, e logo abaixo dele insira esse código

<link href='URL DA IMAGEM' rel='shortcut icon' type='image/x-icon'/>

Retirar barra do Blogger

Clique na imagem para ampliar

Para retirar a barra do blogspot basta colocar este código:

<style>
#navbar-iframe { height:0px; visibility:hidden; display:none }
</style>

Para fazer isso vá em layout e escolha a guia editar html, quando aparecer o código do seu blog procure por: <head>(isso está bem no começo do html) e cole o código acima depois é só clicar para salvar e pronto a barra na parte superior do blogspot já desapareu.

Depois das atualizações do Blogger com os novos modelos de template com o surgimento da pagina designer do modelo, quando retirar a barra do blogspot geralmente fica um espaço vazio no lugar dela, isso é causado por esse código que você encontra na pagina editar html.

.content-outer {
margin: 0 auto;
padding-top: 20px;

Então você precisa retirar esse padding-top: 20px; porque é isso que faz aparecer esse espaço vazio no inicio do seu blog.

Fonte: http://www.dicasparablogs.com.br

segunda-feira, 23 de maio de 2011

Saiba o numero de visitantes de qualquer site

Quer saber a média de visitas diárias que aquele blog ou site do mesmo segmento que o seu (a.k.a. Concorrente) deve ter? Com o Statbrain.com você pode e o melhor, sem gastar nada!

O serviço, que é gratuito e dispensa cadastro, calcula a média de visitantes diários de qualquer site levando em conta esteatíticas matemáticas combinadas com informações públicas de serviços como Alexa Rank, Google e Yahoo!

Segundo o Statbrain.com o UsuárioCompulsivo tem uma média de 2,144 visitas diárias. Um número impressionantemente preciso, tratando-se de um serviço que não tem acesso aos nossos dados estatísticos reais.

Fonte: http://ferramentasparablogger.blogspot.com/

Mostrar Quantas postagens e comentarios tem seu blog

Mostre a seus visitantes quantas postagens você já publicou em seu blog e oo número de comentários. Copie o código abaixo e ole no HTML/Javascript em seu Blogger. Coloque o nome de seu blog e salve.

Este blog tem: <script style="text/javascript">
function showpostcount(json) {
document.write(parseInt(json.feed.openSearch$totalResults.$t,10));
}</script>
<script src="http://NOME DO SEU BLOG.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script> postagens e
<script src="http://NOME DO SEU BLOG.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showpostcount"></script>comentários

Fonte: http://ferramentasparablogger.blogspot.com/

domingo, 22 de maio de 2011

Botões para avaliação de postagem

Agora no Blogger poderemos colocar botões para avaliação abaixo de cada postagem. Mas este recurso só está disponível no Blogger Draft.Para obter este recurso clique AQUI e entre no Blogger Draft.

Clique em "Layout"

Agora clique em "Editar" em POSTAGENS NO BLOG

Agora ao abrir essa janela você verá "Reações", selecione a caixinha.

Salve !

Agora vá até o HTML do seu blog, clique em "Expandir modelos de widget" e procure pelo código:

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

Cole então depois dele o seguinte código:

<span class='reaction-buttons'>
<b:if cond='data:top.showReactions'>
<table border='0' cellpadding='0' width='100%'><tr>
<td valign='center'><span class='reactions-label'>
<data:top.reactionsLabel/></span>
</td>
<td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
</tr></table>
</b:if>
</span>

Fonte: http://ferramentasparablogger.blogspot.com/

sábado, 21 de maio de 2011

Bloqueando CTRL + U - Botão direito do mouse

Neste tópico estou trazendo uma maneira simples e fácil de se bloquear o botão direito em sites apenas utilizando HTML.

- Bloqueando Botão Direito

Substitua a tag <body> do seu site por essa abaixo:

Citação:

Claro que existe uma maneira de burlar essa técnica, mas não vou citar neste tópico.

- Bloqueando Teclado para que o usuário não use o famoso CTRL + U

Substitua a tag <body> do seu site por essa abaixo:

Citação:

Espero ter ajudado.

Fonte: http://ferramentasparablogger.blogspot.com

Pages

Contador de Visitas

Assine nosso Feed

Menu

Publicidade

Parceiros de Link

segunda-feira, 18 de junho de 2012

terça-feira, 16 de agosto de 2011

domingo, 14 de agosto de 2011

terça-feira, 26 de julho de 2011

terça-feira, 12 de julho de 2011

domingo, 10 de julho de 2011

quinta-feira, 7 de julho de 2011

domingo, 3 de julho de 2011

sábado, 18 de junho de 2011

segunda-feira, 13 de junho de 2011

sábado, 4 de junho de 2011

Menu muda de cor com css

segunda-feira, 30 de maio de 2011

segunda-feira, 23 de maio de 2011

domingo, 22 de maio de 2011

sábado, 21 de maio de 2011

Pesquisa

Adicione ao seu Blog

Recomende - nos

Arquivo do Blog

Parceiros de Banner

Seguidores

Nuvem de Tags