Criar um Blog, Dicas avançadas, scripts, codigo html e imagens de fundo

Quinta-feira

Bloggers - Webbdesign para bloggs - blog gratuito - html email - html script

Para Criar um Blog, blogger, de raiz passo a passo ir a

Depois de vos ter dado dicas passo a passo de raiz para criar um Blog, da blogger, colocar fotos, criar e aplicar um slide em www.criar1blog.blogspot.com, vamos agora explorar novas dicas e mais avançadas para complementar o nosso blog.

Nesta página vamos explorar um pouco os SCRIPTS em HTML para elementos para o blog, para colocar

Imagens de fundo
Texto a correr pela tela
Botões e links personalizados
Abrir hiperligações em nova janela
Aumentar o Ranking de visitas da página
Etc.

Criar um Blog é muito divertido.....

Quarta-feira

Tutorial - photo blog - Script - html - COMO COLOCAR IMAGEM DE FUNDO no Blog

O que é necessário para colocar uma imagem de fundo no BLOG

1. Em primeiro lugar é preciso criar ou encontrar uma imagem que se goste e contenha as dimensões requeridas para aplicação de fundo. Eu escolhi esta imagem a seguir.

Imagem que vamos usar como fundo neste tutorial

2. Este é o LINK da imagem que vamos usar neste Tutorial:
http://i828.photobucket.com/albums/zz210/saberdoser/Blogs/depresso.jpg

3. A seguir está o código de HTML para colocar no Blog. Terá de colocar neste código o LINK da Imagem que quiser colocar como fundo.

Código HTML
<style type="text/css">body {background-image: url( COLOCAR AQUI LINK DA IMAGEM ); background-position: center; background-repeat: no-repeat; background-attachment: fixed;}</style>>

4. Colocar o LINK da imagem que escolher, no código HTML, dentro dos parentesis ( ) onde diz LINK da IMAGEM.

Código HTML já com o LINK da Imagem.
<style type="text/css">body {background-image: url( http://i828.photobucket.com/albums/zz210/saberdoser/Blogs/estetica/fundo-estetica1.jpg); background-position: center; background-repeat: no-repeat; background-attachment: fixed;}</style>

Para ver o resultado final visitem a página

http://www.cureasuadepressao.blogspot.com/

Tutorial PASSO a PASSO para aplicar o código no BLOG

ONDE COLOCAR O CÓDIGO para conseguir inserir a imagem no blog?

Este procedimento pode ter outras formas de realização mas eu normalmente eu coloco este código nos elementos do esquema do blog...mais propriamente no "footer"...crio um elemento de HTML e aplico o código, gravo e pronto. está criado o fundo.

1. Seleccionar o separador "Esquema".
2. No separador "esquema" seleccionar "Elementos de Página"

3. Seleccionar "adicionar miniaplicação".
4. Adicionar um "Elemento de HTML/JavaScript"

5. "Colar" o código HTML e
6. Seleccionar "GUARDAR"

7. Seleccionar "Guardar" de novo mas agora para validar as alterações gerais do Blog.
8. E por último clicar em "VER BLOG" para ver as alterações realizadas no Blog.

PARABÉNS neste momento a tua página já tem um novo Fundo.

Podes agora criar os teus próprios fundos

Foto blog - SE QUISER COLOCAR UMA IMAGEM MINHA, ONDE vou encontrar um LINK para colocar no SCRIPT html?

Photo Sharing and Video Hosting at Photobucket

Para colocar uma imagem no script ela tem de ter um URL/LINK que a represente.

Para adquirir um URL/LINK para a imagem ela tem de estar alojada(hospedada) numa página de alojamento de alojamento de imagens. Depois de alojada, a imagem, o proprio site de alojamento atribui um link correspondênte à imagem.

Vamos usar a página de alojamento PHOTOBUCKET

ADQUIRIR um URL/LINK para uma imagem.

1. Em primeiro lugar temos de ir a http://photobucket.com/

Iniciar por fazer o "cadastro" no site de alojamento/hospedagem.

2. Escolher um nome de Utilizador.
3. Digitar uma palavra-passe.
4. Re-digitar a mesma palavra-passe.
5. Clicar em "NEXT STEP" para continuar.

6. Digitar o nome.
7. Digitar apelido.
8. Digitar email.
9. Optar por gênero feminino ou masculino.
10. Colocar dados de data de nascimento.
11. Digitar código postal.
12. Copiar código de segurança.
13. Validar a inscrição clicando em "I accept Sign me UP"

14. Seleccionar a opção "NO THANKS" para iniciar uma conta gratuita no Photobucket.

ESTÁ AGORA TUDO PRONTO PARA COMEÇAR A CARREGAR/UPLOAD DAS IMAGENS.

PROCEDER AO UPLOAD/CARREGAMENTO DE IMAGENS PARA OBTER URL/LINK PARA COMOCAR NOS SCRIPTS DE CÓDIGO HTML

1. Seleccionar a fonte de origem da imagem...neste caso vamos buscá-la ao nosso computador.
2. Embora este elemento não ter a elipse laranja a envolver é igualmente importante. É onde vamos escolher a opção da dimensão com que a imagem entra no Photobucket (se seleccionarmos um tamanho grande é preciso que a imagem tenha boa qualidade senão vai ficar desfocada).
3. "UPLOAD de IMAGENS", seleccionar este botão para ir buscar as imagens à fonte de origem...neste caso o nosso computador.
4. Depois de clicar em "UPLOAD de IMAGENS" apareçe uma janela onde estão todas as pastas do computador, onde iremos escolher a origem da imagem que queremos fazer o UPLOAD.
5. Depois de escolhida e seleccionada a imagem, clicar em "ABRIR"

6. Depois de feito o UPLOAD da imagem clicar em "SAVE & GET LINKS".

7. Depois de Gravada a Imagem aparece a imagem e os respectivos códigos. O URL/LINK que precisamos para colocar no código de HTML do SCRIPT que vimos no POST de adicionar imagem de fundo no BLOG é o "DIRECT LINK". O qual vamos copiar e colocar no respectivo código de HTML como vamos ver aqui.

Script para colocar imagem de fundo no BLOG com link de imagem.
<style type="text/css">body {background-image: url( http://i828.photobucket.com/albums/zz210/saberdoser/Blogs/estetica/fundo-estetica1.jpg); background-position: center; background-repeat: no-repeat; background-attachment: fixed;}</style>

Para VER como COLOCAR ESTE Script no BLOG ver POST anterior.