Cambios a mi estilo

El tema que mas me gusta es este http://wordpress.org/extend/themes/tree-house, pero esta en Wordpress y no se puede poner en Joomla, he colocado las hierbas inferiores pero me aparece muchas distancia entre medias y me gustaria saber como eliminar esa distancia.

Ademas, quiero incluir en mi tema, el pergamino que aparece para el contenido en mi tema de Joomla como fondo del texto; esto seria facil sino hubiera que poner una imagen antes del pergamino (para marcar el comienzo del mismo), y otra al final del pergamino (que visualmente lo cierre).

¿Alguien sabe como conseguir esto?

Mi web en joomla es esta http://www.eluniversodelperro.com/prueba/

Muchas gracias y un saludo.
Lo de las hierbas esas ya lo has preguntado en otro tema, o me lo parece? Por favor no crees varios temas con lo mismo ni un tema con varias preguntas.

En cuanto a lo del pergamino, dices que son 2 imágenes (una para el comienzo y otra para el final) y supongo que otra más que se repite verticalmente, no? Pues se haría así:

En el css:
.pergamino-top {background-image: url(imagenes/pergamino-top.jpg)}
.pergamino-medio {background-image: url(imagenes/pergamino-medio.jpg); background-repeat:repeat-y;}
.pergamino-bottom {background-image: url(imagenes/pergamino-bottom.jpg)}

Y en el html:
<div class="pergamino-top"></div>
<div class="pergamino-medio>
todo tu contenido
</div>
<div class="pergamino-bottom"></div>

Si no te funciona avísame, saludos
Perdon si parte de lo que pedia ya lo preguntaba por otro lado, habia copiado el contenido de un tema que cree en otro foro y se olvido quitar eso, ahora probare lo de los pergaminos y te cuento.

Muchas gracias.
Por cierto, se me olvidaba, lo del pergamino tiene un problema y es que no termino de encontrar en el .css (template) de mi estilo (http://www.eluniversodelperro.com/prueba/ la parte de codigo que hace referencia al fondo del contenido, es decir, el pergamino quiero que aparezca para el contenido que publiques, y no lo encuentra.
El trozo codigo HTML que nos interesa de todas las paginas es este:

<div class="art-post-inner">
<div class="art-postcontent">
    

<div class="pergamino-top"></div>
<div class="pergamino-medio> 


<jdoc:include type="message" />



</div>
<div class="pergamino-bottom"></div>




    
</div>

Como ves, antes del jdoc he puesto el pergamino superior, y despues el inferior, per no dunciona.

Si quieres puedes entrar en la web: http://www.eluniversodelperro.com/prueba/, ver el codigo fuente y veras que todo el contenido esta despues de esa capa, asi que creo que ese es el lugar correcto, sin embargo, no se obtiene el resultado que quiero.

¿Alguna idea?

Muchas gracias y un saludo.
En esa página de prueba busqué en el código la palabra "pergamino" y no me aparece nada. Te habrás confundido de dirección?

De todas formas creo que te lo he dicho mal y ya encontré cómo se haría correctamente.
Es que pasa una cosa un poco rara, te paso el codigo por privado para que veas que esta, y tu diras donde hay que ponerlo para que funcione.

Un saludo
Mira, encontré esta página: http://www.redmelon.net/tstme/4corners/

Explica una técnica para hacer bordes redondeados usando 4 imágenes, una para cada esquina. Lo tuyo es algo muy parecido, así que debería funcionar así:

CSS:

.pergamino {background-image: url(imagenes/pergamino.jpg); background-repeat:repeat-y;}
.pergamino-top {background-image: url(imagenes/pergamino-top.jpg); width:loquesea;height:loquesea;overflow:hidden}
.pergamino-contenido {aquí pones los estilos del texto a tu gusto}
.pergamino-bottom {background-image: url(imagenes/pergamino-bottom.jpg);width:loquesea;height:loquesea;overflow:hidden}
HTML:

<div class="pergamino">
<div class="pergamino-top"></div>
<div class="pergamino-contenido">
tu contenido aquí
</div>
<div class="pergamino-bottom"></div>
</div>

En el css puse un overflow hidden, si no me equivoco es necesario, además puse para que especifiques el ancho y alto de las imágenes.

P.D: Creo recordar que había que poner algo <div class="pergamino-top">aquí</div>, era algo de ;bsp o algo así, haber si lo encuentro.

Saludos, ojalá te vaya ahora.
Lo acabo de probar poniendolo como contenido limpio y funciona, puedes entrar a la web y probarlo.

La cosa es que me gustaria que se ajustara hasta la derecha del todo de la capa en la que esta, no se si me explico, que todo lo blanco de la derecha lo ocupe el pergamino.

Tambien hay que tener en cuenta, que si pongo esas capas antes de

<jdoc:include type="message" />

y despues para que el contenido del texto me aparezca dentro del pergamino, no funciona porque ni siqueira me escribe esos divs.

¿Alguna solucion?

PD: En el CSS, en la capa, pergamino-top le he puestowidth: 100% para comprobar que me estirara la imagen pero no.
http://www.eluniversodelperro.com/prueba/ , así es como lo tienes ahora, no?

Por lo que veo la imagen del top es mucho más grande de lo que pensaba, yo creía que lo tenían hecho de otra forma, la imagen top y bottom de poco alto y la del medio pequeña que se repitiese.

Lo que tienes que hacer es mirar cómo lo tiene montado el que creó el theme y ponerlo igual porque de la forma que yo te dije no te irá, je je, yo pensaba que lo tenía montado de otra manera, como ya te dije.

Para verlo todo mejor, te recomiendo que te descargues el template de wordpress y mires su css y el html resultante del preview de la página de wordpress aunque supongo que ya lo tendrás descargado.

Saludos
Efectivamente ya lo tenia descargado, estoy mirando sus css y ahora te digo

El tema, lo puedes previsualizar aqui: http://wordpress.org/extend/themes/tree-house

Esto es lo referente a la hoja de estilos:

/************** Inner Content *********************/

.main_left{
	width:640px;
	float:left;
	background:#ece3c5;
	background:url(images/content_top.png) no-repeat left top;
	z-index:0;
}
.content_bg
{
	background:url(images/content_bg.png) repeat-y left top;
	padding:0px 20px;
}
.content_top
{
	background:url(images/content_top.png) no-repeat left top;
	padding-top:25px;
}
.content_bottom
{
	background:url(images/content_bottom.png) no-repeat left bottom;
	height:61px;
}

En header.php se hace referencia a parte de esos divs, y en index.php a otros.

Para que te aclares mejor, este es el contenido de header.php



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title>
<?php if (is_home()) { ?>
<?php bloginfo('description'); ?>
: 
<?php bloginfo('name'); ?><?php }  ?>
<?php if (is_page()) { ?>
<?php wp_title(' '); ?>
<?php if(wp_title(' ', false)) { echo ' : '; } ?>
<?php bloginfo('name'); ?><?php }  ?>
<?php if (is_404()) { ?>
Page not found : <?php bloginfo('name'); ?>
<?php }  ?>
<?php if (is_archive()) { ?>
<?php wp_title(' '); ?>
<?php if(wp_title(' ', false)) { echo ' : '; } ?>
<?php bloginfo('name'); ?>
<?php }  ?>
<?php if(is_search()) { ?>
<?php echo wp_specialchars($s, 1); ?>
: 
<?php bloginfo('name'); ?>
<?php } else if (is_single()){ ?>
<?php { wp_title(' ');if(wp_title(' ', false)) { echo ' : '; }single_cat_title();echo " : "; bloginfo('name');} ?>
<?php } ?>
</title>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> 

<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/dhtml.js"></script>
<!--[if IE 6]>
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/DD_belatedPNG.js"></script>
<script>

  /* EXAMPLE */

  DD_belatedPNG.fix('div,img,ul,li');

  /* string argument can be any CSS selector */

  /* .png_bg example is unnecessary */

  /* change it to what suits you! */

</script>
<![endif]-->

<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>

<?php wp_head(); ?>
</head>
<body>
<div class="main_outer">
<div class="main_green">
<div id="main">
	<a name="top"></a>
	<div class="header">
    	<div class="header_top">
            <div class="header_left">
                <div class="title">
                    <h1>[url="<?php bloginfo('url'); ?>"]<?php bloginfo('title'); ?>[/url]</h1>
                    <h3><?php bloginfo('description'); ?></h3>
                </div>
            </div>
            <div class="header_right">
            	<div class="header_search">
                	<form action="<?php bloginfo('url'); ?>" method="get">
                        <input class="search_text" type="text" name="s" value="" onfocus="this.value=(this.value=='') ? '' : this.value;" onblur="this.value=(this.value=='') ? '' : this.value;" />
                        <input class="search_btn" type="submit" value="Go" />
                        <div style="clear:both"></div>
                     </form>
            	</div>
                <div style="clear:both;"></div>
            	

Hey there! Thanks for dropping by Theme Preview! Take a look around
and grab the [url="<?php bloginfo('rss2_url'); ?>"]RSS feed[/url] to stay updated. See you around!</p>
            </div>
            <div style="clear:both;"></div>
      	</div>
        
        <div class="nav">
            <ul id="nav">
                [*][url="<?php bloginfo('url'); ?>"]Home[/url]
                <?php wp_list_pages('title_li='); ?>
            [/list]
            <div style="clear:both;"></div>
        </div>
        <div class="nav_bottom"></div>
	</div>
    
    <div class="main_content">
        <div class="main_left">
        	<div class="content_top">
            	<div class="content_bg">

Y este es el contenido de idnex.php

<?php get_header(); ?>


<?php
if (have_posts()) : ?>

		<div class="navigation">
            <div class="alignleft"><?php next_posts_link('&laquo; Older Entries') ?></div>
            <div class="alignright"><?php previous_posts_link('Newer Entries &raquo;') ?></div>
            <div style="clear:both;"></div>
        </div>

<?php	while (have_posts()) : the_post();
	
?>
		
		<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
		
		
		
			<div class="story">
            	<div class="story_title">
                	<div class="title_bg">
                    	<div class="title_top">
                        	<div class="title_bottom">
								<h2>[url="<?php the_permalink(); ?>"]<?php the_title(); ?>[/url]</h2>
                                <div class="story_category">[img]<?php bloginfo('stylesheet_directory'); ?>/images/cat_bullet.gif[/img] Filed Under : <?php the_category(',') ?> by <?php the_author(); ?></div>
                                <div class="story_date">[img]<?php bloginfo('stylesheet_directory'); ?>/images/date_bullet.gif[/img] <?php the_date('M.j,Y'); ?></div>
                                <div style="clear:both;"></div>
                          	</div>
                    	</div>
                   	</div>
               	</div>
				
				<div class="storyContent">
					<?php the_content('Read More...'); ?>
					<div style="clear:both;"></div>
				</div>
                <div class="postmeta">
                    <p class="story_tags"><?php the_tags('[img]'.get_bloginfo([/img] Tags : ', ', ', '
'); ?></p>
                    <p class="read_more">[img]<?php bloginfo('stylesheet_directory'); ?>/images/bullet2.gif[/img] [url="<?php the_permalink(); ?>"]Read more...[/url]</p>
                    <div style="clear:both;"></div>
                </div>
                
			</div>
			
		
		
		</div>
        
	<?php endwhile; ?>
    
    <div class="navigation">
        <div class="alignleft"><?php next_posts_link('&laquo; Older Entries') ?></div>
        <div class="alignright"><?php previous_posts_link('Newer Entries &raquo;') ?></div>
        <div style="clear:both;"></div>
    </div>
   
<?php else: ?>

	<h2 class="error"><?php _e('Not Found.'); ?></h2>
	<p class="error">Sorry, but you are looking for something that isn't here.</p>
    <?php //get_search_form(); ?>
    
<?php endif; ?>

	

		</div>
    </div>
    <div class="content_bottom"></div>
</div>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

Simplemente busca en todo el texto donde estan las capas, y ya me explicas un poco que tendriamos que cambiar para conseguirlo.

Muhcas gracias y un saludo
Creo que solo hay que modificar el header.php porque en el index.php únicamente se cita la parte que muestra lo de "Entradas antiguas" al final y al principio llama al archivo header con get_header (supongo).

Hablo de suposiciones porque al no hacer yo mismo el código tampoco sé qué hace exactamente cada cosa.

Haber, en el header.php aparece:

<div class="main_content">
        <div class="main_left">
           <div class="content_top">
               <div class="content_bg"> 

Una vez pone eso ya el archivo no continúa, no? Pues se supone que en algún sitio del index.php cierra todos esos divs, porque no pueden quedar así abiertos.
Yo miré el index.php y parece que al final cierra esos divs, mira:

      </div>
    </div>
    <div class="content_bottom"></div>
</div>

<?php get_sidebar(); ?>

<?php get_footer(); ?> 

Pero tampoco lo tengo muy claro porque arriba abre 4 divs y abajo cierra 3 y abre y cierra otro más (la capa que muestra el final del pergamino).

No lo tengo nada claro :roll:
He estado de vacaciones y no he podido mirarlo hasta ahora.

Resulta que el codigo que te puse es el del tema que me gusta de wordpres, que tiene un header.php y un index.php, pero en mi tema de Joomla! solo tengo index.php, entonces no se muy bien como hacerlo.

Si introduzco directamente los divs y los cierro al final o como.

Muchas gracias y un saludo