[Solucionado] Imagen de fondo en cada categoría y subcategoría

[Syd]

Hola,

me gustaría poner imagen de fondo en cada categoría y otra en cada subcategoría, ¿cómo hacerlo?

Saludos

Edited May 26, 2012 by Syd (see edit history)

[nadie]

Hola,

me gustaría poner imagen de fondo en cada categoría y otra en cada subcategoría, ¿cómo hacerlo?

Saludos

Un fondo, pero debajo de las imágenes, en el lateral, en el listado de categorías? explícate un poco mejor que vea lo que quieres, para que la comunidad pueda ayudarte.

[Syd]

Hola,

me gustaría poner una imagen de background en cada página de categoría, y subcategoría, es decir, pinchar en cada una, y en la página que se abre, tener una imagen de background en cada una de ellas.

[buhoc]

Hola,

me gustaría poner una imagen de background en cada página de categoría, y subcategoría, es decir, pinchar en cada una, y en la página que se abre, tener una imagen de background en cada una de ellas.

 

Hola Syd,

 

Creo que eso que quieres es un poco difícil o imposible. El background del listado de categorías y subcategorías es el mismo para todos los elementos que se encuentren en esa posición. Es decir, el elemento "contenedor" de esa parte, es el mismo para los artículos, la Home, la página de contacto.....etc.

[nadie]

Hola Syd,

 

Creo que eso que quieres es un poco difícil o imposible. El background del listado de categorías y subcategorías es el mismo para todos los elementos que se encuentren en esa posición. Es decir, el elemento "contenedor" de esa parte, es el mismo para los artículos, la Home, la página de contacto.....etc.

 

Si lo quieres hacer especifico para cada categoría podrías jugar con esto... (aunque sigo sin entender que es lo que quieres hacer D)

 

if ($category->id_category == X) ..... {/if}

[Syd]

Y en que archivo escribo el código? Y en qué parte del archivo? Se trata de subir las imágenes mediante ftp y mencionar cada una de ellas en el código para cada id de categoría, imagino... con html <img src y tal

A ver lo explico lo mejor que pueda. Entras en la página principal. En el menú de categorías pinchas en la 1a categoría. Se abre la página de categoría 1 con el listado de subcategorias (una imagen de background iría aquí). Luego pinchas en subcategoria 1, se abre la página de la subcategoria 1 con sus productos (otra imagen de background para esta página), y así con el resto de subcategorias y luego el resto de categorías.

Edited May 23, 2012 by Syd (see edit history)

[Syd]

También estoy meditando poner una imagen de cabecera para cada página en lugar del background, pero me imagino que a efectos de Programación debe ser casi igual.

 

De cabecera en el cuerpo, no en el header

Edited May 23, 2012 by Syd (see edit history)

[Syd]

Alguna ayuda?

[Syd]

Y cuando se referencia la imagen? Es decir, si la imagen es img01.jpg, y está en /img/categorias habrá que llamarla de alguna forma no?

[nadie]

Y cuando se referencia la imagen? Es decir, si la imagen es img01.jpg, y está en /img/categorias habrá que llamarla de alguna forma no?

El llamarla dependera de como la quieras llamarla, si es una imagen de fondo, puedes create un id en el css por cada categoria.

 

<div id="categoria{$smarty.get.id_category}">..</div>

 

Luego irte al css y decir

 

#categoria1 {background......}

 

 

#categoria2 {background......}

[Syd]

Qué valor devuelve esto?

 

smarty.get.id_category

Edited May 25, 2012 by Syd (see edit history)

[nadie]

Qué valor devuelve esto?

 

{$smarty.get.id_category}.jpg

Numero de categoría actual.jpg

 

Es decir si estas en la categoría con id 2

 

Te devuelve 2.jpg

[Syd]

Escribiendo esto sí sale la imagen:

<img src="/img/1.jpg" alt="" />

 

Escribiendo esto no sale la imagen:

<img src="/img/{$smarty.get.id_category}.jpg" alt="" />

[nadie]

Escribiendo esto sí sale la imagen:

<img src="/img/1.jpg" alt="" />

 

Escribiendo esto no sale la imagen:

<img src="/img/{$smarty.get.id_category}.jpg" alt="" />

Debería ir, es decir te coloca /img/idcategoria_actual, a ti que te imprime?

[Syd]

No me sale nada, ni siquiera cuando capta una imagen que no puede cargar, directamente sale la página sin nada más. Lo escribo en el mismo renglón... No se, no entiendo muy bien la pregunta.

 

a no ser que el id_categoría que devuelve tenga otro valor...

hay alguna forma de comprobarlo?

 

lo siento no se php, sabía c, visual, algo de asp, pero de php ni idea

Edited May 25, 2012 by Syd (see edit history)

[nadie]

No me sale nada, ni siquiera cuando capta una imagen que no puede cargar, directamente sale la página sin nada más. Lo escribo en el mismo renglón... No se, no entiendo muy bien la pregunta

Me refiero si te salia otro numero distinto a la categoría actual, pero vamos esto, esta probado y reprobado y funciona....

Supongo que el forzar compilación lo tienes activado ect.. no?

[Syd]

Tengo activado forzar la compilación y también la caché,

al probar he pinchado en las 6 categorías que tengo, alguna debería ser la categoría 1.

[nadie]

Tengo activado forzar la compilación y también la caché,

al probar he pinchado en las 6 categorías que tengo, alguna debería ser la categoría 1.

Estas con la plantilla por defecto o con otra?

Prueba activando la plantilla por defecto, aunque es muy muy extraño, lo que comentas

[Syd]

Estoy con otra plantilla. Si activo la plantilla por defecto, debería hacer una copia de seguridad de prestashop o no hay riesgo de perder datos?

 

De nuevo probé

 

<img src="/img/1.jpg" alt="" />

 

y luego

 

<img src="/img/{$smarty.get.id_category}.jpg" alt="" />

 

y me vuelve a salir la imagen en el primero pero no en el segundo, por cierto, todo en category.tpl

[nadie]

Estoy con otra plantilla. Si activo la plantilla por defecto, debería hacer una copia de seguridad de prestashop o no hay riesgo de perder datos?

 

De nuevo probé

 

<img src="/img/1.jpg" alt="" />

 

y luego

 

<img src="/img/{$smarty.get.id_category}.jpg" alt="" />

 

y me vuelve a salir la imagen en el primero pero no en el segundo, por cierto, todo en category.tpl

No pierdes nada si activas la plantilla por defecto. D (Pero ya te digo que es raro)

[Syd]

Pues sí, pasó lo mismo, activé el tema por defecto, edité el category.tpl y probé

<img src="/img/1.jpg" alt="" />

y

<img src="/img/{$smarty.get.id_category}.jpg" alt="" />

Mismo resultado

[Syd]

Mira por donde se me ocurrió hacer un simple echo {$smarty.get.id_category}; y los resultados son por categorías:

1=5

2=7

3=9

4=6

5=8

6=28

Ahora, al usar <img src="/img/{$smarty.get.id_category}.jpg" alt="" /> sí sale poniendo 5.jpg 7.jpg etc

[nadie]

Mira por donde se me ocurrió hacer un simple echo {$smarty.get.id_category}; y los resultados son por categorías:

1=5

2=7

3=9

4=6

5=8

6=28

Ahora, al usar <img src="/img/{$smarty.get.id_category}.jpg" alt="" /> sí sale poniendo 5.jpg 7.jpg etc

Y cual es la diferencia entre eso y lo que te dije ?

[Syd]

No podría adivinar que los archivos de jpg se tendrían que llamar 5,7,9,6,8 y 28. Yo pensaba que la salida era 1,2,3,4,5,6; o si acaso 0,1,2... Pero bueno, voy a currarlo, creo que está quedando bastante bien, jeje

Y muchas gracias

[nadie]

No podría adivinar que los archivos de jpg se tendrían que llamar 5,7,9,6,8 y 28. Yo pensaba que la salida era 1,2,3,4,5,6; o si acaso 0,1,2... Pero bueno, voy a currarlo, creo que está quedando bastante bien, jeje

Y muchas gracias

Los jps, se llamara como sea el id de la categoría, si la categoría tiene el id 7 el jpg sera el 7...tiene su lógica..

[Syd]

Bueno, aquí estoy otra vez, soy la peor pesadilla,

 

consigo que me salgan los background pero solo se muestran un cachito en la columna central, y yo quiero que se vea en toda la columna central hasta abajo. Pongo los css:

 

 

#categoria5 {

background-image:url(../../..//img/5.jpg);

}

#categoria7 {

background-image:url(../../..//img/7.jpg);

}

#categoria9 {

background-image:url(../../..//img/9.jpg);

}

#categoria6 {

/*background: #660000 url('../img/6.jpg') no-repeat;*/

background-image:url(../../..//img/6.jpg);

}

#categoria8 {

background-image:url(../../..//img/8.jpg);

}

#categoria28 {

background-image:url(../../..//img/28.jpg);

}

 

Y el cagegory.tpl

 

 

<div id="categoria{$smarty.get.id_category}"><!-- INCLUYO EL CSS DE CATEGORIA -->

{*

* 2007-2011 PrestaShop

*

* NOTICE OF LICENSE

*

* This source file is subject to the Academic Free License (AFL 3.0)

* that is bundled with this package in the file LICENSE.txt.

* It is also available through the world-wide-web at this URL:

* http://opensource.org/licenses/afl-3.0.php

* If you did not receive a copy of the license and are unable to

* obtain it through the world-wide-web, please send an email

* to [email protected] so we can send you a copy immediately.

*

* DISCLAIMER

*

* Do not edit or add to this file if you wish to upgrade PrestaShop to newer

* versions in the future. If you wish to customize PrestaShop for your

* needs please refer to http://www.prestashop.com for more information.

*

* @author PrestaShop SA <[email protected]>

* @copyright 2007-2011 PrestaShop SA

* @version Release: $Revision: 6677 $

* @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0)

* International Registered Trademark & Property of PrestaShop SA

*}

 

{include file="$tpl_dir./breadcrumb.tpl"}

{include file="$tpl_dir./errors.tpl"}

 

 

 

{if isset($category)}

{if $category->id AND $category->active}

<h1>{strip}

{$category->name|escape:'htmlall':'UTF-8'}

<span>

{if $category->id == 1 OR $nb_products == 0}{l s='There are no products.'}

{else}

{if $nb_products == 1}{l s='There is'}{else}{l s='There are'}{/if} 

{$nb_products} 

{if $nb_products == 1}{l s='product.'}{else}{l s='products.'}{/if}

{/if}

</span>{/strip}

</h1>

 

{if $scenes}

<!-- Scenes -->

{include file="$tpl_dir./scenes.tpl" scenes=$scenes}

{else}

<!-- Category image -->

{if $category->id_image}

<div class="align_center">

<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />

</div>

{/if}

{/if}

 

<!--<img src="/img/{$smarty.get.id_category}.jpg" alt="" />-->

 

<!--{if ($category->id_category == $smarty.get.id_category)} <img src="/img/{$smarty.get.id_category}.jpg" alt="" /> {/if} -->

<!--<img src="/img/6.jpg" alt="" />-->

 

 

{if $category->description}

<div class="cat_desc">{$category->description}</div>

{/if}

{if isset($subcategories)}

<!-- Subcategories -->

<div id="subcategories">

<h3>{l s='Subcategories'}</h3>

<ul class="inline_list">

{foreach from=$subcategories item=subcategory}

<li>

<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">

{if $subcategory.id_image}

<img src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium')}" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />

{else}

<img src="{$img_cat_dir}default-medium.jpg" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />

{/if}

</a><br />

<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}</a>

</li>

{/foreach}

</ul>

<br class="clear"/>

</div>

</div>

{/if}

 

{if $products}

{include file="$tpl_dir./product-compare.tpl"}

{include file="$tpl_dir./product-sort.tpl"}

{include file="$tpl_dir./product-list.tpl" products=$products}

{include file="$tpl_dir./product-compare.tpl"}

{include file="$tpl_dir./pagination.tpl"}

{elseif !isset($subcategories)}

<p class="warning">{l s='There are no products in this category.'}</p>

{/if}

{elseif $category->id}

<p class="warning">{l s='This category is currently unavailable.'}</p>

{/if}

{/if}

[Syd]

Lo tengo en columns, pero lo quité y seguía igual.

 

 

#columns {

background: #ffccff;

height: auto!important;

height: 630px;

min-height: 630px;

border: 18px solid #262626;

margin: 20px 0 0;

text-align: left;

width: 864px;

}

#left_column, #center_column, #right_column { float: left }

#left_column {

clear: left;

width: 210px; /* +90px */

margin-right: 0px;

overflow: hidden

}

#center_column {

float: right;

width: 642px; /* +122px */

height: auto!important; height: 460px; min-height: 460px;

margin: 0 0 0px 0;

padding: 0 10px 0 0;

overflow: hidden

}

#index #center_column { width: 642px; padding: 0 10px 0 0; }

 

#old_center_column { display: none }

[nadie]

Teniendo la url de la web ayudara a detectar lo que te esta pasando.

[nadie]

Bueno, aquí estoy otra vez, soy la peor pesadilla,

 

consigo que me salgan los background pero solo se muestran un cachito en la columna central, y yo quiero que se vea en toda la columna central hasta abajo. Pongo los css:

 

 

#categoria5 {

background-image:url(../../..//img/5.jpg);

}

#categoria7 {

background-image:url(../../..//img/7.jpg);

}

#categoria9 {

background-image:url(../../..//img/9.jpg);

}

#categoria6 {

/*background: #660000 url('../img/6.jpg') no-repeat;*/

background-image:url(../../..//img/6.jpg);

}

#categoria8 {

background-image:url(../../..//img/8.jpg);

}

#categoria28 {

background-image:url(../../..//img/28.jpg);

}

 

Y el cagegory.tpl

 

 

<div id="categoria{$smarty.get.id_category}"><!-- INCLUYO EL CSS DE CATEGORIA -->

{*

* 2007-2011 PrestaShop

*

* NOTICE OF LICENSE

*

* This source file is subject to the Academic Free License (AFL 3.0)

* that is bundled with this package in the file LICENSE.txt.

* It is also available through the world-wide-web at this URL:

* http://opensource.or...ses/afl-3.0.php

* If you did not receive a copy of the license and are unable to

* obtain it through the world-wide-web, please send an email

* to [email protected] so we can send you a copy immediately.

*

* DISCLAIMER

*

* Do not edit or add to this file if you wish to upgrade PrestaShop to newer

* versions in the future. If you wish to customize PrestaShop for your

* needs please refer to http://www.prestashop.com for more information.

*

* @author PrestaShop SA <[email protected]>

* @copyright 2007-2011 PrestaShop SA

* @version Release: $Revision: 6677 $

* @license http://opensource.or...ses/afl-3.0.php Academic Free License (AFL 3.0)

* International Registered Trademark & Property of PrestaShop SA

*}

 

{include file="$tpl_dir./breadcrumb.tpl"}

{include file="$tpl_dir./errors.tpl"}

 

 

 

{if isset($category)}

{if $category->id AND $category->active}

<h1>{strip}

{$category->name|escape:'htmlall':'UTF-8'}

<span>

{if $category->id == 1 OR $nb_products == 0}{l s='There are no products.'}

{else}

{if $nb_products == 1}{l s='There is'}{else}{l s='There are'}{/if} 

{$nb_products} 

{if $nb_products == 1}{l s='product.'}{else}{l s='products.'}{/if}

{/if}

</span>{/strip}

</h1>

 

{if $scenes}

<!-- Scenes -->

{include file="$tpl_dir./scenes.tpl" scenes=$scenes}

{else}

<!-- Category image -->

{if $category->id_image}

<div class="align_center">

<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />

</div>

{/if}

{/if}

 

<!--<img src="/img/{$smarty.get.id_category}.jpg" alt="" />-->

 

<!--{if ($category->id_category == $smarty.get.id_category)} <img src="/img/{$smarty.get.id_category}.jpg" alt="" /> {/if} -->

<!--<img src="/img/6.jpg" alt="" />-->

 

 

{if $category->description}

<div class="cat_desc">{$category->description}</div>

{/if}

{if isset($subcategories)}

<!-- Subcategories -->

<div id="subcategories">

<h3>{l s='Subcategories'}</h3>

<ul class="inline_list">

{foreach from=$subcategories item=subcategory}

<li>

<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">

{if $subcategory.id_image}

<img src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium')}" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />

{else}

<img src="{$img_cat_dir}default-medium.jpg" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />

{/if}

</a><br />

<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}</a>

</li>

{/foreach}

</ul>

<br class="clear"/>

</div>

</div>

{/if}

 

{if $products}

{include file="$tpl_dir./product-compare.tpl"}

{include file="$tpl_dir./product-sort.tpl"}

{include file="$tpl_dir./product-list.tpl" products=$products}

{include file="$tpl_dir./product-compare.tpl"}

{include file="$tpl_dir./pagination.tpl"}

{elseif !isset($subcategories)}

<p class="warning">{l s='There are no products in this category.'}</p>

{/if}

{elseif $category->id}

<p class="warning">{l s='This category is currently unavailable.'}</p>

{/if}

{/if}

Por que no defines un alto.. ?

Es decir.. encapsulas un div con un fondo, pero no estas definiendo el alto de fondo..

[Syd]

Bingo! jajaja

me faltaban el height y el width, pero tengo excusa, primero los puse, pero otra cosa falló y los borré.

Muchas gracias!

[nadie]

Bingo! jajaja

me faltaban el height y el width, pero tengo excusa, primero los puse, pero otra cosa falló y los borré.

Muchas gracias!

Y cual fue la razón por la que lo cambiastes anteriormente?

[Syd]

Que lo intenté poner todo seguido detrás de background, url, y todo eso, y como no sabía qué fallaba empecé a borrar, jeje

[nadie]

Que lo intenté poner todo seguido detrás de background, url, y todo eso, y como no sabía qué fallaba empecé a borrar, jeje

Entonces ya lo tienes funcionando?

[Syd]

Lo tengo funcionando, pero sólo tengo 2 fondos terminados. Y aún quiero que salga el mismo fondo también para cada subcategoría correspondiente.

 

Pero creo que podré hacerlo. Es curioso, he mirado, y para cada subcategoría va cambiando el valor del {$smarty.get.id_category}; en este caso van desde el 10 al 29.

 

Voilà! Sí, al fin lo conseguí. Ahora ya se puede dar el tema por solucionado.

Muchas gracias!

Edited May 26, 2012 by Syd (see edit history)

[nadie]

Lo tengo funcionando, pero sólo tengo 2 fondos terminados. Y aún quiero que salga el mismo fondo también para cada subcategoría correspondiente.

 

Pero creo que podré hacerlo. Es curioso, he mirado, y para cada subcategoría va cambiando el valor del {$smarty.get.id_category}; en este caso van desde el 10 al 29.

 

Voilà! Sí, al fin lo conseguí. Ahora ya se puede dar el tema por solucionado.

Muchas gracias!

Un placer ayudarte y servirte!

 

Un Saludo y recuerda que estaremos por el foro, para guiarte por este mundo oscuro y tenebroso.

[felipeN]

Hola,

tengo una pregunta anexa a lo que comentais. Necesito tener la id de la subcategoría para mostrar unas flags en featured products. Sabeis como puedo hacerlo? Hasta ahora he probado a hacer consultas a la tabla correspondiente, para crear una variable, pero no me ha dado ningún resultado.

[nadie]

Hola,

tengo una pregunta anexa a lo que comentais. Necesito tener la id de la subcategoría para mostrar unas flags en featured products. Sabeis como puedo hacerlo? Hasta ahora he probado a hacer consultas a la tabla correspondiente, para crear una variable, pero no me ha dado ningún resultado.

Evita abrir temas solucionados, si tienes una duda nueva abre un tema nuevo.

 

Usted ya tiene un tema abierto aquí: http://www.prestasho...de-la-categoria (Sea paciente).

[bazaralandalus]

Muchas gracias Syd,

Estoy encantada con tu pregunta porque es lo que yo necesitaba. La planteé en el foro hace un tiempo y no tuve respuesta.

No imaginas la ilusión que me ha hecho. Voy a ponerlo en marcha y espero acertar.

Mil gracias!!!!

[nadie]

Muchas gracias Syd,

Estoy encantada con tu pregunta porque es lo que yo necesitaba. La planteé en el foro hace un tiempo y no tuve respuesta.

No imaginas la ilusión que me ha hecho. Voy a ponerlo en marcha y espero acertar.

Mil gracias!!!!

 

También tienes una guía aquí en Español: http://victor-rodenas.com/2012/11/04/guia-cambiar-el-fondo-de-tu-tienda-segun-categoria-en-prestashop-1-5/ por si es un fondo general a la tienda segun categoría.

[Syd]

Muchas gracias Syd,

Estoy encantada con tu pregunta porque es lo que yo necesitaba. La planteé en el foro hace un tiempo y no tuve respuesta.

No imaginas la ilusión que me ha hecho. Voy a ponerlo en marcha y espero acertar.

Mil gracias!!!!

 

Me alegro,

te aconsejo que lo uses con unas medidas fijas de height, ya que lo que no conseguí yo es que cuando se alargaba la estructura hacia abajo, el hueco que quedaba debajo de la imagen no logré rellenarlo con el mismo color de fondo que la imagen. Aunque yo quería un color diferente cada vez, quizá con el mismo color siempre sí funcione,

saludos

Edited November 5, 2012 by Syd (see edit history)