TABLE NA ÁREA DE POSTAGEM

*TABLES NA ÁREA DE POSTAGEM PARA SERVIDORES DA UOL*

» Muita gente tem dúvida em como colocar tables na área de postagem!
» Pensando novamente em ajudar o próximo, fiz esse tutorial!
» Vou disponibilizar aqui o código da table! Usei as cores preto (#000000) e o vermelho (#FF0000) para ficarem mais fácil de vocês entenderem, OK?
» Estão todos prontos? Mãos a Obra!
» Ninguém está autorizado(a) à copiar o conteúdo da página e disponibizar no seu Blog !
» Adoraria receber os créditos pela ajuda ^^

(1º) Para você se localizar melhor, o primeiro passo é procurar dentro do seu HTML o código da barrinha de rolagem! Seria mais ou menos assim: PS: O código fica quase lá no início do seu HTML, OK?

(2º) Acharam? Agora você vai copiar esse código da caixinha abaixo e colar abaixo do código da barrinha de rolagem! PS: Modifique as cores conforme preferir ^^

.tabela1 {color: #000000;
border-top: 1px dashed #000000;
border-bottom: 3px double #000000;
background-color: #FFFFFF;}

.tabela2 {color: #FF0000;
border-bottom: 1px solid #FF0000;
text-align: right;
background-color: #FFFFFF;}

(3º) Vai ficar assim:

body {scrollbar-3dlight-color: #000000;
scrollbar-arrow-color: #000000;
scrollbar-base-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-face-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;}

.tabela1 {color: #000000;
border-top: 1px dashed #000000;
border-bottom: 3px double #000000;
background-color: #FFFFFF;}

.tabela2 {color: #FF0000;
border-bottom: 1px solid #FF0000;
text-align: right;
background-color: #FFFFFF;}

(4º) Agora vamos encontrar o local certinho aonde colocar o primeiro código! Quase lá no final do seu código HTML, você vai ter mais ou menos isso: PS: Veja aonde fica a tag da data, ela começa com <script> e finaliza com </script>

<%IF BLOG_ARCHIVE_PAGE%><%WHILE ARCHIVE_LINK%><a href="<%VAR ARCHIVE_LINK%>"><%VAR ARCHIVE_DATE_BEGIN%> a <%VAR ARCHIVE_DATE_END%></a><%ENDWHILE%><BR><BR><a href="index.html">voltar</a><%ELSE%>


<%WHILE POST_TITLE%><script>dataPost = "<%VAR POST_DATE_HEADER%>";if (dataPost != "") {document.write("<tr><td height=20 id=head><a name=<%VAR POST_ID%></a><%VAR POST_DATE_HEADER%></td></tr>");} else {document.write("<tr><td id=head><a name=<%VAR POST_ID%></a><%VAR POST_DATE_HEADER%></td></tr>");}</script><tr>

(5º) Agora que achamos a área da data, vamos incluir o primeiro código nela! Você vai colocar antes do <script> esse código:

(6º) Vai ficar assim:

(7º) E no final do </script>, vamos colocar:

</div>

(8º) Ficando assim:

(9º) Ok! Terminamos a primeira etapa! Agora vamos colocar a segunda table. Vamos procurar a parte da Assinatura e dos comentários! Observe quais são eles:

Postado por: <%VAR POST_USER%> às <%VAR POST_DATE%><BR><BR><%IF BLOG_ACCEPT_COMMENT%>( <a id=b href="javascript:abre('http://navblog.uol.com.br/comment.html?postFileName=<%VAR POST_ID%>&idBlog=<%VAR BLOG_ID%>','356','478','1');"><span id="post<%VAR POST_ID%>"></span></a> )

(10) Observe nessa parte do seu código se à algum <BR> nele! Se encontrar algum, apague, OK? Veja o meu exemplo, estou vendo 2 <BR>!

Postado por: <%VAR POST_USER%> às <%VAR POST_DATE%><BR><BR><%IF BLOG_ACCEPT_COMMENT%>( <a id=b href="javascript:abre('http://navblog.uol.com.br/comment.html?postFileName=<%VAR POST_ID%>&idBlog=<%VAR BLOG_ID%>','356','478','1');"><span id="post<%VAR POST_ID%>"></span></a> )

(11) Apagando os <BR> vai ficar assim:

Postado por: <%VAR POST_USER%> às <%VAR POST_DATE%><%IF BLOG_ACCEPT_COMMENT%>( <a id=b href="javascript:abre('http://navblog.uol.com.br/comment.html?postFileName=<%VAR POST_ID%>&idBlog=<%VAR BLOG_ID%>','356','478','1');"><span id="post<%VAR POST_ID%>"></span></a> )

(12º) Você vai incluir antes do Postado por: esse código:

(13º) Vai ficar assim:

<div class="tabela2">Postado por: <%VAR POST_USER%> às <%VAR POST_DATE%><%IF BLOG_ACCEPT_COMMENT%>( <a id=b href="javascript:abre('http://navblog.uol.com.br/comment.html?postFileName=<%VAR POST_ID%>&idBlog=<%VAR BLOG_ID%>','356','478','1');"><span id="post<%VAR POST_ID%>"></span></a> )

(14º) E no final aonde está </a>), vamos colocar:

</div>

(15º) Ficando assim:

(16º) O que você vai fazer agora é recortar essa tag da assinatura e do comentário e colar abaixo da tag da data que já arrumamos! Então vai ficar assim:

<div class="tabela1"><script>dataPost = "<%VAR POST_DATE_HEADER%>";if (dataPost != "") {document.write("<tr><td height=20 id=head><a name=<%VAR POST_ID%></a><%VAR POST_DATE_HEADER%></td></tr>");} else {document.write("<tr><td id=head><a name=<%VAR POST_ID%></a><%VAR POST_DATE_HEADER%></td></tr>");}</script></div>

<div class="tabela2">Postado por: <%VAR POST_USER%> às <%VAR POST_DATE%><%IF BLOG_ACCEPT_COMMENT%>( <a id=b href="javascript:abre('http://navblog.uol.com.br/comment.html?postFileName=<%VAR POST_ID%>&idBlog=<%VAR BLOG_ID%>','356','478','1');"><span id="post<%VAR POST_ID%>"></span></a> )</div>

(17º) Jamais delete algum tipo de código da sua Lay! É isso Pessoal! Salve, Republique e veja como ficou ^^

Difícil? Gostaram? Estou torcendo que tenham conseguido =D Se tiverem dúvidas, por favor, me perguntem, OK?

Tutorial elaborado exclusivo por TATIANA BERTOLIN. Adoraria receber os devidos créditos pela ajuda :) Obrigada!