Como criar um Template

Olá pessoal, Sou o João Pedro e vou ensinar no Site  Seu Orkut Nota 10, pois eu vi que tem muita gente com dúvida de como fazer um template... vai então galera...

Um template é composto por 2 partes... a parte do DESIGN e a parte do CODIGO...

vou começa ensinado a parte do design que é mais facil...

PARTE 1 - PARTE DO DESIGN

A parte do design surgi a parti da sua criatividade e talento... para vc poder fazer um template com imagens legais é necessario q saiba mecher em alguns programas de design... como o Corel Draw, PhotoShop, Fireworks( o mais facil de mecher e o mais usado)

mais pra vc poder aprender a fazer o template mais rapido e sem nenhuma necessidade de fikar se preocupando com imagens eu coloquei duas imagens na internet

Imagem 01
Essa Imagem ela é a figura principal, aquela imagem que fika bem em cima

Imagem 02
Essa Imagem será o fundo, todo template precisa de um fundo...

Certo agora que a parte do design está feita, vamos para a parte mais "CHATA" de um template, o CODIGO FONTE


PARTE 2 - CODIGO FONTE

O Codigo fonte é a parte principal de um site, blog, etc... é não é dificil aprender o CODIGO FONTE, ele é chamado de HTML... todos devem ter ouvidos já... certo... vou tentar explicar rapido e facil de aprender... vamos lá

O codigo fonte é compostos por tags, são elas: HTML, HEAD, TITLE e BODY, todas as tags é necessario fechar, ex: <HTML> xxxxxxxxx </HTML>

HTML é a tag principal
HEAD é a tags que poucas vezes é usado... é mais usado em alguns SCRIPT
TITLE como o nome mesmo diz, é a parte que fikara o titulo do seu site
BODY é o corpo do site... nele que colocaremos todo o codigo...

ai galera eu vou colocar o codigo inteiro aqui e depois vou explicando parte por parte certo...

CODIGO INTEIRO
<html>
<head>

                                           <!-- NÃO MUDE NADA ATÈ ALI EM BAIXO-->
             <STYLE type="text/css">
<!--
BODY {
scrollbar-face-color: FFFFFF;
scrollbar-highlight-color: 000000;
scrollbar-3dlight-color: 000000;
scrollbar-darkshadow-color: FFFFFF;
scrollbar-shadow-color: FFFFFF;
scrollbar-arrow-color: 000000;
scrollbar-track-color: 000000;
}
-->
</STYLE>
<meta http-equiv="Content-Language" content="pt-br">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script language="Javascript1.2" src="http://blig.ig.com.br/js/funcoes_templates.js"></script>
<STYLE type="text/css">
P, body, td, tr, div {
        font-style: normal;
        font-weight: normal;
        font-size: 10px;
        color: #FFFFFF;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        line-height: 12px;
}
A, A:link{color:#FFFFFF;text-decoration:none}
A:visited{color:#FFFFFF}
A:active{color:#FFFFFF}
a:hover {text-decoration: none; filter: shadow(Color=#666666, strength=1);      height:0px;     cursor: hand;   font-family: Verdana, Arial, Helvetica, sans-serif;     color: #FFFFFF}
hr{width:100%;color:#4FC7FB;height:5;border:1px solid #1A348B; text-align:center}
</STYLE>

                                                          <!-- FIM DA ONDE NÂO È PRA MUDAR -->
                
                                                      <title>"COLOQUE O SEU TITULO AQUI"</title>
</head>

                                              <!-- AQUI QUE FICA O ENDEREÇO DA FIGURA (ESSE É O FUNDO O SITE) -->
<body background="http://sr.kremer.vila.bol.com.br/gorillaz_02.gif">
<table width="669" border="0" cellspacing="0" cellpadding="0" height="0">
   
           <!--  AQUI FICA O ENDEREÇO DA FIGURA PRINCIPAL -->
  <img src="http://sr.kremer.vila.bol.com.br/gorillaz_01.gif"></table>

<!--              INICIO DO SEU PERFIL                    -->
<div id="Layer1" style="position:absolute; left:20px; top:567px; width:161px; height:68px; z-index:1"> 
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr> 
      <td valign="top"> <p align="left"><b><font color="#FFFFFF" size="2"> Perfil</font></b><br>
          <br>
          <b>Nome</b>: Seu Nome<br>
          <b>Idade</b>: Sua Idade<br>
          <b> Icq</b>: Seu Icq<b> <br>
          Email</b>: Seu Email<br>
          <strong>Signo</strong>: Seu Signo<br>
          <b>Coisas que adoro</b>: "Coisas que você adora fazer"<br>
          <b> Coisas que odeio</b>: "Coisas que você odeia"<br>
        <p></p>
        <p> <font color="#FFFFFF"><b><font size="2">Blogs Amigos</font></b></font><br>
          <br>
          <a href="http://www.so_templates.blig.com.br" target="_blank">Blog do 
          So_Templates </a><br>
        </p>
        <p> <b><font color="#FFFFFF" size="2">Links</font></b><br>
          <br>
          <a href="http://www.so_templates.blig.com.br" target="_blank"> So_Templates</a><br>
          <a href="http://www.blig.com.br">Blig</a></p>
        <p> <b><font color="#FFFFFF" size="2">Arquivo</font></b><br>
          <br>
                                   <!--FIM  DO SEU PERFIL -->
       
    
     </p>
        <br> <p align="center">Template by<br>
          So_Templates</p></td>
    </tr>
  </table>
</div>
<div id="Layer2" style="position:absolute; left:252px; top:610px; width:488px; height:46px; z-index:2"> <div align="center"> 

        </p>

        <br>
        <p align="center">


                  <!--INICIO -  CODIGO DA HOSPEDAGEM -->







                 <!-- COLOQUE O CODIGO DA HOSPEDAGEM AQUI -->
                           
        






                           <!--FIM -  CODIGO DA HOSPEDAGEM-->
         

 


            

</body>
</html>


ai ta o codigo certo... agora vou explica as partes mais importantes...

tem uma parte que não é aconselhavel mudar pra quem esta aprendendo agora...

no comeco aonde ta escrito "COLOQUE AQUI SEU TITULO" é aonde você vai colocar o titulo é claro, é dentro da tags <title> </title>

depois vem aonde fika o endereço das imagens, pra vc poder colocar o fundo e a imagem principal, ela precisa estar na internet...

depois vem o PERFIL... ai todos sabem né... coloca o nome...

ai vem a parte importante de um blog... o codigo que mandara as mensagens para o template... cada lugar q vc coloca o seu blog tem um... eles nunca são iguais... existem o blogger, blig, uol, weblogger... no codigo la em cima tem uma parte q ta escrito "COLOQUE O CODIGO DA HOSPEDAGEM AQUI" então la que vc vai colocar o codigo de qual vc vai usar...
aqui vou colocar os codigos do blogger, blig e do weblogger certo

BLOGGER
<!--INICIO -  tags do Blogger -->
        <blogger> 
                
              <p class="mensagem"><small><b><$BlogItemDateTime$><
/font></b></small><br><br>
                <font size="1"><$BlogItemBody$></font><br><br>
                <small>Enviado por <b><$BlogItemAuthorNickname$></b></small></font>
</p>
              </blogger> <br>
<br>
                <div align="center"><br>
    <br>
    <br>
    *Template Exclusivo do So_Templates</div>
</div>
  <tr>
    <td>

        <!--FIM -  tags do Blogger --></p>
        </a></td>
    </tr>
  </table>
</div>
<div id="Layer2" style="position:absolute; left:252px; top:610px; width:488px; height:46px; z-index:2"> 
  <div align="center">


Blig

<!--INICIO -  tags do Blogger -->
<p class="mensagem" align="justify">[#LISTAGEM#]</p>  <br>
<br>
                <p> </p>
                <p><div align="center">*Template exclusivo do So_Template</font> </div></p>
              </div>

        <!--FIM -  tags do Blogger -->


Weblogger

<!--INICIO -  tags do Blogger -->
<weblogger> 
                 <font size="1">
         <weblogcabecalhodata> 
    </font> 
        <tr align="left"> 
          <td width="520">
            <p align="center">
            <#weblogDataCabecalho#>
            <br>
            <br>
            </p>
          </td>
        </tr>
        </weblogcabecalhodata> 
        <tr> 
          <td width="520"> 
            <p align="justify"><#weblogMensagem#></p>
            <p align="left">
            :: Enviado por
 <a href="mailto:<#weblogEmail#>">
            <#weblogApelido#>
            </a>
            - <#weblogHora#> ::<br>
            <a href="javascript:wb_comentario(<#weblogcodigo#>)">
            <#weblogTotalComentarios#> 
              comentários.</a>
            <br>
            </p>
          </td>
        </tr>
      </table>
    <p align="left">
      </weblogger> <br>
<br>
                <p> </p>
                <p>*Template exclusivo do So_Templates</font> </div></p>
              </div>

        <!--FIM -  tags do Blogger -->


Pessoal se alguns desses ter problema é pq eu nao testei certo... so testei o codigo do blogger... ele ta funcionando

O Template ta pronto... espero ter ensinado... aqueles que tiverem alguma dúvida é só mandar um email para mim joao.jpmelo.pedro@gmail.com

eu fiz alguns outros templates... mais eu ainda tenho q arrumar os codigos dele... mais se vcs quiserem ver ta ai... se alguem quiser usar alguns dos templates q esta ai é so mandar um email q eu passo o codigo por inteiro... flw?
Deixe seu Comentário:
Sem comentários »

Gerador de nicks

Coloque aqui o Texto que será convertido

 1ª Opção = ค łεтяค ƒ¡cคяá ครร¡м
 2ª Opção = α ℓєτrα ƒicαrá αssiм
 3ª Opção = Д Ł€†ЯД ƒٱ¢ДЯá Дککٱм
 4ª Opção = α ℓ૯Ƭ૨α Բ¡૮α૨á αઽઽ¡ʍ
 5ª Opção =д ĿΞtЯд ƒicдЯá дŞŞim
 6ª Opção = A ∟єTяA ₣iςAяá ASSiм
 7ª Opção = ล ℓэ†яล ƒเ¢ลяá ลรรเм
Resultado para as opções de 1 a 7:

 8ª Opção = ⓐ ⓛⓔ〶ⓡⓐ ⓕⓘⓒⓐⓡá ⓐⓢⓢⓘⓜ
 9ª Opção = Δ Ł€ŦŘΔ ₣ƗĆΔŘá ΔŞŞƗΜ
 10ª Opção = ā ŁēƭƦā ƒƗƈāƦá āƨƨƗⓜ
 11ª Opção = ą ℓεтяą Ք¡cąяá ąรร¡ണ
 12ª Opção = ą ℓeイяą Բiĉąяá ąรรiм
 13ª Opção = α łєтяα ƒıcαяá αssıм
 14ª Opção =ą ΐɛ†ʀą Բɪɔąʀá ąʂʂɪʍ
Resultado para as opções de 8 a 14:

Deixe seu Comentário:
Sem comentários »
Categorias: