Customizando o layout do plone 
Nesse artigo vamos aprender como modificar a "cara" do Plone, fazendo algumas customizações em sua aparência, cor e layout.
[ Hits: 59.470  ]
Por: Fabio Rizzo Matos em 05/01/2005   | Blog: http://www.vindula.com.br 
 
 
 
Colocando Bordas no site Plone 
 
 
 
Para adicionar um borda a um site Plone , novamente recorremos ao CSS, vamos acessar novamente o arquivo ploneCustom.css  e adicionar as
linhas abaixo:
 
/* Coloca as bordas no site */  
#portal-top { 
    background: #FFFFCC; 
    border-top: 2px dotted black; /* Borda em cima */  
    border-right: 2px dotted black; /* Borda a direita */  
    border-left: 2px dotted black; /* Borda a esquerda*/  
} 
 
 
#portal-columns { 
    border-right: 2px dotted black; /* Borda a direita */  
    border-bottom: 2px dotted black; /* Borda em baixo */  
    border-left: 2px dotted black; /* Borda a esquerda*/  
}
 
Como no exemplo anterior, colocamos  no CSS:
 
#portal-top { background: #FFFFCC; }
 
Vamos substituí-lo pelo acima. Salve e veja o resultado:
 
 
Depois de todas essas modificações, o nosso ploneCustom.css 
deverá estar dessa forma:
 
/* Centraliza o Site no Meio da Página */  
#visual-portal-wrapper { 
    margin: 2em auto 0 auto; 
    width: 760px; 
} 
 
 
/* Coloca as bordas no site */  
#portal-top { 
    background: #FFFFCC; 
    border-top: 2px dotted black; /* Borda em cima */  
    border-right: 2px dotted black; /* Borda a direita */  
    border-left: 2px dotted black; /* Borda a esquerda*/  
} 
 
 
#portal-columns { 
    border-right: 2px dotted black; /* Borda a direita */  
    border-bottom: 2px dotted black; /* Borda em baixo */   
    border-left: 2px dotted black; /* Borda a esquerda*/  
}
 
 
  Página anterior        Próxima página 
Páginas do artigo
   1. 
Introdução 
   2. 
Resolução 
   3. 
Mudando as cores do site 
   4. 
Colocando um background no Cabeçalho do Plone 
   5. Colocando Bordas no site Plone
   6. 
Mudando o Logo do Plone 
   7. 
Conclusão 
Outros artigos deste autor
   Utilizando as bibliotecas do Java usando o Jython
   ZPT - Zope Pages Templates
   Instalando o MySQL no Zope/Plone e criando uma pequena aplicação
   Gerenciando registros em banco de dados com Zope
   Introdução ao Jython
Leitura recomendada
   Python, o curso (parte 1)
   Solução de Intranet Vindula 1.1 - Instalação no Ubuntu 10.04 LTS
   Instalação Plone 2.5.5 com módulos customizados 
   ZPT - Zope Pages Templates
   Python - Brincando com arquivos
 
  
 
Comentários
	
		
		 
		Tem jeito de trabalhar com o plone usando o apache e não o zope?
	
	
	
	
	
	
	
 
	
		
		 
		Olá cvs, na verdade não. O plone é uma espécie de "módulo" para o zope, que adiciona algumas belas funcionalidades à sua ZMI.  
 
A dupla se encaixou tão perfeitamente que hoje em dia muitos tratam a tecnologia como Zope/Plone e não somente Zope ou Plone.  
 
[]'s
	
	
	
	
	
	
	
		
			
				
				
					 
					 
					
					
						
							Mensagem 
							Olá cvs, na verdade não. O plone é uma espécie de "módulo" para o zope, que adiciona algumas belas funcionalidades à sua ZMI. 
A dupla se encaixou tão perfeitamente que hoje em dia muitos tratam a tecnologia como Zope/Plone e não somente Zope ou Plone. 
[]'s 
						 
					
	
					 
				 
			 	
			
		 
	 
	 
	
 
	
		
		
		OPa!,
Amigo só me confirma uma coisa... Ele monta todo o layout em "layout CSS" mais conhecido como tableless ?. Pow vi seu site 
http://www.fabiorizzo.com/ 
e o mesmo se encontra pelo que entendo em layout CSS certo?.
no aguardo...
--
Abs,
guinet gmail com
	
 
	
	
	
	
	
	
		
			
				
				
					 
					 
					
					
						
							Mensagem 
							OPa!,
Amigo só me confirma uma coisa... Ele monta todo o layout em "layout CSS" mais conhecido como tableless ?. Pow vi seu site http://www.fabiorizzo.com/
e o mesmo se encontra pelo que entendo em layout CSS certo?.
no aguardo...
--
Abs,
guinet gmail com
 
						 
					
	
					 
				 
			 	
			
		 
	 
	 
	
 
	
		
		
		As vezes ele dá impressão de ser tableless, mais não é não! ele ainda está trabalhando em tables.
Porém, o plone contém uma skin para trabalhar tableless.
até mais
Fabio Rizzo
fabio@fabiorizzo.com
www.fabiorizzo.com 
	 
	
	
	
	
	
	
		
			
				
				
					 
					 
					
					
						
							Mensagem 
							As vezes ele dá impressão de ser tableless, mais não é não! ele ainda está trabalhando em tables.
Porém, o plone contém uma skin para trabalhar tableless.
até mais
Fabio Rizzo
fabio@fabiorizzo.com
www.fabiorizzo.com 
						 
					
	
					 
				 
			 	
			
		 
	 
	 
	
 
	
		
		 
		Oi, 
Eu gostaria de saber onde tah o arquivo que redimensiona a parte de cima e as laterais? 
 
Obrigado
	
	
	
	
	
	
	
		
			
				
				
					 
					 
					
					
						
							Mensagem 
							Oi,
Eu gostaria de saber onde tah o arquivo que redimensiona a parte de cima e as laterais?
Obrigado 
						 
					
	
					 
				 
			 	
			
		 
	 
	 
	
 
	
		
		 
		Eu instalei o PLONE, mas quando eu vou traduzir o plone para o portugues-br, não consigo. 
Isso é feito dentro do ambiente do PLONE? Exite uma explicação do Jean, logo abaixo, 
mas não entendi. 
---------------------------------------------------------------------------------------------------- 
Com Localizer+TranslationService: 
 
1)Download do Localizer e do TranslationService 
2)Instalá-los no lib/python/Products e reboot zope 
3)Na raiz do Plone, instanciar o TranslationService (padrão) e o 
Localizer (padrão), com linguagem pt-BR 
4)Dentro de Localizer, criar um MessageCatalog com nome PythonBR, usando 
pt-BR 
5)Dentro de PythonBR, na aba Import, se não me engano, importar o 
arquivo que acompanha o Plone em i18n/Plone-pt-BR.po 
6)No TranslationService, usar como padrão o path Localizer/PythonBR 
7)Grite ;-) 
 
Com PlacelessTranslationService: 
 
1)Download PlacelessTranslationService 
2)Instalá-lo no lib/python/Products e reboot zope 
3)Compilar todas as mensagens na pasta i18n com o comando "msgfmt -v -o 
produto-sigla.mo produto_sigla.po", gerando os arquivos .mo que o 
Placeless lê 
4)Mova a pasta i18n para lib/python/Products/SeuProduto 
5)Reboot Zope 
7)Grite ;-) 
 
Descupe se esqueci alguma coisa, estou correndo...! ;-) 
 
[]'s Jean. 
	
	
	
	
	
	
	
		
			
				
				
					 
					 
					
					
						
							Mensagem 
							Eu instalei o PLONE, mas quando eu vou traduzir o plone para o portugues-br, não consigo.
Isso é feito dentro do ambiente do PLONE? Exite uma explicação do Jean, logo abaixo,
mas não entendi.
----------------------------------------------------------------------------------------------------
Com Localizer+TranslationService:
1)Download do Localizer e do TranslationService
2)Instalá-los no lib/python/Products e reboot zope
3)Na raiz do Plone, instanciar o TranslationService (padrão) e o
Localizer (padrão), com linguagem pt-BR
4)Dentro de Localizer, criar um MessageCatalog com nome PythonBR, usando
pt-BR
5)Dentro de PythonBR, na aba Import, se não me engano, importar o
arquivo que acompanha o Plone em i18n/Plone-pt-BR.po
6)No TranslationService, usar como padrão o path Localizer/PythonBR
7)Grite ;-)
Com PlacelessTranslationService:
1)Download PlacelessTranslationService
2)Instalá-lo no lib/python/Products e reboot zope
3)Compilar todas as mensagens na pasta i18n com o comando "msgfmt -v -o
produto-sigla.mo produto_sigla.po", gerando os arquivos .mo que o
Placeless lê
4)Mova a pasta i18n para lib/python/Products/SeuProduto
5)Reboot Zope
7)Grite ;-)
Descupe se esqueci alguma coisa, estou correndo...! ;-)
[]'s Jean.
 
						 
					
	
					 
				 
			 	
			
		 
	 
	 
	
 
	
		
		 
		não deu certo aqui  
 
* <dtml-with base_properties> (do not remove this :) */ 
/* <dtml-call "REQUEST.set('portal_url', portal_url())"> (not this either :) */ 
 
 
/************ IMAGENS DAS NOTICIAS **************/ 
.newsImageContainer { 
float:center; 
margin: 0 1em 0.5em 0; 
width: 202px; 
} 
.newsImageContainer .discreet { 
   margin: 0em 0em 0em 0em; 
} 
.newsImageContainer { 
float:center; 
margin: 0 1em 0.5em 0; 
width: 202px; 
} 
 
/*Centraliza o Site no Meio da Página */ 
 
#visual-portal-wrapper 
{ 
   margin: 2em auto 0 auto; 
   width: 720px; 
} 
 
 
/* </dtml-with> */ 
 
 
 
/********** FIM DA IMAGENS NOTICIAS ***********/ 
 
	
	
	
	
	
	
	
		
			
				
				
					 
					 
					
					
						
							Mensagem 
							não deu certo aqui 
* <dtml-with base_properties> (do not remove this :) */
/* <dtml-call "REQUEST.set('portal_url', portal_url())"> (not this either :) */
/************ IMAGENS DAS NOTICIAS **************/
.newsImageContainer {
float:center;
margin: 0 1em 0.5em 0;
width: 202px;
}
.newsImageContainer .discreet {
   margin: 0em 0em 0em 0em;
}
.newsImageContainer {
float:center;
margin: 0 1em 0.5em 0;
width: 202px;
}
/*Centraliza o Site no Meio da Página */
#visual-portal-wrapper
{
   margin: 2em auto 0 auto;
   width: 720px;
}
/* </dtml-with> */
/********** FIM DA IMAGENS NOTICIAS ***********/
 
						 
					
	
					 
				 
			 	
			
		 
	 
	 
	
 
 
 
Contribuir com comentário 
 
Enviar