Personalizar bloque

Mayo 12, 2008 - 23:58 — c-c-m

Hola a todos,

Estoy creando un theme a medida y me gustaría saber cómo puedo hacer que los bloques que estén insertados en una región tengan un color de fondo, un color de fuente y un color y tamaño de títulos distintos a los definidos para el resto de bloques.

Adjunto el css relevante por si sirve de algo:

.block {
  margin-bottom:1.5em;
  padding:10px;
  background-color:#f3f3f3;
}
div.block-region {
  background-color:#ffffff;
  border: 4px dashed #006699;
  color:#999999;
  font-size:180%;
  text-align:center;
  font-weight:bold;
  margin-bottom:1em;
  margin-top:1em;
}

/*esta es la región donde quiero meter los bloques*/
#caja-azul {
	background-color: #56b2eb;
	background-image: url(img/caja-azul-fnd.png);
	background-repeat:  repeat-x;
	border: 1px solid #47687d;
	padding:4px;
	/*position:relative;
	top:-1px;*/
}

Si me podéis ayudar con el CSS os estaré muy agradecido

Saludos

Después de la instalación.

Inicie sesión o regístrese para enviar comentarios

Mayo 17, 2008 - 13:49 — c-c-m

Muchas gracias por la

Muchas gracias por la explicación tan buena, Luis. Sin embargo tengo problemas con la definición de los CSS.
La región donde estarán los bloques es la region "header" Ya creé un archivo llamado block-header.tpl.php y funciona bien. El problema lo tengo en que no se cómo definir los estilos, pues algunos parámetros como los hipervínculos, o los títulos ya están definidos anteriormente.
¿cómo debería llamar a las clases? Y otra cosa más, que seguro que está relacionado, ¿qué diferencia hay entre esto: #bloque_header y .bloque_header?

Oskar, ahora me leo tus enlaces ¿alguno en particular?

Gracias

Inicie sesión o regístrese para enviar comentarios

Mayo 17, 2008 - 14:03 — c-c-m

Bueno, por ensayo-error he

Bueno, por ensayo-error he solucionado el tema de los estilos. pero agradeceré si alguien tiene tiempo y ganas de explicarme cómo se hacen bien las cosas ;)

Gracias de nuevo a ambos por responder

Inicie sesión o regístrese para enviar comentarios

Mayo 17, 2008 - 18:25 — lelizondob@drup...

será dificil lo que pides

será dificil lo que pides ya que no creo que alguien desee impartirte una lección de como utilizar css en un comentario de un foro.. css es extremadamente sencillo y aún más poderoso sin embargo explicarlo tomaría mucho tiempo.. mejor busca en la red hay cientos de información sobre css, todos tuvimos que aprender de esta manera ya si tieens dudas pregunta...

respecto a la dferencia entre . y # es que . es un class y # es un id o en otras palabras... cuando en html tienes div id="header" en css tienes #header cuando en html tienes div class="header" en css tienes .header

saludos

Luis

Inicie sesión o regístrese para enviar comentarios

Mayo 14, 2008 - 00:44 — lelizondob@drup...

de entrada no tengo idea de

de entrada no tengo idea de lo que haga .block, tendría que ver el archivo block.tpl.php... pero parece que podrías estar sobreescribiendo el color.. en un contenedor más grande pones un color y en un color interno pones un color distinto, el que se va a mostrar es el color distinto..

si entiendo lo que quieres hacer esto te va a ayudar.

normalmente existe un archivo llamado block.tpl.php.. este es el archivo default para todos los bloques.. tendrías algo como lo siguiente:

 <div class="defaultblock">
  <div class="defaultblock_title">
     <h4><?php print $block->subject; ?></h4><!--block title-->
  </div>
    <div class="blockcontent"><?php print $block->content; ?></div>
</div>

como puedes ver se define un class llamado defaultblock y dentro está el título h4 dentro de defaultblock_title y por último está el contenido dentro de blockcontent.

sin embargo si quieres un block personalizado puedes crear un archivo con esto..

por ejemplo.. si tu bloque es generado por una vista tu archivo se llamaría block-views-nombredetuvista.tpl.php si el bloque es el bloque de la región establecido en template.php entonces sería block-nombrederegion.tpl.php.. por región lógicamente estoy hablando de cuando pones por ejemplo

<?php print($news) ?>

en este caso la región se llama news... voy a utilizar este caso para crear un archivo llamado block-news.tpl.php y este archivo lo voy a utilizar para cambiar como se ven todo lo que ponga en la región news.. (esto en admin/build/block)

el archivo block-news.tpl.php tiene dentro:

 <div class="block_news">
 <div class="block_news_title">
    <h4><?php print $block->subject; ?></h4><!--block title-->
 </div>
   <div class="block_news_content"><?php print $block->content; ?></div>
</div>

como podrás ver he cambiado todos los ids y class para crear personalizados y así utilizarlos en mi css.. así que en el css tendría lo siguiente:

.block_news para todo el block
.block_news_title para todos los contenedores del título, no el título..
.block_news_title h4 para el título
.block_news_content para el contenido del bloque

para views es exactametne lo mismo, solo recuerda generar el bloque correspondiente en tu views y crear el archivo del tipo block-views-nombredetuview.tpl.php.. en este caso block-views es obligatorio y por nombredetuview me refiero al nombre que estableces en tu view. puedes crear tantos como desees o necesites..

no sobra decir que el procedimiento para un page es muy parecido por no decir que casi igual o incluos para los nodos.. por ejemplo una página generada por views sería page-views-nombredetuview.tpl.php

espero esto te pueda ayudar

saludos

Luis