Update!

Primeiramente quero te agradecer. Obrigado por ainda visitar esse site. Fico muito feliz! :)
Como sabem todos os meus trabalhos estão desatualizados. Não tenho a intenção de voltar mas isso não quer dizer que os mesmos estão desativados, pelo contrário, todos estão online. Cada projeto que participei foi elaborado e contemplado com uma gama de conteúdos e com uma equipe de excelência. Obrigado a toda a equipe!

Foi muita gente e não lembro de todos mas obrigado por fazerem parte, mesmo por um curto momento desses projetos.

Segue abaixo os projetos ainda ativos:

www.animessoul.blogspot.com.br
www.tube-project.blogspot.com.br
www.designerprooject.blogspot.com.br
www.up-tutorial.blogspot.com.br
www.scalerdesign.blogspot.com.br

 Até a próxima! ;)

Ulquiorraaaaaaaaaaaaaaaaaaaaaaaa!

Ulquiorraaaaaa por favor deixa seu contato aqui em baixo, pô to com saudades mano, Aqui é o Orochimaru! To com muita nostalgia manooo! Queria contato seu e do Minato, passa o skype ai, se não tiver cria um por favor ou se não adiciona la: uchiha.madara132 (é uchiha.madara132 mais continuo sendo o Orochimaru kkkkkkkkkkkkkk)

Orochimaru Aquii

Yoooooooooooo Galera quem está vendo este poste deixe contato no comentario

Aviso!

Estamos oficialmente fechados, contudo devido ao grande numero de postagem que aqui estão, estou deixando a designer project online para todos que desejam ainda usufruir do conteúdo encontrado aqui. Não sabemos se voltaremos algum dia, mas sempre há a minha vontade de voltar! Basta apenas encontrar tempo para poder postar. Caso um dia eu encontre tempo estarei com certeza voltando com o site para vocês! Vamos torcer!!!

Slide No Blogger

Me desculpa não ter postado esse tutorial antes. Eu acabei me distraindo e me esqueci de postar, Vamos ver como por Slides no blog? Os slides que me refiro são aqueles que tem uma setinha pra mudar o slide e com efeitos hovers diferentes.










Vamos ver como faze-lo? Então clique no Leia Mais.

 Primeiro, você vai em Design/Modelo > Editar HTML > Ctrl + F e procure por </head> e acima cole:



Agora procure por ]]> e acima cole:



Você não precisa mudar NADA. Agora vamos adicionar o slide em algum Lugar do blog. Vá em Design/Modelo > Elementos da página > Adicinar um gadget HTML/JavaScript > Cole esse código:


Primeiro você vai ter saber a largura das imagens, e ter o link. Saiba o que cada parte significa:
LINK DA IMAGEM: Link da imagem.
width/height: Largura e altura da imagem (height: altura & widht: largura).
LINK: O link.
Bem mais fácil do que se parece né? Espero que tenham gostado do tutorial. Obrigado e até.

Box com Biografia do Auto e Redes Sociais

 Pessoal,novamente estava procurando tutoriais e achei este bem interessante! Box com Biografia e Redes Sociais! Vejam uma imagem demonstrativa:



Código CSS:


/* Bio Autor Box */
.autorbox {
    position: relative;
    margin: 20px auto;
    border: 10px solid #CAE3F2;  /*cor da borda do box*/
    padding: 5px;
     -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}
.autorbox:hover {
    border: 10px solid #E7F2F9;  /*cor da borda do box hover*/
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}
.autoravatar {
    background: #fff;
    border: 1px solid #ccc9bd;  /*cor da borda do avatar*/
    float: left;
    height: 100px;
    padding: 2px;
    position: relative;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 4px 0 #d9d9d9;
    -moz-box-shadow: 0 0 4px 0 #d9d9d9;
    box-shadow: 0 0 4px 0 #d9d9d9;
    width: 100px;
}
.autoravatar img {
    height: 100px;
    width: 100px;
}
.autorcontent {
    margin-left: 120px;
}
.autorhead {
    border-bottom: 1px solid #ddd;
    margin-bottom: 12px;
    padding: 0 160px 5px 0;
    position: relative;
}
.autorbox h3 {
    font-family: Arial, Verdana, georgia, serif;
    color: #3399bb; /*cor da fonte do nome do autor*/
    font-size: 24px;
    font-weight: bold;
    line-height: 30px;
    margin: 0;
    border: none;
   text-transform:uppercase;
    text-decoration: none;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.autorbox h3:hover {
    color: #0b5b94;  /*cor da fonte do nome do autor com mouse em cima*/
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.autorbox h3 a {
    color: #3399bb!important;  /*cor da fonte do nome do autor*/
    text-decoration: none;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.autorbox h3 a:hover {
    color: #0b5b94!important;  /*cor da fonte do nome do autor com mouse em cima*/
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.autorsocial {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 2px;
    right: 0;
}
.autorsocial li {
    float: left;
    margin-right: 4px;
    padding: 0;
}
.autorsocial li a {
 display:block;
 width:32px;
height:32px;
margin:0 2px;
background:transparent url(http://3.bp.blogspot.com/-atvhxnn9xVI/UKXReUQS5UI/AAAAAAAAAM4/b--qqw3W49s/s1600/bg_sprites2.png) no-repeat;
text-indent:-9000px;
 position: relative;
 overflow:hidden;
}
.autorsocial li a.autorFacebook {
    background-position: 0 0;
}
.autorsocial li a.autorGooglePlus {
    background-position: 0 -32px;
}
.autorsocial li a.autorTwitter {
    background-position: -64px -32px;
}
.autorsocial li a.autorLinkedin{
 background-position: -64px 0px;
}
.autorsocial li a.autorLinkedin:hover {
background-position: -96px 0px;
}
.autorsocial li a.autorFacebook:hover {
    background-position:-32px 0;
}
.autorsocial li a.autorGooglePlus:hover {
    background-position: -32px -32px;
}
.autorsocial li a.autorTwitter:hover {
    background-position: -96px -32px;
}
.autorbox p.bio {
    font-family: 'lucida sans unicode', 'lucida grande', sans-serif;
    font-size: 12px;
    line-height: 18px;
}

Agora clique em Expandir modelos de widgets e procure por <div class='post-footer'> e abaixo dela cole o seguinte código:


<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.author == "NOME-DO-AUTOR"'>
<div class='autorbox'>
  <div class='autoravatar'>
    <img alt='NOME-DO-AUTOR' src='URL-DA-IMAGEM'/>
  </div>

  <div class='autorcontent'>
    <div class='autorhead'>
      <h3><a href='AUTOR-LINK'>NOME DO AUTOR</a></h3>

      <ul class='autorsocial'>
         <li><a class='autorFacebook' href='FACEBOOK-LINK' target='_blank' title='Facebook'>Facebook</a></li>

        <li><a class='autorGooglePlus' href='GOOGLEPLUS-LINK' target='_blank' title='GooglePlus'>GooglePlus</a></li>

        <li><a class='autorTwitter' href='TWITTER-LINK' target='_blank' title='Twitter'>Twitter</a></li>

        <li><a class='autorLinkedin' href='LINKEDIN-LINK' target='_blank' title='Linkedin'>Linkedin</a></li>
      </ul>
    </div>

    <p class='bio'>Coloque aqui o texto que você deseja usar para descrever o autor. Recomendo que não tenha mais que 2 linhas. 
<br/><a href='LINK'>Leia Mais sobre o autor</a></p>
  </div>
</div>
</b:if>
</b:if>