Como fazer popup

sábado, 7 de dezembro de 2013

Colocar uma janela popup no blog pode ser o céu ou o inferno. Tenha muito cuidado em usar pois se você exagerar na quantidade ficará chato e seus visitantes não voltarão ao blog.
Mas se usado de forma inteligente, como por exemplo, formulário de contato, assinar seus feeds, ou alguma outra tarefa que seja atrativa, você poderá prender a atenção desses visitantes por mais tempo no blog.

Então vamos ver como isso funciona:
Primeiro você precisa estipular onde colocar esse código (gadget, postagem);
Depois basta copiar o código abaixo e colar no local, alterando as partes marcadas.

<a href="URL_PAGINA_DA_POPUP" target="popupwindow" onclick='window.open ("URL_DA_PAGINA_POPUP", "popupwindow", "scrollbars=yes, width=550, height=520"); return true'>
Texto
</a>

Url_pagina_da_popup = Link que vai ser mostrado na janela;
Width = Altura da janela;
Height = Largura da janela;
Texto = O que vai ser mostrado para clicar ( uma palavra ou imagem );

Espero ter ajudado.
Sucesso à todos!

Abrir 2 links com 1 click

Para que isso aconteça, você terá que entrar no código html do blog e procurar por
</head>

Logo acima coloque este código:
--------------------------------------------

<script language="JavaScript">
function linksduplosh(linkduplo1,linkduplo2) {
window.open(linkduplo1);
window.open(linkduplo2);
}
</script>


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

Clique em "Salvar modelo".
Pronto. Seu blog já está configurado para receber links com duplo redirecionamento.
Agora você poderá, sempre que desejar colocar o link para abrir duas páginas utilizando o comando a seguir:

<a href="javascript:void(0)" onclick="linksduplosh('LINK DA ABA 1','LINK DA ABA 2')">
Clique aqui para abrir as abas</a>

Nas áreas em vermelho e azul, você coloca os endereços das páginas que deseja que sejam abertas. Onde está - Clique aqui para abrir as abas - você pode substituir por qualquer palavra.
Caso queira, você poderá colocar uma imagem como link. Neste caso o código ficaria assim:

<a href="javascript:void(0)" onclick="linksduplosh('LINK DA ABA 1','LINK DA ABA 2')">
<img src="ENDEREÇO DA IMAGEM"></a>

Sempre lembrando que este código deve ser colocado na área da postagem, no modo "HTML".

Sucesso a todos!

Colocar álbum de fotos no blog

Tráta-se de um código HTML muito simples que você poderá configurar com muita facilidade dentro de seus artigos. Para iniciar este album, você deve separar as fotos que iram compor o album.
Em seguida você deverá copiar o código abaixo e colar diretamente em seu editor HTML de postagem.


<iframe frameborder="0" marginheight="0" marginwidth="0" height="300" src="IMAGEM DA CAPA" id="galeria" scrolling="no" width="400" name="galeria"></iframe><br/>
<a href="IMAGEM 1" target="galeria">Lago</a>
<a href="IMAGEM 2" target="galeria">Praia</a>

 
Veja que o tamanho das imagens deve ser de 400 x 300. 

Veja também que existe uma imagem que será a imagem da capa, isto é, a imagem que aparecerá logo no início do album. 
Logo em seguida você irá colocar os endereços das outras imagens e seus nomes correspondentes como indicado nas áreas em vermelho.
Para colocar outras imagens, basta repetir a parte final do código com outras imagens e seus respectivos nomes.

Agora é só publicar e curtir!

Colocar um Sitemap para blog

O que é e para que serve um Sitemap?
Sitemap é um arquivo XML com as últimas atualizações do site, freqüência da alterações, relevância e etc. Este arquivo serve basicamente para otimização do site nos motores de busca.
Agora que você sabe a importância deste arquivo, envie o seu para o google acessando a Central Webmaster Google, cadastre seu blog e logo depois faça uma verificação inserindo uma meta tag oferecida pelo serviço.
Depois de confirmar sua propriedade basta ir até o guia “sitemap” no menu lateral e logo depois em “adicionar um sitemap”. Na próxima página escolha a opção “Adicionar Sitemap geral da web”.
No campo onde pede a URL coloque “atom.xml?redirect=false&start-index=1&max-results=200? e clique em “Enviar”.
Pronto!, após algum tempo você já poderá ver as estatísticas e caso ocorra algum erro tente inserir no campo da URL simplesmente “atom.xml”.

Colocar banner entre as postagens do blog

Para colocá-los basta irmos em Design> Editar HTML, marcar a caixinha expandir modelos de widget e procurar pela linha:

<b:include data='post' name='post'/>

E logo abaixo cole o seguinte:

<center>
<div style='margin-top: 20px; margin-left: 40px;'>
--- SEU TEXTO AQUI ---
<a href="URL de destino" target="_blank">
<img src='URL da imagem'/>
</a>
</div>

</center>


Basta colocar a URL do link e da imagem nos lugares indicados;
Eu adicionei uma "div" para centralizar a imagem mas isso depende do tamanho da sua imagem. Ajuste como necessário
Você pode  adicionar um texto simples acima da imagem. Para dar estilo ao texto:
<b>TEXTO</b> --- negrito
<i>TEXTO</i> --- itálico

Se preferir apenas uma linha, o código será esse:

<hr style="align:center; background:#FFFF00;  border:0px; height:5px; width:60%;" />

Em background, coloque a cor de sua preferência, em height, a altura da linha e em width a largura em porcentagem.


Veja um exemplo entre as postagens aqui no blog.

Sucesso!