Modifier dimension image des sous catégories

[bebopman]

Bonjour à tous,

 

Suite aux bon conseils reçus sur ce forum précédemment (grâce à vous tous contributeurs).

Je retente ma chance sur un souci de taille d'image.

J'ai bien sur recherché sur le forum une solution a mon problème mais soit je n'ai pas vraiment compris les réponses soit ça n'a pas fonctionné.

Pour l'instant, la seule chose de "bien" que j'ai pu faire est de créer un nouveau type d'image pour les catégories (pas d'option pour les sous-catégories dommage pour moi) avec une résolution de 870x82.

Je ne sais pas du coup quoi modifier exactement (element.style que je ne trouve pas ou fichier css ou tpl).

Une petite aide serait bienvenue

Voici mon site et merci de m'avoir lu :

 

www.kawaii-dokidoki.fr

[ChDUP]

ça va se passer dans votre category.tpl

 

Dans un premier temps, comme votre thème utilise bootstrap, dans la liste de sous-catégories (<ul class="product_list grid row">) les largeurs de colonnes vont être définies suivant la resolution d'affichage par les class des <li>

col-xs-12 col-sm-6 col-md-4 régissent les largeurs désirées.

voir par ici :

http://getbootstrap.com/css/#grid-example-mixed

 

Ensuite en ce qui concerne la taille des images elles-même, elles sont imposées par height="250" width="250"

Est-ce que vous le retrouvez en dur dans le tpl ?

[bebopman]

ça va se passer dans votre category.tpl

 

Dans un premier temps, comme votre thème utilise bootstrap, dans la liste de sous-catégories (<ul class="product_list grid row">) les largeurs de colonnes vont être définies suivant la resolution d'affichage par les class des <li>

col-xs-12 col-sm-6 col-md-4 régissent les largeurs désirées.

voir par ici :

http://getbootstrap.com/css/#grid-example-mixed

 

Ensuite en ce qui concerne la taille des images elles-même, elles sont imposées par height="250" width="250"

Est-ce que vous le retrouvez en dur dans le tpl ?

Bonjour ChDUP et merci pour votre réponse,

 

Je n'ai surement pas compris votre message... La largeur de l'image me convient parfaitement c'est plutôt en hauteur (voir sous-catégories Stylos/Surligneurs : http://kawaii-dokidoki.fr/fr/9-Stylos-surligneurs)

Ce sont les bordures blanches en dessous et au dessus de mon image qui posent problème (mais c'est peut-être moi qui ait mal compris votre réponse).

Pour le category.tpl, en faisant une recherche sur height="250" je ne trouve aucun résultat dans le fichier.

 

J'utilise également le thème baby market (si cette information peut servir)

Edited December 29, 2016 by bebopman (see edit history)

[ChDUP]

j'avais mal compris la question

Presta crée différentes versions de vos images en fonction de votre configuration dans préférences / images

Pour vos images de sous catégories c'est le format home_default qui est utilisé

Il faut en modifier la taille puis regénérer les images.

attention, ce format est aussi probablement utilisé ailleurs

[bebopman]

Merci à vous !

Est-il du coup possible de créer un nouveau format d'image (comme j'ai fait dans le BO dans style d'image) et surtout de pouvoir l'assigner aux sous catégories sans toutefois modifier ce home_default ?

[ChDUP]

bien sur

vous créez votre type d'image, en l'attribuant à "catégories" 

vous regénérez les images

dans votre tpl vous modifiez votre appel à l'image qui doit être de cette forme :

<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'mon_type_categorie')|escape:'html'}"

[bebopman]

Merci de nouveau pour cette réponse, J'ai bien essayé de faire la modif mais cela n'a pas marché, j'ai pourtant essayé sur le tpl de mon thème ainsi que celui du bootstrap mais rien....

Je pense d'ailleurs que c'est moi qui ait du faire n'importe quoi !

 

voila ce que ça donne si vous avez le temps de regarder dans le tpl du thème baby market (pour info mon style d'image c'est "subcat") :

 

{include file="$tpl_dir./errors.tpl"}
{if isset($category)}
    {if $category->id AND $category->active}
        {if $scenes || $category->description || $category->id_image}
            <div class="content_scene_cat">
                 {if $scenes}
                     <div class="content_scene">
                        <!-- Scenes -->
                        {include file="$tpl_dir./scenes.tpl" scenes=$scenes}
                        {if $category->description}
                            <div class="cat_desc rte">
                            {if Tools::strlen($category->description) > 350}
                                <div id="category_description_short">{$description_short}</div>
                                <div id="category_description_full" class="unvisible">{$category->description}</div>
                                <a href="{$link->getCategoryLink($category->id_category, $category->link_rewrite)|escape:'html':'UTF-8'}" class="lnk_more">{l s='More'}</a>
                            {else}
                                <div>{$category->description}</div>
                            {/if}
                            </div>
                        {/if}
                    </div>
                {else}
                    <!-- Category image -->
                    <div class="content_scene_cat_bg"{if $category->id_image} style="background:url({$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category_default')|escape:'html':'UTF-8'}) right center no-repeat; background-size:cover; min-height:{$categorySize.height}px;"{/if}>
                     </div>
                  {/if}
            </div>
        {/if}
        <h1 class="page-heading{if (isset($subcategories) && !$products) || (isset($subcategories) && $products) || !isset($subcategories) && $products} product-listing{/if}"><span class="cat-name">{$category->name|escape:'html':'UTF-8'}{if isset($categoryNameComplement)} {$categoryNameComplement|escape:'html':'UTF-8'}{/if}</span>{include file="$tpl_dir./category-count.tpl"}</h1>
        {if isset($subcategories)}
        {if (isset($display_subcategories) && $display_subcategories eq 1) || !isset($display_subcategories) }
        <!-- Subcategories -->
        <div id="subcategories">
            <p class="subcategory-heading">{l s='Subcategories'}</p>
            <ul class="clearfix">
            {foreach from=$subcategories item=subcategory}
                <li>
                    <div class="subcategory-image">
                        <a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'html':'UTF-8'}" title="{$subcategory.name|escape:'html':'UTF-8'}" class="img">
                        {if $subcategory.id_image}
                            <img class="replace-2x" src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'subcat')|escape:'html':'UTF-8'}" alt="" width="{$subcategorySize.width}" height="{$subcategorySize.height}" />
                        {else}
                            <img class="replace-2x" src="{$img_cat_dir}default-subcategory_default.jpg" alt="" width="{$subcategorySize.width}" height="{$subcategorySize.height}" />
                        {/if}
                    </a>
                       </div>
                    <h5><a class="subcategory-name" href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'html':'UTF-8'}">{$subcategory.name|truncate:25:'...'|escape:'html':'UTF-8'|truncate:350}</a></h5>
                    {if $subcategory.description}
                        <div class="cat_desc">{$subcategory.description}</div>
                    {/if}
                </li>
            {/foreach}
            </ul>
        </div>
        {/if}
        {/if}
        {if $products}
            <div class="content_sortPagiBar clearfix">
                <div class="sortPagiBar clearfix">
                    {include file="./product-sort.tpl"}
                    {include file="./nbr-product-page.tpl"}
                </div>
                <div class="top-pagination-content clearfix">
                    {include file="./product-compare.tpl"}
                    {include file="$tpl_dir./pagination.tpl"}
                </div>
            </div>
            {include file="./product-list.tpl" products=$products}
            <div class="content_sortPagiBar">
                <div class="bottom-pagination-content clearfix">
                    {include file="./product-compare.tpl" paginationId='bottom'}
                    {include file="./pagination.tpl" paginationId='bottom'}
                </div>
                {if $category->description}
                            <div class="cat_desc">
                            <span class="category-name">
                                {strip}
                                    {$category->name|escape:'html':'UTF-8'}
                                    {if isset($categoryNameComplement)}
                                        {$categoryNameComplement|escape:'html':'UTF-8'}
                                    {/if}
                                {/strip}
                            </span>
                            {if Tools::strlen($category->description) > 350}
                                <div id="category_description_short" class="rte">{$description_short}</div>
                                <div id="category_description_full" class="unvisible rte">{$category->description}</div>
                                <a href="{$link->getCategoryLink($category->id_category, $category->link_rewrite)|escape:'html':'UTF-8'}" class="lnk_more">{l s='More'}</a>
                            {else}
                                <div class="rte">{$category->description}</div>
                            {/if}
                            </div>
                        {/if}
            </div>
        {/if}
    {elseif $category->id}
        <p class="alert alert-warning">{l s='This category is currently unavailable.'}</p>
    {/if}
{/if}
 

Edited December 30, 2016 by bebopman (see edit history)

[ChDUP]

 

 

src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'subcat')|escape:'html':'UTF-8'}" 

Le type d'image que vous avez créé s'appelle subcat ?

Vous avez essayé de vider votre cache ?

[bebopman]

Oui je viens de vider le cache et aucun changement et c'est bien subcat le nom de mon style d'image (le dernier dans la liste)

 

 

[ChDUP]

Votre site affiche toujours l'image home-default.

Vous ne modifiez visiblement pas le bon fichier.

[bebopman]

J'ai pourtant modifié les category.tpl de mont thème installé ainsi que celui du bootstrap au cas ou.... je ne sais plus quoi faire....

Pour vider le cache c'est bien dans Paramètres avancés>Performance>Vider le cache ?

Dans la zone smarty je suis sur "Recompiler les fichiers de templates s'ils ont été mis à jour" et pour le cache "Non"

[ChDUP]

généralement quand j'en suis là, je tape un TEST dans le tpl, pour voir si il s'affiche bien et m'assurer que je suis dans le bon fichier.

[bebopman]

J'utilise Notepad++ comment faites vous ce test svp ?

ah oui et pourriez me dire comment vous faites pour voir que c'est toujours le home_default qui apparait ?

Merci d'avoir pris du temps pour m'aider !

Edited December 30, 2016 by bebopman (see edit history)

[ChDUP]

Vous marquez TEST n'importe où, par exemple dans le <h1> pour etre sur de ne pas louper, et vous voyez si il s'affiche bien.

Pour voir que l'image est toujours celle du home_default, regardez votre code source.

en l'occurrence :

http://kawaii-dokidoki.fr/8-home_default/petits-surligneurs-oursons.jpg

 

on retrouve le home_default

[bebopman]

 Merci à vous, oui en effet je vois bien le home_default mais il concerne uniquement le produit pas ma problématique sur l'image d'en-tête de sous catégorie ?

[ChDUP]

arf oui

c'est parce que vous m'avez donné plus haut cette URL

http://kawaii-dokidoki.fr/fr/9-Stylos-surligneurs

alors je crois depuis le début que "petits surligneurs oursons" est une sous-catégorie ...

désolé

 

Le problème est que vous n'affichez pas les sous-catégories

http://kawaii-dokidoki.fr/fr/5-Papeterie

donc je ne peux pas voir

[bebopman]

Bonjour ChDUP et merci pour votre commentaire,

 

En effet,  nous nous sommes mal compris je pense.

Je vais essayer d'expliquer mon problème un peu plus :

 

Cette page : http://kawaii-dokidoki.fr/fr/9-Stylos-surligneurs est bien la page de sous catégorie "Stylos-surligneurs"

Sur cette page il y a seulement un seul produit (pas eu le temps de rajouter les autres pour l'instant)

On peut accéder à la sous-catégorie via l'arbre dans la colonne de gauche.

 

L'image que je souhaite modifier est celle entouré par mes soins dans l'image que je joins à ce message.

 

Par défaut, il me reprends les dimensions des images de catégorie soit 870x217, d'où les bordures blanches au dessus et en dessous de cette image.

J'ai donc créé un style d'image que j'ai nommé "subcat" avec une taille de 870x90.

 

J'aimerais donc pouvoir appliqué ce style d'image à celle que j'ai entouré dans la pièce jointes mais rien à faire   je ne sais pas du tout ce que je dois modifier....

[ChDUP]

ouch oui

Ce n'est pas l'image des liens vers les sous-catégories que vous voulez modifier

mais l'image de la catégorie elle-même

 

et vous la voulez différente suivant le niveau de catégorie.

Ce n'est pas possible (du moins sans développement)

Il n'y a pas de distinction "sous-catégorie" et "catégorie" dans prestashop

Ce sont toutes des catégories, qui ont une catégorie parente.

Même vos catégories de premier niveau ont comme parent la catégorie "accueil"

[bebopman]

Arf c'est dommage bon ba tant pis

Merci encore pour votre aide !