terça-feira, 23 de setembro de 2008

Editando links

Observação: Essas dicas podem ser usadas quando você estiver editando diretamente o HTML de uma postagem ou de um modelo. Ele não funcionará com o item Lista de links de Layouts.

Nesta imagem está demonstrado como adicionar um hiperlink numa postagem em seu blog. Hyperlink

O HTML de um link básico tem esta aparência: <a href="http://URL">TEXTO</a>

Com esse código, a pessoa que estiver visitando sua página da Web verá a(s) palavra(s) como o TEXTO. Esse texto ficará destacado, e quando alguém clicar sobre ele, a janela do navegador irá até o endereço especificado pelo URL.

Você também pode criar um link que as pessoas podem utilizar para enviar um e-mail a você. No exemplo acima, substitua apenas http:// por mailto: e use seu endereço de e-mail no lugar do URL. Ficará assim: <a href="mailto:myaddress@example.com">Envie um e-mail para mim!</a>

Às vezes, você quer criar um link para uma outra página da Web, mas quer abri-la em uma nova janela do navegador mantendo também a página original aberta. Para isso, basta adicionar target="_blank" ao link. Isso fará com que o navegador crie uma nova janela em branco para o link. O link terá, então, a seguinte aparência: <a href="http://URL" target="_blank">TEXTO</a>

Retirado da página de ajuda do Blogger (http://help.blogger.com)

terça-feira, 16 de setembro de 2008

Código para copiar texto

Aqui está um interessante código que eu achei no site Dynamic Drive. O código faz com que, por todo o site, onde o visitante selecionar algum texto com o mouse este será copiado e uma mensagem aparecerá com o texto selecionado. Veja uma demonstração do efeito aqui.

Para conseguir este código vá para a página de edição do blog LAYOUT--EDITAR HTML. Busque a tag </head> e cole ANTES desta o código na caixa abaixo. Salve as alterações e visualize o blog para comprovar.

Apenas lembre-se de que o script funciona apenas no Internet Explorer 5.0 +. Em outros navegadores nada acontecerá quando o visitante selecionar algum texto.

domingo, 14 de setembro de 2008

Setas na barra de título

Com este script você conseguirá um efeito que chama a atenção ao título de seu blog utilizando setas que apontam para ele na barra superior(para uma demonstração veja aqui: http://beckerqueiroz.googlepages.com/setas ). No entanto, uma coisa você deve levar em conta ao colocar este script em seu blog: muitas vezes animação contínua de texto imagem, etc em uma página acaba expulsando os leitores mais sérios e fazendo com que percam a vontade de visitar seu blog. Use com moderação este efeito para que isso não possa acontecer.

Cole o código abaixo em um novo elemento de página ou em outro lugar qualquer de seu blog. Não esqueça de modificar a parte do código em vermelho para o título de seu blog. Também, se você quiser, modifique os números em vermelho para modificar a velocidade do script. Bom proveito!

<script> var titletext="Título da página" var thetext="" var started=false var step=0 var times=1 function welcometext() { times-- if (times==0) { if (started==false) { started = true; document.title = titletext; setTimeout("anim()",1); } thetext = titletext; } } function showstatustext(txt) { thetext = txt; setTimeout("welcometext()",4000) times++ } function anim() { step++ if (step==7) {step=1} if (step==1) {document.title='>==='+thetext+'===<'} if (step==2) {document.title='=>=='+thetext+'==<='} if (step==3) {document.title='>=>='+thetext+'=<=<'} if (step==4) {document.title='=>=>'+thetext+'<=<='} if (step==5) {document.title='==>='+thetext+'=<=='} if (step==6) {document.title='===>'+thetext+'<==='} setTimeout("anim()",200); } if (document.title) window.onload=onload=welcometext </script>

sábado, 13 de setembro de 2008

Alerta com opções

Em uma postagem anterior eu mostrei como colocar em seu blog o código para um aviso que aparece cada vez que a página é atualizada. No entanto, aquele script só levava a opção de aceitar entrar no blog. Com este aqui o visitante tem a opção de fechar a página clicando em 'CANCELAR'. Ele aparecerá antes que a página termine de carregar, como no exemplo abaixo (claro que o aviso será outro!).

Clique aqui para ver um exemplo
Aviso com opções

Para consegui-lo use o código abaixo modificando apenas o aviso.

Bom proveito!

sexta-feira, 12 de setembro de 2008

Como conseguir uma imagem de sua tela

Esta é uma dica bem simples e rápida: mostra como conseguir uma 'tela' do seu computador, ou seja, uma imagem da tela sem usar câmara fotográfica... lol. Para conseguir a imagem da tela como ela está no momento pressione o botão de seu teclado PRINT SCREEN SYS RQ que fica junto às teclas F12 e SCROLL LOCK em alguns teclados (veja a imagem acima). A seguir, abra qualquer programa de edição de imagens, crie um novo documento e pressione as teclas CTRL + C. Salve o documento. Bom proveito!

quinta-feira, 11 de setembro de 2008

Informador do número de visitas

Os caros visitantes devem ter reparado que na minha barra lateral do blog há um aviso indicando o número de vezes que eles atualizam a página. Ao contrário dos scripts que contam o número de atualizações em geral, este código mostra a cada visitante as visitas que apenas ele fez. Se o visitante remover os cookies do computador a contagem recomeçará. Para instalar este script em seu blog, vá para a página LAYOUT das opções de edição de seu blog. Escolha ADICIONAR GADGET e na janela com as opções selecione HTML/JAVASCRIPT. Neste elemento de página cole o código abaixo e salve o elemento de página. Visualize o blog. A contagem já terá começado com VOCÊ!

Este é o código:

domingo, 7 de setembro de 2008

Modelo de links "arco-íris"

Nesta postagem mostrarei como adicionar um efeito interessante aos links de seu blog - o efeito "arco-íris". Para ver do que consiste este efeito clique aqui. Para conseguir o efeito em seu blog, faça o seguinte. 1. Baixe este arquivo para seu computador e a seguir faça up-load dele para a sua conta no Google Pages ou outro programa qualquer. (http://beckerqueiroz.googlepages.com/arco-ris.js). A seguir vá para a página LAYOUT da edição de seu blog-->Clique ADICIONAR GADGET-->Selecione a opção HTML/JAVASCRIPT-->Cole neste elemento de página este código: <script src="http://beckerqueiroz.googlepages.com/arco-ris.js"></script> . Substitua o link http://beckerqueiroz.googlepages.com/arco-ris.js pelo link do seu arquivo e salve o elemento de página. Verifique seu blog. Agora todos os links terão o EFEITO ARCO-ÍRIS!

quarta-feira, 3 de setembro de 2008

Link "Voltar para o topo da página"

Para blogs com muitas postagens na mesma página este pode ser um interessante efeito para colocar. Há duas opções que você pode escolher: a primeira deixa um link ou uma imagem no fundo da página que, ao ser clicada, leva o visitante para o topo da página sem carrega-la novamente. O outro consiste de um link que flutua no canto de baixo a direita da tela, e que desce conforme o visitante vai descendo na página. Seguem as dicas para ambos efeitos.

1. Para conseguir o primeiro efeito (link no fundo da pág.), faça o seguinte. Acesse www.blogger.com e após o login vá para a página LAYOUT. Desça até o fundo e selecione a opção ADICIONAR GADGET do fundo da página; escolha HTML/JAVASCRIPT nas opções que aparecerão e cole aí este código. <a href="http:URLDOBLOG.blogspot.com#topo">Voltar para o topo da página</a>. Modifique o texto VOLTAR PARA O TOPO DA PÁGINA pelo que você quiser que apareça como link. Salve as alterações e vá para a sub-página de LAYOUT EDITAR HTML. Aí, procure pela tag <body> e logo após esta tag cole o código <a name"topo"></a>. Salve as alterações. Está feito!

2. Para conseguir o efeito do link flutuante, faça isto: Vá para a página LAYOUT--Vá para a sub-página EDITAR HTML-->Procure pela tag </body> e APÓS esta tag cole o código <script src="http://beckerqueiroz.googlepages.com/jumptop.js"> </script>. Salve as alterações e visualize o blog. Uma nota importante - O último código dado acima pega o efeito da minha página do google http://beckerqueiroz.googlepages.com/jumptop.js. Caso você prefira baixe aqui este arquivo e faça upload dele em qualquer lugar (por ex., crie uma conta no Google Pages e faça upload aí, uma vez que não é possível fazer no Blogger). A seguir troque o endereço dado no código pelo endereço do seu arquivo.

Teve alguma dificuldade ao seguir a dica acima? Deixe um comentário nesta postagem. Você será respondido o mais breve possível.

Terremoto!

Este código ativa um "screen shaker", um efeito que sacode a janela aberta (no caso, um blog) um número determinado de vezes a cada atualização de página. Veja um exemplo aqui. Para consegui-lo em seu blog, acesse www.blogger.com-->Vá para a página LAYOUT-->Clique ADICONAR GADGET-->Escolha a opção HTML/JAVASCRIPT e cole nela o código dado abaixo. Salve as alterações e visualize o blog.

Nota - Na última linha do código modifique o número 3 de shake="3" pelo número de vezes que você quiser que a tela sacuda. Para parar de sacudir basta clicar em qualquer lugar que o 'terremoto' para.

terça-feira, 2 de setembro de 2008

Script para desabilitar o botão direito do mouse

Esta dica mostra um código simples para evitar que o botão direito do mouse possa ser utilizado em seu blog. Esta função geralmente é utilizada na tentativa vã de impedir visitantes de gravarem as imagens do site. Porém, não se engane: não é nada fácil impedir que gravem as imagens. Aliás, parece não existir uma forma perfeita de faze-lo. Sempre haverá outras possibilidades, como utilizar a tecla Print Screen ou gravar a página.
  1. Acesse www.blogger.com e faça o login (cadastre-se). A seguir, vá para a página LAYOUT das opções de edição de seu blog.
  2. Clique em ADICONAR GADGET. Aparecerá então uma janela pop-up com uma lista de opções. Selecione HTML/JAVASCRIPT (veja fig. abaixo).

  3. Na janela que aparecerá, cole o código abaixo e a seguir clique SALVAR. Visualize o blog e experimente!

Teve alguma dificuldade ao seguir a dica acima? Deixe um comentário nesta postagem. Você será respondido o mais breve possível.