Joomla! Discussion Forums



It is currently Thu Nov 26, 2009 7:38 am (All times are UTC )

 





Post new topic Reply to topic  [ 2 posts ] 
Author Message
Posted: Sat Oct 06, 2007 6:43 pm 
Todos os usuários Joomla sabe que os artigos exibidos, ficam um embaixo do outro, exceto quando o usuário prefere exibir a página principal em 2 ou 3 colunas (não me refiro ao layout do template em 2 ou 3 colunas, mas sim, apenas na "main page")...

Por um tempo, andei pesquisando, perguntando em comunidades no orkut, em como colocar os artigos em "box". Depois de tanto "fuçar", acabei conseguindo fazer isto, um exemplo, você pode ver no Joomla BR: http://www.joomlabr.net

Nomalmente nos templates, até fazem o "box" na mainpage, mas os artigos acabam ficando agrupados, um abaixo do outro, separados apenas pelo Título.

Vamos lá... você também pode fazer, aconselho fazer uma cópia da pasta com_content, caso ocorra algum erro, ou você não tenha gostado do resultado final.

Vamos "hackear" apenas o arquivo "content.html.php", por que é nele que se encontram os scripts de exibição dos artigos.... Este arquivo se encontra na pasta /components/com_content

Abra o content.html.php em um editor php, na linha 433 é onde inicia o script para a exibição do ítem de conteúdo: * Show a content item. E logo mais abaixo, na linha 463 é que inicia os scripts de exibição de toda a configuração do ítem de conteúdo: displays Item Title -  displays PDF Icon... e assim por diante...

Perceba que linha 462 está vazia, assim, aperte "Enter" para abrir espaço para ser adicionadas as seguintes linhas:

462
463          ?>
464
467
468       

469       .
.
.
.
.
548

549


## Estas linhas (463 a 469) vão "chamar" o arquivo CSS do template "template_css.css", e é onde você vai adicionar os códigos CSS para fazer o "box", e também poderá ser colocado em arquivo CSS de qualquer template. A linha 548 coloquei como referencia, você cria a linha 549 fechando o

Será preciso criar um nome para a (ID ou CLASS) CSS, por exemplo: contentbox

Este é o código css que é adicionado no arquivo template_css.css para fazer o "box" no item de conteúdo:

.contentbox {
margin: 0 5px 0px 5px;
padding: 0 5px 10px 5px;
background: #fff;
border: thin solid #3083B8;
width: auto !important;
width: 100%;
}

### Neste exemplo, utilizei a cor da borda conforme a que já está no template, servindo apenas como referencia.

Só isto.. é só salvar os arquivos e utilizar...

Obs: Se não tiver estes códigos adicionados no arquivo CSS do template, não tem problema, os ítem de conteúdo serão exibidos normalmente, apenas sem o "box"

### Para se criar "box" rounded corner, aí já é outra técnica, será preciso criar as imagens, adicionar as linhas no CSS e adicionar as tags


Note que a navegação pelos ítens de conteúdo, fica por fora do "box"...

Espero que este pequeno tutorial, sirva para alguém...


Last edited by djfeliz on Sat Oct 06, 2007 7:13 pm, edited 1 time in total.

Top
   
 
Posted: Fri Nov 16, 2007 9:10 pm 
User avatar
Joomla! Ace
Joomla! Ace
Offline

Joined: Sat Jul 15, 2006 1:41 am
Posts: 1705
Location: Porto Alegre - RS - Brazil
Humm... bom resultado! Demorei um pouco, mas vi agora e adicionei ao FAQ. Quando fizer mais algum desses pode me dar um toque que eu acrescento lá =]

Olha, quando eu vi isso no seu navegador, pensei que teria feito usando fieldset, que só muda um pouco a aparência de navegador para navegador. Agora estou usando o FF 2.0.08 no ubuntu e aparem com os cantos mai quadrados, mas no IE creio que vão aparecer exatamente como você fez com imagens.

Tem um post que ensina como colocar estilo no elemento fieldset com CSS.

Conforme o que o programador quer fazer, talvez prefira usar algo como

Code:
<fieldset id=”estilodocss”><legend>TITULO DO POST</legend>

conteudo do post

</fieldset>


A diferença nesse caso seria que o título ocuparia parte do topo da 'div' ou 'tabela' e que haveria um pouco menos de código fonte para fazer a mesma coisa.

//adicionado

Vi agora que no IE, e praticamente somente nele, conforme o FieldSet que for colocado, vai dar problema. É uma questão de dar uma testada antes e tenrar evitar erros que a miscrosoft cometeu ¬¬

_________________
Emerson da Rocha Luiz - Moderador do Fórum
http://twitter.com/fititnt
FÓRUM PT: FAQ Joomla: #144443 | Regras: #3603
Blog para desenvolvedores Joomla!: http://www.fititnt.org


Last edited by fititnt on Fri Nov 16, 2007 9:16 pm, edited 1 time in total.

Top
  E-mail  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 2 posts ] 

Quick reply

 



Who is online

Users browsing this forum: No registered users and 2 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Jump to:  
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group