Bem, anteriormente já havíamos postado algumas dicas sobre as janelas pop-ups em blogs, mas agora tudo vai junto com algumas dicas novas e está mais fácil de acompanhar.
Os pop-ups são estas janelinhas que aparecem automaticamente quando você entra em algum site (se você estiver com o bloqueador de pop-ups desativado) e também ao ser clicados alguns tipos de link. Aqui vamos mostrar os três tipos de pop-up principais.
n° 1 - Modo automático simples
Descrição: Este é o modo simples de pop-up que aparece tão logo carrega o blog em que ele está instalado (automaticamente). Se você tiver o bloqueador de pop-ups ativado eles não funcionarão em seu computador.
Código:
<script language="javascript">window.open('http://url_da_página_pop-up','Info','width=200,height=250,scrollbars=no,resizable=no,status=no,left=100,top=47');
</script>
Modificações no código:
Todos os trechos mostrados em verde no código podem ser modificados de acordo com a sua vontade. Modifique
http://url_da_página_pop-up pelo endereço completo da página que deverá abrir como pop-up. Modifique
200 de
width=200 pelo tamanho da largura da página e
250 de
height=250 pela altura.
resizable=no define se a janela será redimensionável. Caso deseje permitir isto, modifique
no por
yes. Modifique o
no de
scrollbars=no para
yes caso você queira que a janela tenha barras de navegação.
Como adicionar:
Após acessar o painel de sua conta no blogger, vá para a página
Layout --
Elementos de página. Selecione
Adicionar um gadget e na janela com as opções de gadgets que aparecerá escolha
HTML/Javascript. A seguir, cole o código do pop-up no gadget e, após modificar os campos desejados, salve o gadget e visualize o blog. Este código também pode ser adicionado em uma postagem qualquer.
n° 2 - Modo automático avançado
Descrição: Praticamente o mesmo pop-up anterior, porém desta vez o código contém um sistema de cookies que impede que o pop-up abra mais de uma vez na mesma janela. Após ter aparecido uma vez você poderá atualizar a página quantas vezes quiser que o pop-up não será ativado novamente.
Código:
<script>
function openpopup(){
var popurl="http://url_da_página_pop-up"
winpops=window.open(popurl,"","width=200,height=250,")
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
onset = document.cookie.indexOf(search)
if (onset != -1) {
onset += search.length
end = document.cookie.indexOn(";", onset);
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(onset, end))
}
}
return returnvalue;
}
function loadornot(){
if (get_cookie('poppedup')==''){
openpopup()
document.cookie="poppedup=yes"
}
}
loadornot()
</script>
Modificações no código:
Modifique
http://url_da_página_pop-up pelo endereço da página que abrirá em pop-up. Modifique o
200 de
width=200 para o tamanho da largura da janela e
250 de
height=250 para a altura.
Como adicionar: Siga os mesmos passos do modo anterior.
n° 3 - Modo OnClick
Descrição: A janela a ser aberta é exatamente como a do n° 1, porém ativa-se ao ser clicado um link. Alguns bloqueadores de pop-ups não funcionam com janelas clicadas.
Código:
<a onclick="window.open('http://url_da_página_pop-up','Info','status=yes,scrollbars=yes,resizable=yes,width=200,height=250,left=100,top=47');" href="javascript:void(0)">Texto do link</a>
Modificações no código: As modificações no código também são como as do exemplo n° 1, exceto pelo trecho
Texto do link, que você modificará para o texto do link que abrirá a janela.
javascript:void(0) é o que aparecerá na barra de status. Não haverá diferença prática modificando-se este último trecho.
Como adicionar: Esta forma de pop-up pode ser adicionada na barra lateral (seguindo-se os passos do exemplo n° 1) ou numa postagem qualquer.
n° 4 Modo OnMouseOver
Descrição: Este modo é quase exatamente igual ao n° 3, sendo que a única diferença é que ele é ativado ao passar-se o mouse sobre o link (onMouseOver), e não ao ser clicado, como no exemplo anterior.
Código:
<a onmouseover="window.open('http://url_da_página_pop-up','Info','status=yes,scrollbars=yes,resizable=yes,width=200,height=250,left=100,top=47');" href="javascript:void(0)">Texto do link</a>
Modificações no código: Modifique tudo como no exemplo n° 3.
Como adicionar: Também este código pode ser adicionado como no n° 3
E aí você tem os principais modos de pop-up. No entanto, quanto ao pop-up automático, lembre-se de não exagerar com isso porque se usado demasiadamente pode incomodar seus visitantes e fazê-los fechar o blog o quanto antes. Também o modo onMouseOver pode ser muito irritante, por isso tome cuidado na sua utilização.
