Mostrando postagens com marcador Blogger. Mostrar todas as postagens
Mostrando postagens com marcador Blogger. Mostrar todas as postagens

11 de abr. de 2014

Criando Páginas no blogger

As páginas tem a função de deixar o blog mais organizado;são as opções que aparecem no menu do blog como por exemplo: Contato,Tutoriais, Sobre o blog.. e etc. Esse tutorial é essencial para quem está começando a criar um blog por agora ou para quem quer criar layouts personalizados. Vamos lá?

01. Acesse blogger.com/
02. Se você não estiver logado em sua conta, entre nela. Em seguida abrirá o painel inicial com o nome do seu blog e ao lado o botão de Acessar lista de postagens, e ao lado de acessar lista de postagens tem uma setinha para baixo,clique nela e vai abrir uma lista de opções, clique em Páginas:
Em seguida abrirá uma página com algumas opções, clique em Nova Página e siga:
Depois clique em salvar e pronto!
Você pode adicionar mais páginas se quiser, espero ter ajudado vocês. 
Beijos da Gaby ♥

• Todos créditos a Cantinho do PhotoScape.
não retire sem a ADM. deste blog.

10 de mar. de 2014

Layout Personalizado Masculino no PhotoScape


Materiais Necessários:
Fotos: 01 × 02 × 03 × 04 × 05 × 06
Fundo Transparente Para Header Créditos: Cantinho do PhotoScape
Fundo -  Créditos: Cantinho do PhotoScape
Ponto de Luz verde - Créditos: Cantinho do PhotoScape


Editando as fotos

01. Abra seu PhotoScape,vá em menu e clique em Nova Foto e siga:
Largura: 362
Altura: 140
Cor: preta
02. Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra a Foto 01 e ajuste no fundo, feito isso clique no botão Foto+Objeto e marque a opção Combine sua Foto com Objeto.

Clique em Salvar → Salvar Como e salve-o com o nome de Icon 01 e salve em formato PNG.
*Repita o processo com a foto 02 e 03.

01. Abra o fundo transparente e clique em Símbolos e selecione este simbolo:
• Fotografia → Foto.. e abra a Foto 01 e coloque do lado do simbolo,assim:
Clique no botão Foto+Objeto e marque a segunda Opção.
02. Mude para a aba Tools e clique em Clone Stamp, dê um clique na foto do Billie e arraste o mouse para o meio do simbolo e dê um clique,assim:
clique na imagem para ampliar.
e agora vá pintando o simbolo até a foto do Billie ficar completa no simbolo, ficará assim:
clique na imagem para ampliar.
Em seguida mude para a aba Cortar e corte apenas o simbolo e salve-a com o nome Icon.

Abra o fundo Fundo Transparente Para Header  e vá em:
• Fotografia → Foto.. e abra o Icon que acabamos de salvar,clique no botão duplicar e vá abrindo e formando um simbolo grande,assim:

Clique no botão Foto+Objeto.
• Fotografia → Foto.. e abra o ponto de luz verde,automaticamente abrirá uma janela chamada Foto, mude a opacidade para 179 e coloque-o no meio do simbolo.
Clique no botão Foto+Objeto e salve-a.

03. Abra o Icon e mude para a aba Inicio e vá em:
• Brilho,Cor → Colorir e siga:
Salve-a e abra novamente a Fundo Transparente Para Header que nós acabamos de editar.
Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra o Icon e coloque em cima do ponto de luz verde,assim:

Feito isso clique no botão Foto+Objeto. Em seguida salve-a.

 Montando a Header
01. Abra o Fundo e vá em:
• Fotografia → Foto.. e abra a os Icons e coloque um de baixo do outro na lateral esquerda,assim:
 
• Fotografia → Foto.. e abra o Simbolo que nós acabamos de criar, aumente o tamanho e coloque-o ao lado dos icons,assim:
• Fotografia → Foto.. e abra foto 01,automaticamente abrirá uma janela chamada Foto, mude a opacidade para 97 e coloque-o no meio do simbolo.
Em seguida clique no botão Foto+Objeto.

Clique na Ferramenta de Texto ou "T" e escreva o nome do seu blog com a fonte Champagne & Limousines no lado direito da Header
Clique novamente na Ferramenta de Texto e agora coloque as redes sociais com a fonte Social Icon.
Em seguida clique no botão Foto+Objeto e mude para a aba Cortar e corte a Header assim:

Salve-a.

01. Abra seu PhotoScape,vá em menu e clique em Nova Foto e siga:
Largura: 304
Altura: 150
Cor: preta
02. Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra a Foto 04 e ajuste no fundo, feito isso clique no botão Foto+Objeto e marque a opção Combine sua Foto com Objeto.
Agora aplique o efeito Preto & Branco estilo Photoshop, clique aqui para ver o tutorial.
Depois de aplicar o efeito, e.

Vá novamente em menu e clique em Nova Foto e siga:
Largura: 304
Altura: 150
Cor: preta
02. Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra a Foto 06 e ajuste no fundo, feito isso clique no botão Foto+Objeto e marque a opção Combine sua Foto com Objeto.
Em seguida salve no formato PNG com o nome Goodbye

Criando a Lateral do Layout
01. Abra seu PhotoScape,vá em menu e clique em Nova Foto e siga:
Largura: 323
Altura: 630
Cor: Cinza Escuro
02. Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra o Welcome e coloque no começo da lateral.
Clique na Ferramenta de Texto ou "T" e escreva "Welcome" com a fonte Kravitz,e  coloque acima da Foto.
Em seguida clique no botão Foto+Objeto.
Clique na Ferramenta de Texto ou "T" e escreva as boas vindas e coloque de baixo da foto.
Em seguida clique no botão Foto+Objeto.

Clique no modo caixa, clique na caixa de cor →  More Colors.. e ajuste assim:
Agora faça uma caixa retangular em baixo da foto, assim:
Essa caixa vai ser o menu do seu blog,clique no botão duplicar e coloque quantas caixas for necessárias
*recomendo colocar 4 ou 6 no máximo.

• Fotografia → Foto.. e abra o Goodbye e coloque em baixo.
Clique na Ferramenta de Texto ou "T" e escreva "Goodbye" com a fonte Kravitz,e coloque acima da Foto.
Em seguida clique no botão Foto+Objeto.
Clique na Ferramenta de Texto ou "T" e escreva em cada caixa um botão, assim:
Clique na Ferramenta de Texto ou "T" e escreva seu texto despedindo e colocando os créditos do Layout com a fonte Champagne  Limousines em baixo da foto.
Em seguida clique no botão Foto+Objeto.

FONTES USADAS:
Kravitz
Champagne & Limousines

Mapeando a Imagem
Antes de colocar a imagem no blog nós precisamos mapear a imagem,isto é,colocar os links para as pessoas clicarem nos botões da barra.

01. Acesse o site http://www.image-maps.com/
02. Assim que abrir,clique em Browse For File:
Procure e abra a Parte 01 e clique em Start Maping. Em seguida depois de carregar,vai aparecer a Parte 01,clique em click to continue (está acima da imagem)
03. Vai aparecer a Parte 01,clique com o botão direito sobre a imagem e clique em Create Rect:
E agora arraste o quadrado e ajuste ele no primeiro botão, o Inicio e ajuste assim:
Faça o mesmo com os outros botões "Menu,F.A.Q,.. e os botões das redes sociais".
Quando terminar de mapear,clique com o botão direito do seu mouse em cima da imagem e clique em Get Code. Vai abrir uma janela,clique em HTML Code:
Lá em baixo vai ter uma caixa escrito HTML Image Map Code,dê um clique na caixa e pressione Ctr+A para selecionar o código todo,pressione Ctrl+C para copiar o Código.

* Um obrigado especial para o blog Menina Nerd,foi lá que aprendi a mapear imagens :)

Colocando a barra lateral no blog

Acesse seu painel (blogger.com) e vá em Layout. Em seguida vai aparecer o Layout do seu blog, eu não sei como está o Layout de vocês, mas no lado esquerdo ou direito vai um quadrado escrito "Adicionar Gadget"
no meu caso está no lado esquerdo:


Depois de ter clicado em Adicionar Gadget  vai aparecer uma lista,desça e procure por "HTML/Javascript e clique nele. Após ter clicado, vai abrir uma pequena janela,deixe o titulo em branco e clique na caixa de Conteúdo e pressione Ctrl+V e clique em  Salvar.

O fundo do blogger e o modelo você pode mudar clicando em Modelo,está abaixo de Layout na lateral esquerda, clique em Personalizar e ajuste como quiser.
Pronto!

• Todos os créditos a Cantinho do PhotoScape.
Não retire sem a permissão da ADM deste blog.

23 de fev. de 2014

Criando Layout Personalizado para Blogger no PhotoScape

clique aqui para visualizar o Layout.
Depois de muitos visitantes me pedindo "Gaby,faz um tutorial explicando como você criou esse Layout da Avril Lavigne" "Gaby como você a lateral?" "Gaby que efeito é esse que você aplicou nas fotos do Layout?" entre outras perguntas decidi criar esse tutorial ensinando como criar seu Layout personalizado e como instalar no blogger.
  • Dicas necessárias para criar um Layout:

1° dica: Decidir se o seu Layout vai ser com algum artista ou não. Se você escolher um artista (eu escolhi a Avril Lavigne),salve pelo o menos 8 fotos em HQ ou seja, foto de resolução alta.
dica: Conseguir PNG's do artista (se você for fazer de um artista é claro) parar criar o cabeçario.
3° dica: Escolha duas cores para o Layout, eu escolhi preto com roxo.

Cabeçalho do blog
Criando o Cabeçalho

Materiais Necessários:
Fundo Transparente para Cabeçalho - Créditos: Cantinho do PhotoScape
PNG's da Avril: 01 × 02 × 03 × 04 × 05
* Eu escolhi a da Avril porque o Layout que criei é dela, mas você pode escolher outro artista.
Fonte Jellyka Western Princess para o titulo do blog
*Instale as fontes antes,caso não saiba clique aqui.


01. Abra seu PhotoScape,vá em editor e clique no botão menu → Nova Foto e siga:
Largura: 1264
Altura: 400
Cor: Preta

02. Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra um PNG de cada vez e vá formando o cabeçario assim:
Em seguida clique no botão Foto+Objeto e maque a opção Combine sua Foto com Objeto.
03. Volte para aba Inicio e vá em:
• Filtro → Linear Gradiente e siga:
Volte para a aba Objeto e clique em "T" ou Ferramenta de Texto e escreva o nome do blogger com a fonte Jellyka Western Princess e clique no botão Foto+Objeto.

Salve o cabeçario.


  • Colocando o Cabeçalho no blog
Acesse seu painel (blogger.com) e vá em Layout. Em seguida vai aparecer o Layout do seu blog,no topo você vai encontrar uma tira assim: "nome do seu blog (Ca.." ou seja,assim:

Clique em Editar na lateral direita e vai abrir uma pequena janela escrito Configurar Cabeçalho,de baixo da descrição do seu blog vai ter Imagem, clique em "De seu computador:" e abra seu Cabeçalho e em seguida marque essa opção:
Clique em salvar e pronto,seu cabeçalho está no blog!

Criando a lateral do blog
Materiais Necessários:
Fundo Transparentes para a lateral do blogger: Parte 01 × Parte 02 - Créditos: Cantinho do PhotoScape
3 Fotos da Avril (ou do artista que quiser). Não posso disponibilizar as fotos porque eu perdi :/
* Eu escolhi a da Avril porque o Layout que criei é dela, mas você pode escolher outro artista.
Ribbon Roxo - Créditos: Cantinho do PhotoScape
Ponto de Luz roxo - Créditos: Cantinho do PhotoScape
Fonte Jellyka Western Princess para o titulo do blog
Fonte Social Icons para as redes sociais
*Instale as fontes antes,caso não saiba clique aqui.

Editando as Fotos para a Lateral
01. Abra seu PhotoScape,vá em editor e clique no botão menu → Nova Foto e siga:
Largura: 104
Altura: 96
Cor: Preta

02. Mude para a aba Objeto e vá em:
• Fotografia → Foto.. e abra a Foto 01 e ajuste-a no fundo em seguida clique no botão Foto+Objeto e maque a opção Combine sua Foto com Objeto.
 Volte para a aba Inicio e vá em:
• Brilho,Cor → Escala Cinza
Volte novamente para a aba Objeto e vá em:
• Fotografia → Foto.. e abra a o ponto de luz roxo,automaticamente abrirá uma janela chamada Foto,mude a opacidade para 150 e coloque na parte de baixo da foto. Em seguida clique no botão Foto+Objeto e maque a opção Combine sua Foto com Objeto.
Faça o mesmo com a foto 03.

Editando as fotos para o "Quem escreve"
01. Abra seu PhotoScape,vá em editor e clique no botão menu → Nova Foto e siga:
Largura: 278
Altura: 144
Cor: Preta
• Fotografia → Foto.. e abra a Foto 02, e ajuste-a no fundo em seguida clique no botão Foto+Objeto e maque a opção Combine sua Foto com Objeto.
 Volte para a aba Inicio e vá em:
• Brilho,Cor → Escala Cinza
Clique no botão Salvar → Salvar como.. e salve-o com o nome Icon 01

02.Clique no botão Menu → Nova foto e dê Ok.
• Fotografia → Foto.. e abra a Foto 02, e ajuste-a no fundo em seguida clique no botão Foto+Objeto e maque a opção Combine sua Foto com Objeto.
 Volte para a aba Inicio e vá em:
• Brilho,Cor → Escala Cinza
Clique no botão Salvar → Salvar como.. e salve-o com o nome Icon 02.

03.Clique no botão Menu → Nova foto e dê Ok.
• Fotografia → Foto.. e abra a Foto 02, e ajuste-a no fundo em seguida clique no botão Foto+Objeto e maque a opção Combine sua Foto com Objeto.
 Volte para a aba Inicio e vá em:
• Brilho,Cor → Escala Cinza
• Brilho,Cor → Colorir e siga:

Clique no botão Salvar → Salvar como.. e salve-o com o nome Icon 03.
* Repita o passo 03,apenas mude na hora de salvar,salve com o nome Icon 04.

Criando a lateral do blog: Parte 01

01. Abra seu PhotoScape,vá em editor e abra a parte 01.
02. Mude para a aba Objeto e clique em Modo caixa arredondada, ao lado clique na caixa de cor e
Com tudo ajustado, faça o corpo da lateral,assim:

Clique no botão Foto+Objeto.
Clique no modo caixa (está ao lado do modo caixa redonda) e faça um quadrado na parte de cima,assim:

Clique no botão Foto+Objeto.
• Fotografia → Foto.. e abra o Ribbon e coloque na parte de cima.
clique em "T" ou Ferramenta de Texto e escreva "Welcome" com a fonte Champagne & Limousines, e coloque-o em cima do Ribbon,assim:
Em seguida clique no botão Foto+Objeto.
• Fotografia → Foto.. e abra a Foto 01 e coloque de baixo do Welcome,assim:

Em seguida clique no botão Foto+Objeto.
Clique em "T" ou Ferramenta de Texto e escreva a descrição do seu blog com a fonte Champagne,coloque a descrição de baixo da foto.Em seguida clique no botão Foto+Objeto.
Clique no modo caixa, clique na caixa de cor → More Colors.. e siga:

Em seguida faça uma pequena caixa em baixo da descrição,assim:
Essa caixa vai ser o menu do seu blog,clique no botão duplicar e coloque ao lado dessa.
Clique em "T" ou Ferramenta de Texto e escreva em cada caixinha um botão,a primeira escreva "INICIO" a segunda "MENU" e "F.A.Q" com a fonte Champagne na cor branca,vai ficar assim:
Feito isso clique no botão Foto+Objeto.
lique em "T" ou Ferramenta de Texto e escreva os icons das redes sociais do seu blog em baixo.
Em seguida clique no botão Foto+Objeto.
Pronto!

      Parte 02
01. Abra seu PhotoScape,vá em editor e abra a parte 01.
02. Mude para a aba Objeto e clique em Modo caixa arredondada, ao lado clique na caixa de cor e
Com tudo ajustado, faça o corpo da lateral,assim:

Clique no botão Foto+Objeto.
Clique no modo caixa (está ao lado do modo caixa redonda) e faça um quadrado na parte de cima,assim:

Clique no botão Foto+Objeto.
• Fotografia → Foto.. e abra o Ribbon e coloque na parte de cima.
clique em "T" ou Ferramenta de Texto e escreva "Quem Escreve" com a fonte Champagne & Limousines, e coloque-o em cima do Ribbon. Em seguida clique no botão Foto+Objeto.

• Fotografia → Foto.. e abra os Icons, e coloque dois em cima, e dois embaixo.
Clique em Ferramenta de Texto e escreva o nome do administrador e colaboradores em cada icon,assim:

 Em seguida clique no botão Foto+Objeto.
• Fotografia → Foto.. e abra o Ribbon e coloque abaixo dos Icons, e clique no botão Foto+Objeto.
Clique em Ferramenta de Texto e escreva "Goodbye!" no Ribbon.
• Fotografia → Foto.. e abra a Foto 03 e coloque de baixo do Ribbon.
Clique em Ferramenta de Texto e escreva seu texto despedindo e em seguida clique no botão Foto+Objeto.
Pronto.

Mapeando a Imagem
Antes de colocar a imagem no blog nós precisamos mapear a imagem,isto é,colocar os links para as pessoas clicarem nos botões da barra.

01. Acesse o site http://www.image-maps.com/
02. Assim que abrir,clique em Browse For File:
Procure e abra a Parte 01 e clique em Start Maping. Em seguida depois de carregar,vai aparecer a Parte 01,clique em click to continue (está acima da imagem)
03. Vai aparecer a Parte 01,clique com o botão direito sobre a imagem e clique em Create Rect:
E agora arraste o quadrado e ajuste ele no primeiro botão, o Inicio e ajuste assim:
Faça o mesmo com os outros botões "Menu,F.A.Q,.. e os botões das redes sociais".
Quando terminar de mapear,clique com o botão direito do seu mouse em cima da imagem e clique em Get Code. Vai abrir uma janela,clique em HTML Code:
Lá em baixo vai ter uma caixa escrito HTML Image Map Code,dê um clique na caixa e pressione Ctr+A para selecionar o código todo,pressione Ctrl+C para copiar o Código.

*Faça o mesmo com a Parte 02.
A diferença é que você só vai mapear as imagens do Quem escreve,ou seja,colocar o link para cada colaborador e para o administrador (a).

* Um obrigado especial para o blog Menina Nerd,foi lá que aprendi a mapear imagens :)

Colocando a barra lateral no blog

Acesse seu painel (blogger.com) e vá em Layout. Em seguida vai aparecer o Layout do seu blog, eu não sei como está o Layout de vocês, mas no lado esquerdo ou direito vai um quadrado escrito "Adicionar Gadget"
no meu caso está no lado esquerdo:


Depois de ter clicado em Adicionar Gadget  vai aparecer uma lista,desça e procure por "HTML/Javascript e clique nele. Após ter clicado, vai abrir uma pequena janela,deixe o titulo em branco e clique na caixa de Conteúdo e pressione Ctrl+V e clique em  Salvar.

*Faça o mesmo com a outra parte da lateral.
O fundo do blogger e o modelo você pode mudar clicando em Modelo,está abaixo de Layout na lateral esquerda, clique em Personalizar e ajuste como quiser.
Pronto!
Qualquer duvida ou se precisar de ajuda é só deixar comentário que eu ajudo vocês ok?
• Todos os créditos a Cantinho do PhotoScape.
Não retire sem a permissão da ADM deste blog.