Personalizar Caixinha link-me

É possível dar uma nova aparência(formatar) a caixinha link-me retirando a barra de rolagem ou alterando suas bordas, isso tudo é fácil para fazer basta colocar um estilo (style) no código do textarea, esse é o nome correto da caixinha link-me. O código para fazer isso é:

<textarea style="overflow:hidden; border:1px dashed #0000FF; background:#FFFFCC; width:100px; height:40px"onfocus="this.select()" onmouseover="this.focus()">Conteudo da caixinha</textarea>


Quem já sabe um pouco de CSS já notou que a única coisa diferente é que aplicamos os mesmos recursos usados na formatação de uma pagina, texto ou botão no código da caixinha link-me, veja que o faz cada parte do código:

overflow:hidden – oculta a barra de rolagem
border:1px dashed #0000FF - estilo e cor da borda, veja aqui como usar outros tipos de bordas.
background:#FFFFCC – cor de fundo, veja o código de outras cores.
width:100px; height:40px – largura(100) e altura(40) da caixinha.

Depois que terminar de formatar para deixar com uma aparência que combine com o seu blog é só colocar do mesmo jeito que qualquer outra pela pagina layout, adicionar gadget, html/javascript. Se você usa varias caixas de texto desse tipo no blog e quiser mudar a aparência de todas elas também é possível e muito simples de fazer. Entre na pagina editar html e procure por body{.....} logo depois que fechar as chaves do body coloque isso:

textarea {overflow:hidden; border:1px dashed #0000FF; background:#FFFFCC; width:100px; height:40px}

Fazer alterações aqui é da mesma forma que mostramos acima para uma caixinha individualmente, mas aqui as mudanças que fizer serão aplicadas a todas as caixas de texto (textarea) do seu blog. Note que o inicio do código é textarea não tem ponto nem qualquer outro sinal antes da palavra.

Veja também:

Caixinha com o link da postagem
Fazer galeria de fotos
Registrar domínio (blog com endereço .com.br)
Configurar o domínio no Uolhost
Gerador de tags
Imagem no título das postagens
Modificar gadgets separadamente

Link para esta página
<a href='http://www.dicasparablogs.com.br/2009/09/personalizar-caixinha-link-me.html'>Personalizar Caixinha link-me</a>

Recomende por E-mail