Colocar música no blog
Colocar música no blog é mais fácil do que parece. Isso é verdade pois nunca tinha me interessado por isso, mas revolvi pesquisar para escrever essa dica e para minha surpresa em menos de 10 minutos eu estava ouvindo música no meu blog.
Usei uma música do site http://www.mp3tube.net/, você só precisa pesquisar pela música que deseja, quando você clica no nome da música aparece uma tela que você ouve a música e fornece o código para colocar no seu site, mas não é a url, é o código que está na frente do embed.
Esse site ainda fornece a opção de você fazer um cadastro e colocar a música que quiser, caso você não encontre a música desejada. Caso não gostem do MP3tube, aqui tem outros sites de hospedagem:
http://www.myfabrik.com/
http://boomp3.com/
Enfim o modo de colocar música é simples e basicamente o mesmo de colocar qualquer outra coisa, procure um site que tenha o que deseja e procure pelo código para colocar no seu blog.
Esses códigos devem ser colocados pela pagina editar layout >>> adicionar elemento de pagina >>> html/javascript, então é só colar o código (isto no Blogspot), para outros blogs procure onde você edita o html ou modelo, enfim onde você pode colocar o código da música.
domingo, 21 de setembro de 2008
Perfil não disponível
Perfil não disponível
Algumas pessoas bloqueiam o acesso dos outros ao seu perfil do blogger, mas elas esquecem que quando comentam outro blog usando sua conta google, o que aparece no blog que ela comentou é um link para o seu perfil (que está com acesso restrito) ou seja fica impossível saber quem comentou o blog porque aparece somente o nome mas o link leva para lugar nenhum, uma vez que o perfil não está disponível. Assim não adianta comentar outro blog usando a conta google pois não será possível o dono do blog nem qualquer outra pessoa retribuir a visita ou comentário no seu blog.
Para deixar o seu perfil com livre acesso vá até o painel do blogger e clique em editar perfil, na primeira linha tem a opção Compartilhar meu perfil, você deve marcar essa opção e clicar no botão gravar perfil (no final da página). Esse é um detalhe que pode passar desapercebido e certamente atrapalha a divulgação de seu blog e certamente diminui a quantidade de comentários que você tem pois impede que as pessoas visitem seu blog usando o link do perfil.
Algumas pessoas bloqueiam o acesso dos outros ao seu perfil do blogger, mas elas esquecem que quando comentam outro blog usando sua conta google, o que aparece no blog que ela comentou é um link para o seu perfil (que está com acesso restrito) ou seja fica impossível saber quem comentou o blog porque aparece somente o nome mas o link leva para lugar nenhum, uma vez que o perfil não está disponível. Assim não adianta comentar outro blog usando a conta google pois não será possível o dono do blog nem qualquer outra pessoa retribuir a visita ou comentário no seu blog.
Para deixar o seu perfil com livre acesso vá até o painel do blogger e clique em editar perfil, na primeira linha tem a opção Compartilhar meu perfil, você deve marcar essa opção e clicar no botão gravar perfil (no final da página). Esse é um detalhe que pode passar desapercebido e certamente atrapalha a divulgação de seu blog e certamente diminui a quantidade de comentários que você tem pois impede que as pessoas visitem seu blog usando o link do perfil.
Como hospedar imagens
Como hospedar imagens
Como e onde hospedar imagens para colocar no blog? Essa não é uma pergunta difícil mas é sempre bom ter alguma ajuda para tirar possíveis duvidas e principalmente evitar colocar endereços de imagens erradas no site.
Sugiro que use um desses sites para hospedar suas imagens:
http://www.imageshack.us
http://photobucket.com
Você precisa fazer um cadastro no site embora o primeiro(http://www.imageshack.us) permita hospedar a imagem sem cadastrar, acho que é recomendável fazer o cadastro pois assim você poderá apagar suas imagens caso mude de idéia sobre alguma delas.
Depois de feito o cadastro e você entrar no site que escolheu usando sua senha, procure por upload image ou botões escrito arquivo isso serve para você localizar a imagem no seu computador então clique em OK ou Upload, cada site usa de um modo mas fazem a mesma coisa.
Agora vamos pegar a url da sua imagem mas tenha cuidado pois o site fornece vários códigos além da url. Procure por direct link ou algo parecido. Mas vamos testar para saber se pegamos o código correto, abra o seu navegador(Internet Explorer, Firefox, Opera...), coloque o código que pegou na barra de endereço e clique enter, deve aparecer sua imagem, somente a imagem, sem borda, sem link. Se aparecer algo além da sua imagem você pegou o código errado.
Aqui parece um pouco complicado, mas você verá que na hora de fazer é bem mais simples do que parece.
Como e onde hospedar imagens para colocar no blog? Essa não é uma pergunta difícil mas é sempre bom ter alguma ajuda para tirar possíveis duvidas e principalmente evitar colocar endereços de imagens erradas no site.
Sugiro que use um desses sites para hospedar suas imagens:
http://www.imageshack.us
http://photobucket.com
Você precisa fazer um cadastro no site embora o primeiro(http://www.imageshack.us) permita hospedar a imagem sem cadastrar, acho que é recomendável fazer o cadastro pois assim você poderá apagar suas imagens caso mude de idéia sobre alguma delas.
Depois de feito o cadastro e você entrar no site que escolheu usando sua senha, procure por upload image ou botões escrito arquivo isso serve para você localizar a imagem no seu computador então clique em OK ou Upload, cada site usa de um modo mas fazem a mesma coisa.
Agora vamos pegar a url da sua imagem mas tenha cuidado pois o site fornece vários códigos além da url. Procure por direct link ou algo parecido. Mas vamos testar para saber se pegamos o código correto, abra o seu navegador(Internet Explorer, Firefox, Opera...), coloque o código que pegou na barra de endereço e clique enter, deve aparecer sua imagem, somente a imagem, sem borda, sem link. Se aparecer algo além da sua imagem você pegou o código errado.
Aqui parece um pouco complicado, mas você verá que na hora de fazer é bem mais simples do que parece.
aparecer no Google ou Yahoo
Quando você cria um site ou blog um dos primeiros passos é adiciona-lo nos mecanismos de buscas, os mais conhecidos e usados são Google e Yahoo, ao menos são esses que enviam mais visitas para esse blog. Abaixo estão os links para enviar o endereço do seu blog ou site para esses serviços de busca, a inclusão é grátis.
Yahoo
Google
Esses mecanismos encontram os novos sites e blog automaticamente sem necessitar inscreve-los por esses links porém eles levam algum tempo para isso, portanto a melhor coisa a fazer para quem criou um site a pouco tempo é fazer a inclusão por esses links afinal isso aumentará suas visitas. Porque existem mais chances que seu blog ou site apareça nos resultados das pesquisas que as pessoas fazem no Google e Yahoo. Além desses existem muitos outros sites de busca na internet e fica a critério da cada um em qual deles vale a pena se cadastrar ou não.
Yahoo
Esses mecanismos encontram os novos sites e blog automaticamente sem necessitar inscreve-los por esses links porém eles levam algum tempo para isso, portanto a melhor coisa a fazer para quem criou um site a pouco tempo é fazer a inclusão por esses links afinal isso aumentará suas visitas. Porque existem mais chances que seu blog ou site apareça nos resultados das pesquisas que as pessoas fazem no Google e Yahoo. Além desses existem muitos outros sites de busca na internet e fica a critério da cada um em qual deles vale a pena se cadastrar ou não.
menu horizontal
Para colocar um menu horizontal no site precisamos colocar o código em duas partes distintas. Primeiro vamos colocar o CSS, no blogspot isso é feito através da pagina editar html, colocando o código abaixo junto com os demais códigos CSS do seu blog (body, main, sidebar, etc...), basta colocar o trecho abaixo junto com o restante dos códigos. Para outros blogs a regra é a mesma junto com os demais estilos CSS.
Código CSS do menu horizontal:
#menu{padding: 0px;
font: bold 12px Verdana;
margin: 0px;
width: 650px;}
#menu li{list-style: none;
display: inline;
margin: 0;
}
#menu li a:link, #menu li a:visited{
color: #0000FF;
text-decoration: none;
margin-right: 3px;
border: 2px solid #000000;
padding-top: 4px;
padding-bottom: 4px;
width: 150px;
display: block;
float: left;
text-align: center;
background-color: #FFFFCC;
}
#menu li a:hover{
color: #FFFFFF;
background-color: #FF9933;
border: 2px solid #0099FF;
}
Aqui existem algumas coisas que podemos mudar para deixar esse menu com uma aparência melhor para nosso site. Começando pela largura de cada item, isso é alterado nessa parte: width: 150px; basta trocar esse valor e pronto, contudo modificando isto mudaremos também a largura total do menu que precisará ser corrigida aqui: width: 650px. Quando colocar isso no seu site os itens do menu devem ficar um do lado do lado se isso não ocorrer modifique um destes dois valores que resolverá o problema.
Nesse exemplo o menu não está todo junto existe um pequeno espaço entre os itens para remover ou aumentar esse espaço altere o 3 nesta parte: margin-right: 3px. Finalmente as bordas:
border: 2px solid #000000;
border: 2px solid #0099FF;
Você pode mudar a largura ou a cor da borda (clique aqui e veja o código das cores), ou se preferir sem bordas basta apagar essas duas linhas.
Código CSS do menu horizontal:
#menu{padding: 0px;
font: bold 12px Verdana;
margin: 0px;
width: 650px;}
#menu li{list-style: none;
display: inline;
margin: 0;
}
#menu li a:link, #menu li a:visited{
color: #0000FF;
text-decoration: none;
margin-right: 3px;
border: 2px solid #000000;
padding-top: 4px;
padding-bottom: 4px;
width: 150px;
display: block;
float: left;
text-align: center;
background-color: #FFFFCC;
}
#menu li a:hover{
color: #FFFFFF;
background-color: #FF9933;
border: 2px solid #0099FF;
}
Aqui existem algumas coisas que podemos mudar para deixar esse menu com uma aparência melhor para nosso site. Começando pela largura de cada item, isso é alterado nessa parte: width: 150px; basta trocar esse valor e pronto, contudo modificando isto mudaremos também a largura total do menu que precisará ser corrigida aqui: width: 650px. Quando colocar isso no seu site os itens do menu devem ficar um do lado do lado se isso não ocorrer modifique um destes dois valores que resolverá o problema.
Nesse exemplo o menu não está todo junto existe um pequeno espaço entre os itens para remover ou aumentar esse espaço altere o 3 nesta parte: margin-right: 3px. Finalmente as bordas:
border: 2px solid #000000;
border: 2px solid #0099FF;
Você pode mudar a largura ou a cor da borda (clique aqui e veja o código das cores), ou se preferir sem bordas basta apagar essas duas linhas.
Ajustar largura
Uma coisa que atrapalha muita gente são as larguras do blog e dos objetos que colocamos nele. E algumas vezes nem percebemos que o problema é este, por exemplo: se você colocar um player (musica) ou vídeo no seu blog e aparece somente uma parte da imagem ou não aparece o botão play para você iniciar a musica, provavelmente o problema não está no código nem no site que fornece o serviço. Mas é tudo uma questão de espaço, ou melhor, dizendo falta de espaço.
Vamos dar um exemplo pratico: se a sidebar (coluna do menu, links, etc..) tiver uma largura de 200 px (width=200px) e você tentar colocar musica do MP3 tube provavelmente não irá aparecer o botão play, pois a largura do player é 260, então somente uma parte será visível, pois esses arquivos são no formato flash (.swf) e a mesma explicação vale também para vídeos.
Mas tem um jeito de resolver isso, alias vários jeitos, o correto seria aumentar a largura da coluna através da página editar html, encontrando a linha #sidebar{width=200px;......}que em nosso exemplo deveria ser alterado para 270px para deixar algum espaço sobrando, porque entre os navegadores existem algumas diferenças quando a interpretação dos estilos CSS por essa razão sugeri o valor 270 e não 260 que seria a medida exata do player.
Contudo nem sempre estamos dispostos a mudar nosso layout inteiro somente por causa de uma musica ou vídeo, então existe outro modo, em vez de aumentar a coluna vamos diminuir o objeto que vamos colocar nela, mas precisamos ter cuidado para não distorcer a imagem. Quando você pega um código de musica, vídeo ou alguma outra coisa em flash, usarei como exemplo um dos avisos de férias do site Cidade Web, podemos alterar seu tamanho mudando essas partes do código:
width="300"
height="225"
Existem dois detalhes fundamentais aqui: primeiro esses dois valores (width e height) aparecem duas vezes no código, portanto altere os dois senão terá problema com a visualização do conteúdo; em segundo lugar quando alterar esses valores faça de maneira proporcional, ou seja, diminua os dois valores width (300) e height (225) de tal forma que a imagem não fique distorcida, nunca transforme uma imagem retangular em quadrada ou vice e versa, pois ficará horrível. No caso acima você poderia usar os seguintes valores sem causar distorção de imagem: 250x188, 200x150, 150x113 e outros. Um lembrete final é que isso faz mudar somente o tamanho de visualização e não o tamanho do arquivo então ele irá demorar o mesmo que o arquivo no tamanho original para carregar e aparecer. Portanto fazer esse tipo de mudança pensando que irá parecer mais rapido é totalmente inútil, pois não altera em nada o tamanho do arquivo.
Vamos dar um exemplo pratico: se a sidebar (coluna do menu, links, etc..) tiver uma largura de 200 px (width=200px) e você tentar colocar musica do MP3 tube provavelmente não irá aparecer o botão play, pois a largura do player é 260, então somente uma parte será visível, pois esses arquivos são no formato flash (.swf) e a mesma explicação vale também para vídeos.
Mas tem um jeito de resolver isso, alias vários jeitos, o correto seria aumentar a largura da coluna através da página editar html, encontrando a linha #sidebar{width=200px;......}que em nosso exemplo deveria ser alterado para 270px para deixar algum espaço sobrando, porque entre os navegadores existem algumas diferenças quando a interpretação dos estilos CSS por essa razão sugeri o valor 270 e não 260 que seria a medida exata do player.
Contudo nem sempre estamos dispostos a mudar nosso layout inteiro somente por causa de uma musica ou vídeo, então existe outro modo, em vez de aumentar a coluna vamos diminuir o objeto que vamos colocar nela, mas precisamos ter cuidado para não distorcer a imagem. Quando você pega um código de musica, vídeo ou alguma outra coisa em flash, usarei como exemplo um dos avisos de férias do site Cidade Web, podemos alterar seu tamanho mudando essas partes do código:
width="300"
height="225"
Existem dois detalhes fundamentais aqui: primeiro esses dois valores (width e height) aparecem duas vezes no código, portanto altere os dois senão terá problema com a visualização do conteúdo; em segundo lugar quando alterar esses valores faça de maneira proporcional, ou seja, diminua os dois valores width (300) e height (225) de tal forma que a imagem não fique distorcida, nunca transforme uma imagem retangular em quadrada ou vice e versa, pois ficará horrível. No caso acima você poderia usar os seguintes valores sem causar distorção de imagem: 250x188, 200x150, 150x113 e outros. Um lembrete final é que isso faz mudar somente o tamanho de visualização e não o tamanho do arquivo então ele irá demorar o mesmo que o arquivo no tamanho original para carregar e aparecer. Portanto fazer esse tipo de mudança pensando que irá parecer mais rapido é totalmente inútil, pois não altera em nada o tamanho do arquivo.
sábado, 20 de setembro de 2008
Elementos adicionais ao "Esquema do Template"
Se repararem, ao entrarem no Esquema do vosso blogue, encontrarão algo muito semelhante ao que a imagem mostra:
O que acontece é que, muitas vezes, queremos inserir informação noutros sítios e não podemos. Pois bem, com este truque, tal já nos é permitido. Basta, para tal, alterar um pouco do código do nosso template. Para isso entre no modo de edição de HTML do seu blogue e não necessita de expandir os Modelos de Widgets.A partir daqui, a escolha é sua:.Para adicionar elemento na Header (cabeçalho):.
Encontre a seguinte linha de código:
b:section class='header' id='header' maxwidgets='1' showaddelement='no'
substitua-a por esta:
Para adicionar elemento na secção das entradas:.
Encontre a seguinte linha de código:
b:section class='main' id='main' showaddelement='no'
Agora, volte ao Esquema do seu blogue e encontrará algo semelhante à imagem.
O que acontece é que, muitas vezes, queremos inserir informação noutros sítios e não podemos. Pois bem, com este truque, tal já nos é permitido. Basta, para tal, alterar um pouco do código do nosso template. Para isso entre no modo de edição de HTML do seu blogue e não necessita de expandir os Modelos de Widgets.A partir daqui, a escolha é sua:.Para adicionar elemento na Header (cabeçalho):.
Encontre a seguinte linha de código:
b:section class='header' id='header' maxwidgets='2' showaddelement='yes'
Para adicionar elemento na secção das entradas:.
Encontre a seguinte linha de código:
b:section class='main' id='main' showaddelement='no'
Substitua-a por esta:
b:section class='main' id='main' maxwidgets='3' showaddelement='yes'
Agora, volte ao Esquema do seu blogue e encontrará algo semelhante à imagem.
sábado, 13 de setembro de 2008
Contador discreto
Quer saber quantos visitantes estão on line no seu blogue?
Mas queria ter um contador discreto que até tivesse as cores tal qual as da sua página?
Pois entre aqui e veja como é simples consegui-lo! Basta seleccionar as cores que pretende e copiar o código HTML que se encontra abaixo. O resultado será semelhante a este:
Quer saber quantos visitantes estão on line no seu blogue?
Mas queria ter um contador discreto que até tivesse as cores tal qual as da sua página?
Pois entre aqui e veja como é simples consegui-lo! Basta seleccionar as cores que pretende e copiar o código HTML que se encontra abaixo. O resultado será semelhante a este:
ContadorWeb
ContadorWeb é uma página que fornece contadores para páginas. É muito fácil, basta preencher um pequenoformulário, eleger o contador que mais te agradar, copiar e colar o código que é fornecido e já está.
calendários
Mais calendários
Entretanto descobri mais uma página que permite a inserção de calendários nos blogues: trata.se de da arte e estilo.
Entretanto descobri mais uma página que permite a inserção de calendários nos blogues: trata.se de da arte e estilo.
Eliminar a Navbar do Blogger Clássico
Eliminar a Navbar do Blogger Clássico
Para uem usa o blogger clássico, o meu conselho é passar para a versão actualizada, pois é muito mais rápida e prática. No entanto, se persistirem em servir-se do antigo blogger, aqui vai a forma de ocultar a Navbar:Abram o vosso blog na edição de HTML e procurem o seguinte código:
style type="text/css
e imediatamente a seguir clem este
#b-navbar {visibility:hidden;}
Ficará qualquer coisa como:
style type="text/css
#b-navbar {visibility:hidden;}
E é tudo!
Para uem usa o blogger clássico, o meu conselho é passar para a versão actualizada, pois é muito mais rápida e prática. No entanto, se persistirem em servir-se do antigo blogger, aqui vai a forma de ocultar a Navbar:Abram o vosso blog na edição de HTML e procurem o seguinte código:
style type="text/css
e imediatamente a seguir clem este
#b-navbar {visibility:hidden;}
Ficará qualquer coisa como:
style type="text/css
#b-navbar {visibility:hidden;}
E é tudo!
O que é Template?
O que é Template?
Template é uma página WEB que especifica o layout padrão(modelo) de um site, blog, fotolog, etc. É no template que são informadas as posições de cada item dentro de seu blog, como por exemplo o menu, o mural, os textos, etc...É no template que você poderá adicionar os acessórios que temos no site.
Template é uma página WEB que especifica o layout padrão(modelo) de um site, blog, fotolog, etc. É no template que são informadas as posições de cada item dentro de seu blog, como por exemplo o menu, o mural, os textos, etc...É no template que você poderá adicionar os acessórios que temos no site.
Onde posso criar um Blog?
Onde posso criar um Blog?
Para criar um Blog é só você se cadastrar no site que oferecem esse serviço de Servidores de Blog.Lista com os links dos locais que você poderá criar seu blog gratuitamente:
Weblogger - http://weblogger.terra.com.br
Blogger - http://blogger.com
Blig - http://blig.ig.com.br
Sapo - http://blogs.sapo.pt
Blog-se - http://www.blog-se.com.br
UOL Blog - http://blog.uol.com.br
The Blog - http://theblog.com.br
* Temos também modelos de templates para esses servidores de blogs, se quiser escolher templates: Clique aqui
Para criar um Blog é só você se cadastrar no site que oferecem esse serviço de Servidores de Blog.Lista com os links dos locais que você poderá criar seu blog gratuitamente:
Weblogger - http://weblogger.terra.com.br
Blogger - http://blogger.com
Blig - http://blig.ig.com.br
Sapo - http://blogs.sapo.pt
Blog-se - http://www.blog-se.com.br
UOL Blog - http://blog.uol.com.br
The Blog - http://theblog.com.br
* Temos também modelos de templates para esses servidores de blogs, se quiser escolher templates: Clique aqui
O que é um flog?
O que é um Flog?
O Flog é uma página web atualizada freqüentemente que contém somente Fotos. É como um diário de fotos que são organizadas seqüencialmente com datas das postagem das fotos.
O Flog é uma página web atualizada freqüentemente que contém somente Fotos. É como um diário de fotos que são organizadas seqüencialmente com datas das postagem das fotos.
O que é um blog?
O que é um Blog?
O blog é uma página web atualizada freqüentemente. É como um jornal que segue uma linha de tempo com um fato após o outro. O conteúdo e tema dos blogs abrange uma infinidade de assuntos que vão desde diários, piadas, links, notícias, poesia, idéias, fotografias, ou seja, tudo que a imaginação do autor permitir.
O blog é uma página web atualizada freqüentemente. É como um jornal que segue uma linha de tempo com um fato após o outro. O conteúdo e tema dos blogs abrange uma infinidade de assuntos que vão desde diários, piadas, links, notícias, poesia, idéias, fotografias, ou seja, tudo que a imaginação do autor permitir.
Como fazer um link?
A TAG usada para Linkar é a seguinte:
Texto que aparecerá como meu link
Saiba pra que serve:
href - Serve para colocar o Endereço(URL) da página que você quer linkar
target - _blank (Abre a página em nova janela)
Exemplo na prática para linkar o site Mais Blog:
Mais Blog
O resultado desse link exemplo: Mais Blog
» Se precisar criar Links Texto, temos também Gerador de Links: Clique aqui
» Se precisar criar Link com Imagem, temos também Gerador de Links (Imagens): Clique aqui
Texto que aparecerá como meu link
Saiba pra que serve:
href - Serve para colocar o Endereço(URL) da página que você quer linkar
target - _blank (Abre a página em nova janela)
Exemplo na prática para linkar o site Mais Blog:
Mais Blog
O resultado desse link exemplo: Mais Blog
» Se precisar criar Links Texto, temos também Gerador de Links: Clique aqui
» Se precisar criar Link com Imagem, temos também Gerador de Links (Imagens): Clique aqui
quarta-feira, 10 de setembro de 2008
Preste atencao no titulo da postagem
Antes de escolher qualquer título para suas postagens, lembre-se de que o Google dá grande importância as palavras-chaves contidas neles, para selecionar os resultados de uma busca.
O interessante para se destacar entre os resultados de busca é criar títulos que contenham as palavras que provavelmente as pessoas digitarão para chegar ao seu conteúdo.
Outro detalhe importante é evitar acentuação e determinados caracteres . Por que isso? Por que eles acabam sendo suprimidos, o que desconfigura completamente o título original.
O interessante para se destacar entre os resultados de busca é criar títulos que contenham as palavras que provavelmente as pessoas digitarão para chegar ao seu conteúdo.
Outro detalhe importante é evitar acentuação e determinados caracteres . Por que isso? Por que eles acabam sendo suprimidos, o que desconfigura completamente o título original.
Assinar:
Postagens (Atom)