Postagens

Mostrando postagens com o rótulo HTML

#VIDEOAULA - Design Responsivo por Node Studio

Imagem

#SLIDEDOBLOG - Slide Diapo

Imagem
Oi gente! Esse tutorial é do slide que é usado aqui no blog. Confira abaixo o tutorial. Diapo by Pixedelic 1) Coloque esse código no seu css.

#VIDEOAULA - Curso de HTML e CSS para iniciantes

Imagem

#BLOGGER: Rodapé personalizado

Imagem
Oi Gente! o tutorial de hoje é um estilo diferente de rodapé, já vários blogs/sites usando, então eu adaptei um código de outro post do blog - pra quem não viu é esse aqui - é bem fácil de usar, clique em "Mais informações" para conferir o tutorial completo.

#CUSTOM: Background personalizado

Imagem
Oi gente :) hoje eu trouxe um código que bastante gente está usando nos blogs/sites, o código é do Lucas Miquéias . Confira abaixo a prévia e clique em Mais informações para conferir o tutorial.

#CUSTOM: Div Style

Imagem
Boa noite *O* . Bom, eu tive uma ideia de fazer tipo uma " serie " de postagens relacionadas a personalização - por isso o #custom ( serio? ) - então eu vou tentar postar uma por dia, como é personalizar pode ser que eu pegue códigos de outros e " inove " eles - como eu fiz hoje - o post de hoje, eu foquei mais naquelas  barras ( ? ) que ficam as ultimas imagens . Cliquem em Mais Informações para ver o tutorial .

Ask: Box personalizada twitter

Imagem
Oi gente, como foi pedido na Ask, aqui está o tutorial é o mesmo processo do box facebook . Confira abaixo.

ASK: Menu redes sociais

Imagem
Oi gente, mais um tutorial que foi pedido. Esse menu é bem simples. Confira o resultado e o tutorial para blogger e Wordpress.

Facebook: Janela pop up no blogger

Imagem
Oi gente! Bom esse tutorial foi o único que deu certo aqui no blog, tentei vários outros e não deu certo, esse é mais legal, porque ele fecha sozinho {:B}. Clique aqui e confira o tutorial.

ASK: Menu Lava Lamp

Imagem
Oi gente! Mais um tutorial que foi pedido na ask que conseguimos fazer, esse menu na verdade é do site Gmarwaha , e esse será uma versão adaptada para vocês, então sem duvida nenhuma créditos para eles.Veja o resultado abaixo e confira o tutorial clicando em Mais Informações . Resultado

Menu Bracket

Imagem
Oi gente! esse tutorial eu montei em cima de dois outros tutoriais um é de blog So Kawai, nosso parceiro, e outro é do Tympanus/Crodops um site de tutoriais muito bom. Confira o resultado e o tutorial abaixo: RESULTADO.

Como fazer sidebar personalizadas

Imagem
Oi pessoal, mais uma vez, eu estou fazendo um tutorial, enfim, eu estava vendo a ASK do Sugoi, e achei uma pergunta de como fazer sidebares igual do FansBr. A nova versão deles, estão com sidebares personalizadas, cada um digamos de um tamanho, e hoje, irei passar um código que eu criei para vocês, vamos lá. Coloque isso na sua css ( style.css ou abaixo do ]]> ) o seguinte código: .side1 {width:150px; height:180px; background:#000;} .side2{margin-left:162px; margin-top:-180px; width:150px; height:180px; background:#000;} .side3{margin-left:-px; margin-top:10px; width:313px; height:310px; background:#000;} .side4{margin-left:-px; margin-top:10px; width:313px; height:110px; background:#000;}

Fontes para títulos

Imagem
Olá! separei algumas fontes para colocar em títulos, tanto na área de postagens como na sidebar. Foram todos retiradas do Google Fonts. Confiram abaixo:

Destaques: Caixa de textos

Imagem
Oi gente eu percebi que vários sites estão usando um jeito legal de colocar destaques, as vezes são mais no rodapé. Nesse exemplo o destaque está sendo 220px de largura e 500px de altura, isso pode ser alterado de acordo com o seu gosto confira o resultado e o tutorial:  RESULTADO.

Menu Sanfona

Imagem
Oi gente, como pediram na Ask, eu procurei e achei no blog Mundo Blogger um tutorial fácil então confiram: RESULTADO

Facebook: Box Personalizada

Imagem
Oi gente, vários e vários blogs/sites estão usando as suas box's personalizadas lindas e maravilhosas que deixam o template a coisa mais linda do mundo então ... eu decidi postar clique em mais informações e confira o tutorial.

Destaques

Imagem
Oi gente, como pediram no ask, como fazer uma parte para destaques no site decidi postar esse que eu sei, confiram o resultado e o tutorial abaixo. 1 - Coloque esse código em seu css: Código link 2 - Coloque esse código aonde você quer que apareça: <div class="view view-third"> <img src="URL DA IMAGEM" /> <div class="mask"> <h2>TITULO</h2> <p>Aqui Você coloca um pouco sobre o que vai ficar em destaque.</p> <a href="#" class="info">Leia Mais</a> </div> </div> Meu Resultado. Créditos : Tympanus

Menu Borda

Imagem
{leiam o livro A Seleção e A Elite} Oi gente, bom esse menu eu editei com a inspiração no site Mcyrus.com o porque da inspiração é só a borda, lá você vê que o header tem uma borda então eu editei o menu confiram o resultado e cliquem em Mais Informações para ver o tutorial: Nome Nome Nome Nome

Menu Agenda

Imagem
Oi gente, como pediram na Ask. como fazer uma agenda personalizada, achei melhor fazer um "Menu Agenda" que é mais fácil para explicar. Para esse tutorial eu usei um menu do Tumblr Single Themes e o modifiquei {já postei aqui confiram}: Ver Resultado

Código Base portal por Sweetness Design

Imagem
Oi gente bom depois de uma semana eu estou de volta e vai ser assim por um bom tempo e agora o Sugoi tem mais uma colaboradora que é a Lorrayne, ela vi fazer um post se apresentando. Então sobre o código os créditos são para o blog Sweerness Designs -Mayara Pescovic e para ter acesso a ele siga essas regras clique aqui para ir ao blog.