Foros del Web » Creando para Internet » CSS »

Editando una plantilla de WordPress

Estas en el tema de Editando una plantilla de WordPress en el foro de CSS en Foros del Web. Hola a todos. Tengo un problema con una plantilla "eShop Elegant Themes" que han actualizado la versión y al instalarla no puedo editar unas modificaciones ...
  #1 (permalink)  
Antiguo 08/06/2011, 13:32
Avatar de tranzorx  
Fecha de Ingreso: marzo-2008
Mensajes: 114
Antigüedad: 9 años, 7 meses
Puntos: 7
Editando una plantilla de WordPress

Hola a todos.
Tengo un problema con una plantilla "eShop Elegant Themes" que han actualizado la versión y al instalarla no puedo editar unas modificaciones de estilos que yo le había hecho a la antigua. El programador ha cambiado la estructura del style.css y ahora no encuentro los datos a editar.
He conseguido agrandar el marco de las miniaturas pero el interior del mismo donde aparece la imagen no puedo agrandarla.
El problema original es que la plantilla tiene las miniaturas apaisadas y por el tipo de producto que hay, necesito que sean en formato vertical.

Podéis ver el defecto en la esta tienda.

Al pulsar sobre la miniatura de la home page también me aparece el problema, ya que he tenido que modificar la relación de aspecto de ambos.
El marco de los productos "big-overlay.png" lo he editado con Photoshop para que me cuadrase.
La primera "height: 321px;" corresponde al valor de la miniatura de la home, el segundo corresponde a la hoja del producto . Resaltados en ROJO.

Muchas gracias por la ayuda.

Un saludo.


/*---[MAIN LAYOUT INFO]----*/

.container { text-align: left; width: 962px; margin: 0 auto; position: relative; }

#header { padding: 25px 0px 0px; background: #ffffff url(images/header-bottom-bg.png) repeat-x bottom left; height: 101px; }
img#logo { float: left; margin: 0px 23px 0px 0px; }
#search-bar { float: right; background: url(images/search-bg.png) no-repeat; width: 162px; height: 31px; margin-top: 21px; margin-right:6px; }
#search-bar #searchinput { background: none; border: none; float: left; margin: 7px 6px 0 0px; width: 112px; padding-left: 10px; font-size: 11px; font-family: Georgia, serif; color: #494949; }
#search-bar #searchsubmit { margin-top: 1px; }

#menu { position: absolute; bottom: -103px; left: 0px; background: url(images/secondary-menu.png) no-repeat; width: 961px; height: 98px; z-index: 10; }

h3#deals-title { font-size: 24px; text-transform: uppercase; color: #5f5e5e; padding-left: 25px; background: url(images/deals-bg.png) no-repeat bottom left; height: 47px; position: absolute; top: -15px; left: 27px; }
h3#deals-title span { background: url(images/deals-bg.png) no-repeat top right; padding: 14px 23px 17px 7px; display: block; }

#content { padding-bottom:20px; }
body#home #content { background: #f3f3f3 url(images/content-bg.png) repeat-x; }
body#home #content .container { padding: 52px 0px 0px; }
#content .container { padding: 60px 0px 0px; }
#scroller { position: relative; float: left; margin-bottom: 40px; }
#scroller a#left-arrow, #scroller a#right-arrow { display:block; width: 23px; height:35px; text-indent:-9999px; margin-top: 79px; float: left; }
#scroller a#left-arrow { background: url(images/left-arrow.png) no-repeat; margin-left:0px; margin-right:1px; }
#scroller a#right-arrow { background: url(images/right-arrow.png) no-repeat; margin-left: 14px; }

#scroller #items { float: left; width: 906px; }

#scroller .block { padding-left: 17px; height: 205px; }

#items .item { background: url(images/item-bottom-bg.png) no-repeat bottom left; padding-bottom: 28px; float: left; width: 208px; position: relative; margin-right: 17px; }
#items .item-top { background: url(images/item-top.png) no-repeat; height: 13px; }
#items .item-content { background: url(images/item-bg.png) repeat-y; min-height: 100px; padding: 7px 20px 2px; }
.item-content h4 { font-size: 16px; padding-bottom: 0px; }
.item-content h4 a:hover { text-decoration: none; }
#items .item a.more { position: absolute; bottom: -7px; left: 70px; }

.product span.tag, #items .item-content span.tag { color: #ede7c2; font-size: 22px; position: absolute; left: -15px; display: block; background: url(images/scroller-item-tag.png) no-repeat bottom right; padding-right: 11px; text-shadow: 1px 1px 1px #131212; }
#items .item-content span.tag { top: 18px; }
.product span.tag span, #items .item-content span.tag span { display: block; background: url(images/scroller-item-tag.png) no-repeat; padding-left: 9px; height:36px; padding-top: 9px; }

#main-area-bottom { height: 9px; background: url(images/content-bottom.png) no-repeat; }
#main-area { background: url(images/content-top.png) no-repeat; padding-top: 8px; }
#main-content { background: url(images/main-bg.png) repeat-y; padding: 0px 1px 15px 1px; }
#left-column { float: left; width: 720px; margin-top:-8px; }

#left-column .product { float: left; background: url(images/product-right.png) repeat-y top right; position: relative; }
.product .product-content { padding: 24px 23px 19px 24px; width: 193px; background: url(images/product-bottom.png) repeat-x bottom left; }
.product a.image { display: block; position: relative; }
.product a.image:hover { text-decoration: none; }
.product-content span.tag { bottom: 20px; }
.rounded { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border:2px solid #ebebeb; display:inline-block; overflow:hidden; width: 193px; height: 205px; margin-bottom: 10px; }
.product h3 { font-size: 24px; }
.product h3 a:hover { text-decoration: none; }
.product-content a.more { float: left; margin-left: 60px; }

span.band { position: absolute; top: -10px; right: -11px; display: block; width: 101px; height: 101px; }
span.onsale { background: url(images/band-onsale.png) no-repeat; }
span.buygetone { background: url(images/band-buygetone.png) no-repeat; }
span.outofstock { background: url(images/band-outofstock.png) no-repeat; }


#left-column .last { background: none !important; }

#breadcrumbs { padding: 10px 5px 31px 4px; font: italic 12px Georgia, serif; color: #4e4d4d; text-shadow: 1px 1px 1px #ffffff; }
#breadcrumbs .sep { background:url("images/breadcrumbs_separator.png") no-repeat; display:inline-block; height:7px; margin:1px 1px 0 3px; width:4px; }
#breadcrumbs a { color: #807f7f; }
#breadcrumbs a:hover { text-decoration: none; color: #4e4d4d; }


.post { padding: 38px 50px 34px 42px; position: relative; }

.post ul { list-style-type: disc; margin: 10px 0px 10px 20px; }
.post ol { list-style-type: decimal; list-style-position: inside; margin: 10px 0px 10px 2px; }
.post ul li ul, .post ul li ol { margin: 2px 0px 2px 20px; }
.post ol li ul, .post ol li ol { margin: 2px 0px 2px 35px; }

#product-slider { float: left; width: 298px; margin: 0px 25px 10px 0px; }
#product-slides { margin: 0px 0px 7px; }
.item-slide { position: relative; }
.item-slide .overlay { background: url(images/big-overlay.png) no-repeat; display:block; height:321px; width:298px; position: absolute; top: 0px; left: 0px; }

#product-thumbs a { display: block; position: relative; float: left; margin-right: 6px; }
#product-thumbs a .overlay { background: url(images/overlay-sprite.png) no-repeat; display: block; width: 69px; height: 69px; position: absolute; top: 0px; left: 0px; }
#product-thumbs a.active .overlay, #product-thumbs a:hover .overlay { background: url(images/overlay-sprite.png) bottom left; }

.product-info { float:right; width:304px; }
p.post-meta { color: #990f0f; font: italic 14px/24px Georgia,serif; padding-bottom: 20px; }
p.post-meta a { color: #930000; font-weight: bold; }
span.price-single { background: url(images/price-single.png) no-repeat top right; padding-right: 13px; display: block; float: left; color: #ffffff; font-size: 30px; text-shadow:1px 1px 1px rgba(0,0,0,0.4); margin: 0px 16px 0px 0px; }
span.price-single span { display: block; padding:11px 0 6px 12px; background: url(images/price-single.png) no-repeat top left; }
a.addto-cart { float: left; background: url(images/addto-cart.png) no-repeat top right; padding-right: 13px; display: block; color: #ffffff !important; font-size: 30px; text-shadow:1px 1px 1px rgba(0,0,0,0.4); text-transform: uppercase; }
a.addto-cart span { display: block; padding:11px 0 6px 48px; background: url(images/addto-cart.png) no-repeat top left; }
a.addto-cart:hover { text-decoration: none; }
div.description { font-style: italic; font-size: 14px; margin: 15px 0px 0px; }

div.hr { background: url(images/hr-bg.png) no-repeat; height: 1px; width: 720px; margin: 28px 0px 28px -42px; }
.post h2 { font-size: 28px; margin-bottom: 8px; }
.post a { color: #9c260e; }

.related { padding: 35px 0px 0px; }
.related-items { background: url(images/hr-bg.png) no-repeat; margin: 0px -50px 0px -42px !important; list-style-type: none !important; }
.related-items li { float: left; width: 360px; background: url(images/hr-bg.png) no-repeat bottom left; }
.related-items a { display: block; background: url(images/relatedbg-right.png) repeat-y top right; padding: 10px 5px 9px 52px; min-height: 52px; }
.related-items li.second a { background: none; padding-left: 12px; }
.related-items a:hover { text-decoration: none; }
.related-items img { padding: 3px; border: 1px solid #e2e2e2; background: #ffffff; float: left; margin-right: 17px; }
.related-items span { color: #303030; font-size: 18px; float: left; width: 225px; padding-top:7px; }
div.dnone { display: none; float: left; }

#product-slides { height:321px !important; position:relative !important; width:298px !important; }

#footer { margin-top: 24px; }
#footer p#copyright { text-align: right; color: #807f7f; text-shadow: 1px 1px 1px #ffffff; font-size: 11px; padding-right: 10px; }
#footer p#copyright a { font-weight: bold; font-style: italic; }

/*---[DROPDOWN MENU]--*/

Última edición por tranzorx; 08/06/2011 a las 14:05
  #2 (permalink)  
Antiguo 11/06/2011, 12:58
Avatar de tranzorx  
Fecha de Ingreso: marzo-2008
Mensajes: 114
Antigüedad: 9 años, 7 meses
Puntos: 7
Respuesta: Editando una plantilla de WordPress

Hola.
Finalmente el problema del tamaño de las miniaturas de la home page y de la página del producto no estaba en el archivo "style.css".
Es bien cierto que los tres cambios que había que hacer en los marcos están correctamente hecho, pero el tamaño de la imagen interior viene determinado por dos archivos PHP llamados "entry.php" para el tamaño de la miniatura de la página de inicio (Home Page Thumbnail), y del archivo "single-product.php" en el caso de la hoja de características del producto.
Como en mi caso el problema era que había que hacer los marcos y las miniaturas más grandes, es obvio que todos los ajustes tengan relación con el "hight" de los mismos.
A continuación pongo ambos archivos con los tamaños modificado en rojo.

entry.php
Cita:
<?php $thumb = '';
$width = 193;
$height = 190;
$classtext = '';
$titletext = get_the_title();
[...]
single-product.php
Cita:

<?php $custom = get_post_custom($post->ID);
$et_price = isset($custom["price"][0]) ? $custom["price"][0] : '';
if ($et_price <> '') $et_price = get_option('estore_cur_sign') . $et_price;
$et_description = isset($custom["description"][0]) ? $custom["description"][0] : '';
$et_band = isset($custom["et_band"][0]) ? $custom["et_band"][0] : '';

$custom["thumbs"] = isset( $custom["thumbs"][0] ) ? unserialize($custom["thumbs"][0]) : ''; ?>

<?php if ($et_band <> '') { ?>
<span class="band<?php echo(' '.esc_attr($et_band)); ?>"></span>
<?php }; ?>

<?php if (!empty($custom["thumbs"])) { ?>
<div id="product-slider">
<div id="product-slides">
<?php for ($i = 0; $i <= count($custom["thumbs"])-1; $i++) { ?>
<div class="item-slide">
<a href="<?php echo($custom["thumbs"][$i]); ?>" rel="gallery" class="fancybox">
<?php echo et_new_thumb_resize( et_multisite_thumbnail($custom["thumbs"][$i]), 298, 326 ); ?>
<span class="overlay"></span>
</a>
En este enlace se puede ver la home page donde se observa que los marcos son apaisados.
En este otro enlace se puede observar la vista de un producto.

Traducción de la plantilla al español.

head.php
Traducir la barra de búsqueda.
Cita:
[...]
</ul> <!-- ul#nav -->
<?php }
else echo($primaryNav); ?>

<div id="search-bar">
<form method="get" id="searchform1" action="<?php echo home_url(); ?>">
<input type="text" value="<?php esc_attr_e('search this site...','eStore'); ?>" name="s" id="searchinput" />

<input type="image" src="<?php bloginfo('template_directory'); ?>/images/search-icon.png" id="searchsubmit" />
</form>
</div> <!-- #search-bar -->
[...]
Cita:
[...]
</ul> <!-- ul#nav -->
<?php }
else echo($primaryNav); ?>

<div id="search-bar">
<form method="get" id="searchform1" action="<?php echo home_url(); ?>">
<input type="text" value="<?php esc_attr_e('Buscar...','eStore'); ?>" name="s" id="searchinput" />

<input type="image" src="<?php bloginfo('template_directory'); ?>/images/search-icon.png" id="searchsubmit" />
</form>
</div> <!-- #search-bar -->
[...]
entry.php
Traducir el botón "more info" de las entradas.
Cita:
[...]
<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<p><?php truncate_post(115); ?></p>

<a href="<?php the_permalink(); ?>" class="more"><span><?php esc_html_e('more info','eStore'); ?></span></a>
[...]
Cita:
[...]
<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<p><?php truncate_post(115); ?></p>

<a href="<?php the_permalink(); ?>" class="more"><span><?php esc_html_e('más información','eStore'); ?></span></a>
[...]
navigation.php
Traducción notas navegación "Older entries" y "Next entries"
Cita:
<div class="pagination">
<div class="alignleft"><?php next_posts_link(esc_html__('&laquo; Older Entries','eStore')) ?></div>
<div class="alignright"><?php previous_posts_link(esc_html__('Next Entries &raquo;', 'eStore')) ?></div>
</div>
Cita:
<div class="pagination">
<div class="alignleft"><?php next_posts_link(esc_html__('&laquo; Siguientes Entradas','eStore')) ?></div>
<div class="alignright"><?php previous_posts_link(esc_html__('Anteriores Entradas &raquo;', 'eStore')) ?></div>
</div>
single-product.php
Traducir "Edit this page" y "product information"
Cita:
[...]
<h2><?php _e('Product information','eStore'); ?></h2>
<?php the_content(); ?>
<div class="clear"></div>
<?php wp_link_pages(array('before' => '<p><strong>'.__('Pages','eStore').':</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
<?php edit_post_link(__('Edit this page','eStore')); ?>
[...]
Cita:
[...]
<h2><?php _e('Informacion del Producto','eStore'); ?></h2>
<?php the_content(); ?>
<div class="clear"></div>
<?php wp_link_pages(array('before' => '<p><strong>'.__('Pages','eStore').':</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
<?php edit_post_link(__('Editar esta página','eStore')); ?>
[...]
Para editar el 'add to cart' y cambiarlo por 'añadir al carro', buscar la secuencia en este mismo archivo y proceder.

Última edición por tranzorx; 03/01/2012 a las 05:36
  #3 (permalink)  
Antiguo 03/01/2012, 05:38
Avatar de tranzorx  
Fecha de Ingreso: marzo-2008
Mensajes: 114
Antigüedad: 9 años, 7 meses
Puntos: 7
Respuesta: Editando una plantilla de WordPress

Cita:
Iniciado por tranzorx Ver Mensaje
Hola.
Finalmente el problema del tamaño de las miniaturas de la home page y de la página del producto no estaba en el archivo "style.css".
Es bien cierto que los tres cambios que había que hacer en los marcos están correctamente hecho, pero el tamaño de la imagen interior viene determinado por dos archivos PHP llamados "entry.php" para el tamaño de la miniatura de la página de inicio (Home Page Thumbnail), y del archivo "single-product.php" en el caso de la hoja de características del producto.
Como en mi caso el problema era que había que hacer los marcos y las miniaturas más grandes, es obvio que todos los ajustes tengan relación con el "hight" de los mismos.
A continuación pongo ambos archivos con los tamaños modificado en rojo.

entry.php


single-product.php


En este enlace se puede ver la home page donde se observa que los marcos son apaisados.
En este otro enlace se puede observar la vista de un producto.

Traducción de la plantilla al español.

head.php
Traducir la barra de búsqueda.




entry.php
Traducir el botón "more info" de las entradas.




navigation.php
Traducción notas navegación "Older entries" y "Next entries"




single-product.php
Traducir "Edit this page" y "product information"
Para editar el 'add to cart' y cambiarlo por 'añadir al carro', buscar la secuencia en este mismo archivo y proceder.

Etiquetas: plantilla, wordpress
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 03:07.