Tutorial: Menu no cabeçalho

Ooooi, gente!

O nosso post de número 102 vai ser um tutorial.

Isso mesmo!

E um tutorial bem útil pra quem quer dar um up no visual do blog e baixar a "Taxa de Rejeição" do blog (cujas dicas você confere aqui), já que você colocará as opções de navegação (menus) já no cabeçalho (primeira coisa que o seu leitor vê ao acessar seu blog)!

Pra quem não entendeu como funciona o menu no cabeçalho, basta voltar ao cabeçalho do meu blog! Vou colocar o print mastigadinho pra você não ter nem que subir a barrinha de rolagem!

Note que eu "subi" e incorporei ao cabeçalho as páginas do blog.Você pode incorporar outros links como fiz com a Fan Page do Facebook, Instagram, Flickr e link pro meu outro blog!

Vamos à construção deste cabeçalho?!

Digamos que os passos em si são bem simples. Trabalhoso mesmo é o processo!

Mas vale a pena!

Este será um tutorial beeeeem explicadinho, passo a passo sobre como fazer o cabeçalho com menu!

Se seguir direitinho o que eu vou falar aqui, tem erro não!

Well... Primeiramente, você vai ter que construir seu cabeçalho no Photoshop ou em qualquer outro programa decente de edição de imagem! (Não me vem com Paint, pelo amor de Jesus!)

As dimensões do meu cabeçalho são: 1874 X 913. (Daí você me pergunta: Como ela chegou a este número? Justo este número? E eu respondo: Depois dos testes que eu fiz, ia ser 1800 X 900. Porém, enfiei tanta coisa no cabeçalho que resolvi aumentá-lo. Simples assim!

Não se esqueça: Seu cabeçalho deve conter todos os itens presentes no seu já existente menu! E onde que você olha isto? Lá nas páginas que você criou (e que já estão publicadas no blog).


Na verdade, você vai "deslocar" as páginas, atualmente distribuídas em abas, acima da postagem, lá pra cima, no cabeçalho, sacou?!

Lembre-se: Quando estiver compondo o Menu dentro da imagem no cabeçalho, relacione todas as páginas. Lá na frente, você vai entender como colocar o link pra cada uma delas, ok?!

Uma dica: Crie sua imagem com fundo transparente.

Por quê? Porque aí aparecerá o fundo do blog e não dá aquela aparência "cortada", parecendo que o blog é um grande "puxadinho" que você foi encaixando elementos.

O fundo transparente dá a aprência de sobreposição. De que seu cabeçalho faz parte do blog, mas sem "brigar" com o fundo!

Daí você me pergunta: Por que salvar a imagem do cabeçalho em PNG e não em JPEG?

A grossíssimo modo, te respondo: Porque em PNG há a preservação da transparência (que a gente tanto quer pro cabeçalho), em JPEG não.

Enfim, salva a imagem, vamos à hospedagem dela.

E aí você me pergunta de novo? Pra quê hospedá-la em um site?! E eu te responderei mais adiante.

Por agora: acesse: http://beta.photobucket.com/ (ou qualquer site que hospede imagens), faça seu login (caso não tenha conta lá, crie uma, é rapidinho) e faça o upload do seu cabeçalho!

Guarde por enquanto o link que você obteve no Photobucket, pois você precisará dele agora mesmo!

Agora vamos à "mágica": Como fazer pra colocar link dentro do cabeçalho?! Pode isso, Arnaldo?!

Pode sim e se chama: Mapeamento de Imagem!

Com este recurso, você torna os itens de seu menu "clicáveis" já que ele alia as partes selecionadas da imagem do cabeçalho aos links que você desejar!

Achou "daora"?

Bora fazer então!

Acesse: http://www.image-maps.com/ (O trem é tão bom, que precisa nem criar conta!)

Você vai encontrar esta interface aqui. Siga as minhas instruções!

DICA: O link que você tem que pegar da imagem no photobucket é o "Direct link" (ou seja, o segundo das opções que aparecem à direita da tela). Qualquer dúvida, mande uma mensagem pela aba "contato", que eu esclareço!

Após clicar no botão, indicado, aparecerá esta tela aqui:

Fim de upload, clique onde indica a "setinha" e comecemos de vez o mapeamento!

 

 Bom, vai abrir esta tela aqui: Na maior parte dela, a imagem do seu cabeçalho, no canto direito, as opções do mapeamento.

Vamos a elas!

A primeira coisa a se fazer, quando ver esta tela é desmarcar todas as opções e deixar marcadas apenas as duas a seguir:

E agora começa o mapeamento em si. Basta seguir o que eu disser nas imagens. Para ver em tamanho maior, clique nelas.

Preste bem atenção nestes passos a seguir!

Terminou?

Hora de pegar seu código! Clique no local indicado:

E depois neste campo que indiquei com a seta.

Copie e cole o código em seu bloco de notas e vamos à parte final: A instalação de seu cabeçalho no blog!

Primeiramente, você precisa retirar o cabeçalho do seu blog. Como?

Há duas maneiras!

A primeira:

Pronto, você não tem mais cabeçalho!

Ah, teu cabeçalho não aceitou ser excluído desta forma?!

O que fazer agora?!

Relaxa, venha para esta etapa aqui (segunda maneira):

Repito: NÃO DEIXE DE SALVAR UMA CÓPIA DO CÓDIGO DE SEU LAYOUT, OK?! Fazendo isso, você pode mexer com segurança, sabendo que poderá voltar o blog ao que era antes, caso algo dê errado!

Aberta a edição, faça o que está descrito a seguir:

Pode ser que apareça a mensagem de que não é possível prosseguir a edição sem o cabeçalho. Dá nada não, clique confirmando a alteração que dá certo sim. O cabeçalho é removido!

Sem cabeçalho (por uma das duas maneiras de se retirar) vamos à inserção do novo cabeçalho:

Adicione o gadget "HTML/Java Script" e siga os passos abaixo:

 Prontinho!

Você agora tem um cabeçalho com menu integrado!

Gostaram?!

Espero que sim!

Dúvidas?! Mande um "alô" que eu esclareço!

Com carinho,

Por que a aliança é usada nos dedos anelares?

Olá, pessoal!

Meu post #101 estava sendo feito há exatos 2 dias (juro! Tá dando um senhor trabalho, pois é um tutorial porreta! Aguardem!), quando me deparei com este belíssimo texto que resolvi compartilhar por aqui.

Detesto copiar e colar coisas (e dar a isso o nome de "inspiração", o que pra mim não passa de preguiça ou falta de conteúdo por parte do blogueiro, que não tem nada a somar e mesmo assim quer dizer que tem um blog) acho que blog não serve pra isso, mas este texto, definitivamente eu achei muito lindinho!

Vi no "Feice" e acho que merece ser visto por todos vocês! Não sei se é uma lenda chinesa mesmo (ou se usaram deste recurso pra referendar a ideia do texto), não importa.

O que realmente importa é o quão doce e simples (e ao mesmo tempo grandioso) pode ser o amor e suas explicações...

O quê? Já conhecia o texto?! Nossa! Parabéns!

Da próxima vez coloco aqui algum estudo sobre o "Paradoxo de Frege" pra gente poder analisar e conversar um pouquinho! Isso, claro, se você já não tiver lido tudo sobre!

Bom, mas vamos ao texto:

Você sabe por que a aliança é usada nos anelares?!

"Uma lenda chinesa conseguiu explicar de uma maneira bonita e muito convincente:

Os polegares representam os pais. Os indicadores representam teus irmãos e amigos.O dedo médio representa a você mesmo. O dedo anelar (quarto dedo) representa o seu cônjuge. O dedo mindinho representa seus filhos. Agora junte suas mãos palma com palma, depois, une os dedos médios de forma que fiquem apontando a você mesmo, como na imagem…

Agora tenta separar de forma paralela seus polegares (representam seus pais). Você vai notar que eles se separam, porque seus pais não estão destinados a viver com você até o dia da sua morte, una os dedos novamente.

Agora tenta separar igualmente os dedos indicadores (representam seus irmãos e amigos), você vai notar que também se separam porque eles se vão, e tem destinos diferentes como se casar e ter filhos.

Tente agora separar da mesma forma os dedos mindinhos (representam seus filhos) estes também se abrem porque seus filhos crescem e quando já não precisam mais de nós, se vão, una os dedos novamente.

Finalmente, tente separar seus dedos anelares (o quarto dedo que representa seu cônjuge) e você vai se surpreender ao ver que simplesmente não consegue separá-los. Isto se deve ao fato de que um casal está destinado a estar unido até o último dia da sua vida, e é por isso que o anel se usa neste dedo."
Lindo, não?!

É com esta linda mensagem (créditos à página "jo soares") que inicio a semana, desejando a todos muito amor!

Amor verdadeiro, sincero e indissociável. Amor que dure para sempre e não por agora.

Muito amor para todos nós!

Com carinho,

Salvador em imagens

Oi, gente!

O centésimo post do nosso humilde bloguinho é mais que especial...

É sobre Salvador!

Sim, sim, fui pra lá com o Dudu no dia 15/11 e voltamos dia 20!

Voltamos de alma lavada, com os corações em paz e cheios de histórias pra contar...

Não tirei foto com a Ivete, só com o banner dela na loja "Insinuante", serve?! kkkk

rs!

Bom, como boa nerd que sou, já planejei essa viagem pensando em vários focos. Um deles seria as fotos. Saí de casa pensando neste humilde blog e no meu Flickr (sim, eu saio de viagem pensando em coisas do gênero e sim, eu me divirto muito fotografando lugares).

A coisa foi tão planejada pras fotos que até câmera nova ganhamos do meu irmão e, em breve colocarei o review sobre ela aqui!

Bom, mas vamos às imagens tiradas para o blog.

Apesar de não serem fotos pessoais, de certa forma são, afinal, todas têm o meu sentimento e do Dudu impressos, têm nosso olhar sobre as cores desta linda cidade!

Coloquei a tag e vou insistir em meu pedido de desculpas por isso e em minha justificativa: Acho muito chato ver fotos minhas por aí, sem os devidos créditos.

E quem quiser ver as "pessoais", passa lá no meu "Feice" (/nanadorough) que vai estar tudinho lá pra quem for contato! Heheheheh

Vamos às imagens?! Não houve nenhuma manipulação ou retoque da minha parte. Apenas a colocação da marca d'água. Os efeitos de saturação de cor e lomografia são recursos ajustáveis da câmera utilizada.

Pra ver as fotos em tamanho maior, basta clicar na primeira e ir passando...

E a última: Eu!

Bom, espero que tenham gostado do nosso centésimo post e que tenham podido conhecer um pouquinho das luzes, tons e cores desta bela cidade!

Com carinho,