Postagens Recentes

5 de dez. de 2009

Menu em abas de fácil instalação

12 comentários:

Sem delongas e tá, tá, tá de código e expandir nada, esse código para menu em abas é pá, pum. Copiou, colou no HTML/Javascript e pronto. Depois, lógico que você terá que inserir os códigos do que você quer linkar né ? Mas então vamos lá, num zás tráz.








<style type="text/css">
    div.TabTampil div.TTs
    {height: 24px; overflow: hidden; }
    div.TabTampil div.TTs a:hover, div.TabTampil div.TTs a.Active
    { background-color: #77d0ee; }
    div.TabTampil div.Halamans
    { clear: both; border: 1px solid #0199cb; overflow: hidden; background-color: #ffffff;}
    div.TabTampil div.Halamans div.Halaman
    { height: 100%; padding: 0px; overflow: hidden; }
    div.TabTampil div.Halamans div.Halaman div.Alas
    { padding: 3px 5px; }
    div.TabTampil div.TTs a
    { border-left:1px solid #0199cb; border-right:1px solid #0199cb; border-top:1px solid #0199cb;  float: left;
    display: block; width: 100px; text-align: center; height: 24px; padding-top: 3px; vertical-align: middle; text-decoration: none; font-family: "Arial", Serif;
    font-size: 12px; font-weight: 900; color: #222}
    </style>
 <form action="tabtampil.html" method="get">
    <div id="TabTampil" class="TabTampil">
    <div style="width: 370px;" class="TTs">
<a>Link 1</a>
<a>Link 2</a>
<a>Link 3</a>
</div>
    <div style="width: 350px; height: 300px;" class="Halamans">
   <div class="Halaman">
    <div class="Alas">
   INSIRA O CÓDIGO DO LINK 1
    </div>
    </div>
    <div class="Halaman">
    <div class="Alas">
    INSIRA O CÓDIGO DO LINK 2
    </div>
    </div>
    <div class="Halaman">
    <div class="Alas">
    INSIRA O CÓDIGO DO LINK 3
    </div>
    </div>
    </div>
    </div></form>
  <script style="text/javascript" src="http://meichelina.googlepages.com/newscriptab.js"></script> <script type="text/javascript">tabtampil_inisial('TabTampil');</script>



Código na cor verde é a largura da tabela.
Código em azul é o título da tabela.
Código em vermelho é onde deve ser inserido os códigos que vc quer dentro da tabela.

3 de dez. de 2009

Template Mac

7 comentários:
Template em 2 colunas no estilo revista. Páginas internas no tamanho total do blog, avaliação das postagens, tradutor e menu com imagens.




Template Templates e Acessórios

17 comentários:
Template em 3 colunas no estilo revista mais 3 colunas no footer, menu horizontal, slide  e tradutor. Páginas internas ocupam toda a área do blog.




Menu em tabela

6 comentários:
Para quem perguntou-me como colocar um menu como este que etenho em meu blog, eis o código. Copie, vá até o HTML de seu blog e cole-o antes de:



<div id='header-wrapper'>  Para que fique acima do cabeçalho

Para que fique depois do cabeçalho, cole antes de:

<div id='content-wrapper'>



<!-- COLOQUE ABAIXO OS LINKS DE SEU MENU EM TABELA -->
<table cellpadding='0' cellspacing='0' margin='3px' width='100%'><tr>
<td align='right'><table bgcolor='#464646' border='0' cellpadding='3' cellspacing='0'><tbody><tr>
<td style='vertical-align: top; width: 236px;'><b>
<a href='ENDEREÇO LINK 1' style='color: #cccccc' target='_blank'>LINK 1</a></b><br/><span style='font-weight:normal;color:#000000;'>INSCRIÇÃO LINK 1</span><br/><small><a href='LINK 1 BAIXO' style='font-weight:normal; color: #7A8571' target='_blank'>INSCRIÇÃO OCULTA LINK 1 </a></small></td>

<td style='vertical-align: top; width: 236px;'><b>
<a href='ENDEREÇO LINK 2' style='color: #cccccc' target='_blank'>LINK 2</a></b><br/><span style='font-weight:normal;color:#000000;'>INSCRIÇÃO LINK 2</span><br/><small><a href='LINK 2 BAIXO' style='font-weight:normal; color: #7A8571' target='_blank'>INSCRIÇÃO OCULTA LINK 2 </a></small></td>

<td style='vertical-align: top; width: 236px;'><b>
<a href='ENDEREÇO LINK 3' style='color: #cccccc' target='_blank'>LINK 3</a></b><br/><span style='font-weight:normal;color:#000000;'>INSCRIÇÃO LINK 3</span><br/><small><a href='LINK 3 BAIXO' style='font-weight:normal; color: #7A8571' target='_blank'>INSCRIÇÃO OCULTA LINK 3 </a></small></td>

<td style='vertical-align: top; width: 240px;'>
<div id='google_translate_element'/><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: &#39;pt&#39;
  }, &#39;google_translate_element&#39;);
}
</script><script src='http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit'/>
</td>



<td style='vertical-align: top; width: 20px;'>
<a href='ENDEREÇO DO SEU FEED' rel='alternate' title='RSS Feed'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvdqfk73d3fnwCvhz5RL_hAqpOxD2_bWh86BSBiHca6MGc3rMprApFkyacK7HL6xOlQEswfmIklGILR_xXIGhidTtP4ixGHMDEL1UMhxXcw5SJGzPLhat0IWyR3u6XpS1MIymOuaqKQnI/s1600/1258050851_rss.png' style='horizontal-align: center;'/></a>
</td>

<td style='vertical-align: top; width: 20px;'>
<a href='ENDEREÇO DO SEU BLOGBLOGS' rel='alternate' title='Blog Blogs'><img alt='Blog Blogs' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmx0Cu0MeVC2SjXEqxTiILRPrj9Ouy7me-r6m8IQApmYswXQLiR4KGqzO3vCPWBv6JQkWMXDZBHlp2M3UJbM3JMFm6tsx-YEM60CxOx5UNceWy_2nFrwLtFD1ThN4NpWjU9Jf0o4Lr8QA/s1600/1258050871_BLOGBLOGS.png' style='horizontal-align: center;'/></a>
</td>

<td style='vertical-align: top; width: 20px;'>
<a href='http://twitter.com/SEU-NICK-DO-TWITTER' rel='alternate' title='Twitter'><img alt='Siga-me' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGHTp_9qxXbk_yjgTDh_wYQ2WkAmGaqAfojFTwcJkDlnnUL3Z3kdg9c2_eJ9KnjRY9-tYUt1XAgfCc0nyZJ95wkZKmMmxWpCC_27mJvYQRIyoSvahL-2mMKaqJs-srAMPrK7L2VIcmi-M/s1600/1258050838_twitter.png' style='horizontal-align: center;'/></a>
</td>
<td style='vertical-align: top; width: 20px;'>
<a href='mailto:SEU-EMAIL-AQUI@gmail.com' title='Email'><img alt='Escreva-me' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM96unj158WrPMyn9nH79tLQKKJZv9L8H8RgjtZBJ1FwlR1sovft0S3bXnyCzp8NPuPjC1wySCBiF6G7e1pHL7lr30d1466GT1-bcaog4c0GkWO-2B9fkRau0O6wJOm1K1JJ5JPnmV8MQ/s1600/1258050871_EMAIL.png' style='horizontal-align: center;'/></a>
</td>
</tr></tbody></table></td></tr></table>

No código acima onde está em verde é a cor de fundo do menu.
Em cinza é a cor das letras do menu
 Em azul é para que você troque pelos seus links, é a parte escrita.
Em vermelho é o tradutor, caso não o queira, apague todo o código.
Em rosa já representa a parte dos botões. Coloque o seu enick e o endereço conforme é pedido nos locais indicados.

26 de nov. de 2009

Ausência

Um comentário:

Pessoas queridas, desculpem-me por ter fechado os comentários e não estar atualizando o blog e nem respondendo aos emails mas estou em reforma na minha casa, pintando tudo, trocando os móveis, trocando as crianças de quarto, enfim, uma bagunça, podem imaginar isso dentro de um apartamento ? É a correria para ir comprar tinta que acabou, fio de espessura x,  bucha maior, parafuso menor...Semana que vem eu volto. Beijos

Edilene fofa, seu blog está pronto, você pode ir postando e me escreva a medida em que encontrar coisinhas que não sejam de seu agrado ou coisinhas que você quer que eu coloque, tá ? Beijos

19 de nov. de 2009

Árvores de Natal, sinos, guirlandas para enfeitar seu blog

Um comentário:
Mais enfeites para seu blog. Imagens de árvores de natal, sinos e guilandas.

18 de nov. de 2009

Efeito degradê nas letras

3 comentários:
Faça posts com escritas assim, em degradê de cores. Não fica lindo ? Pois é, isso é algo que se usava muito no Live Spaces. Então entre no site, escreva o que quiser e depois cole o código no editor de textos no modo HTML.









Veja na imagem como funciona





Efeito em texto com CSS para o Blogger

Um comentário:

Quando comecei a blogar, a mais ou menos 6 anos atrás, efeitos em textos era algo muito usado, mas eu usava o Live Spaces que depois descobri que nem blog é considerado. Há pouco a Gem@ trouxe essa "novidade" com o código sendo usado no Blogger. Como me pediram vou colocar aqui alguns exemplos.








Se você deseja fazer o efeito no título do blog ,procure por este trecho abaixo e insira o código desejado depois dele.

#header h1 {

Ficará assim:









Se você deseja fazer este efeito nos títulos da sidebar, então procure pelo trecho.

/* Sidebar Content
----------------------------------------------- */

E depois dele cole o seguinte código colocando onde está em verde o código desejado.

#sidebar h2 { COLE AQUI O CÓDIGO DESEJADO}

Ficará assim:







 Se você deseja colocar o código nos títulos das postagens, procure pelo seguinte código e depois dele cole o código desejado.

.post h3 {


Ficará assim:










Códigos: Troque os códigos na cor azul pelo código da cor que quiser





text-shadow: 2px -2px 30px #06DC06;



text-shadow:  -10px 10px 10px #808080;

 text-shadow:  1px 1px 1px #cc0000;

text-shadow:  -1px -1px 1px #cccccc;


text-shadow:  1px 1px 1px #cccccc;

text-shadow:  1px 3px 1px #cccccc;



text-shadow:  2px 3px 2px #cccccc;


Como pode observar há infinitos efeitos a se fazer, tudo depende das cores que se escolhe, cor da letra, cor do fundo e cores do efeito shadow, dependerá de sua criatividade.


 *Atenção que não são todos os navegadores que suportam este efeito.

17 de nov. de 2009

Template Troll

Um comentário:
Template em 3 colunas, menu em abas, leia mais, número de comentários no título das postagens, 2 menus horizontais, tradutor Google. Imagem Toca do Troll.





Copyright © Templates e Acessórios |
Design by Elke di Barros | Tecnologia do Blogger
    Twitter Facebook Google + YouTube