Chemin relatif vers une image

[linusminus]

Bonjour, 

 

Je viens de commencer à utiliser Prestashop comme CMS E-commerce, ceci est venu après plusieurs jours de comparaisons des autres produits sur le marché...

 

Je suis sur une boutique en mode local ( WAMP, Prestashop 1.6..).

 

Le problème que je rencontre c'est quand j'essaie d'implémenter des images sur le fond du menu de ma page d'accueil.

 

Je m'explique :

Je souhaite faire un dégradé de couleur avec une image de fond sur la balise "div" portant la propriété ".sf-menu" sur le menu principal.

 

Je n'arrive pas à définir le chemin relatif à partir de mon dossier de travail : dois-je partir du dossier "localhost" ou encore du thème que j'utilise ? 

 

J'ai essayé ses différentes formulations :

 

"../../../img" > pour remonter les dossiers css etc...

"img/bg-menu.png"

"../img/bg-menu.png"

 

même "localhost/prestashop....img/bg-menu.png" ne marche pas.

 

Quelqu'un à une idée pour définir le bon chemin d'accès à une image à partir d'un fichier css global.css ou autre.. ?

 

J'espère que j'ai été clair, vos aides seront les bienvenues.

 

Merci 

V++

Edited September 8, 2014 by linusminus (see edit history)

[YopixelAE]

Bonjour,

Pourquoi ne mettez-vous pas votre image dans le dossier correspondant, avec les autres images ?

[loulou66]

coucou

 

 

1°) dans themes/ton_theme/css créer un dossier modules (si il n'existe pas)

2°) dans themes/ton_theme/css/modules  créer un dossier blocktopmenu

3°) dans themes/ton_theme/css/modules/blocktopmenu copier le css original du module/blocktopmenu

4°) dans themes/ton_theme/css/modules/blocktopmenu créer un dossier img

5°) copier votre images dans ce dossie img

6°) dans les themes/ton_theme/css/modules/blocktopmenu/blocktopmenu.css

     le background url aura la chemin (img/nom_de_l_image)

7°) dans theme/ton_theme/css/modules/blocktopmenu copier un index.php pris dans un autre dossier 

 

tout cela pour éviter l'ors d'une mise a jour la perte de vos modification

comme j'ai fait ça de tête si l'image ne s'affiche pas vérifier le chemin dans la console (F12 ou bouton droit=>inspecter elements sur l'image)

 

@++

 

Loulou66 

[linusminus]

Bonjour Loulou66,

 

Merci pour ta réponse, effectivement cela marche avec le chemin (../img/nom_de_l_image).

Par contre la  7° étape je l'ai pas très bien comprise ?

 

"7°) dans theme/ton_theme/css/modules/blocktopmenu copier un index.php pris dans un autre dossier "

 

Concernant la mise à jour vous dites que cela peut entrainer la perte de mes données, Alors je vous explique ma méthodologie :

je travail sur le thème de base, j'ai dupliqué le dossier "default-bootstrap", j'ai aussi écrasé l'ancien logo par le mien.

 

Pensez-vous que cela pourrait causer une perte au cas d'une MAJ ?

Au niveau du fichier css "global.css" également

 

Je suis encore novice et je souhaite partir sur une bonne base et pas que mon travail de plusieurs jours voir plusieurs semaines fini dans le vide...

 

@Yopixel : Je ne comprend pas de quel dossier images te parle ?

 

Mes images son bien dans le dossier commun de mon theme/img" (Avant d'entamer la solution de Loulou66)

Vous m'excuseriez j'ai encore mes vieilles habitudes du CMS Wordpress avec la notion de "parent enfant" ^^ 

 

Merci tout de même pour la solution !

Edited September 10, 2014 by linusminus (see edit history)

[YopixelAE]

"7°) dans theme/ton_theme/css/modules/blocktopmenu copier un index.php pris dans un autre dossier "

 

Dans tous les dossiers il y a un fichier index.php (sécurité qui empêche l'accès au dossier, ne permettant que l'accès aux fichiers contenus dans ce dossier). Si vous avez créé un dossier spécial (ce qui n'est peut-être pas le cas) n'oubliez pas ce fichier index.

 

""je travail sur le thème de base, j'ai dupliqué le dossier "default-bootstrap", j'ai aussi écrasé l'ancien logo par le mien.

Pensez-vous que cela pourrait causer une perte au cas d'une MAJ ?""

 

Vous devez dupliquer mais également renommer le thème. Ce qui évitera lors des maj que ledit dossier soit remplacé par celui de la nouvelle version.

[loulou66]

coucou

 

le fichier index.php est une securite pour qu'on ne puisse pas acceder au dossier avec l'url www.ton_site.fr/theme/ton_theme/css/modules/blocktopmenu dans chaque dossier de prestashop tu as un index.php il suffit d'en copier un dans ce nouveau dossier

 

 

Bonjour Loulou66,

 

Merci pour ta réponse, effectivement cela marche avec le chemin (../img/nom_de_l_image).

Par contre la  7° étape je l'ai pas très bien comprise ?

 

"7°) dans theme/ton_theme/css/modules/blocktopmenu copier un index.php pris dans un autre dossier "

 

Concernant la mise à jour vous dites que cela peut entrainer la perte de mes données, Alors je vous explique ma méthodologie :

je travail sur le thème de base, j'ai dupliqué le dossier "default-bootstrap", j'ai aussi écrasé l'ancien logo par le mien.

 

Pensez-vous que cela pourrait causer une perte au cas d'une MAJ ?

Au niveau du fichier css "global.css" également

 

Je suis encore novice et je souhaite partir sur une bonne base et pas que mon travail de plusieurs jours voir plusieurs semaines fini dans le vide...

 

@Yopixel : Je ne comprend pas de quel dossier images te parle ?

 

Mes images son bien dans le dossier commun de mon theme/img" (Avant d'entamer la solution de Loulou66)

Vous m'excuseriez j'ai encore mes vieilles habitudes du CMS Wordpress avec la notion de "parent enfant" ^^ 

 

Merci tout de même pour la solution !

 

alors je parlais en cas de mise a jour du module blocktopmenu pour le global css ou les fichier de ton_theme il n'y aura un perte que si tu met a jour prestashop et que coche l'option mettre a jour le theme 

 

ensuite si tu veut que l'image soit dans theme/img et comme ton css modifié est dans theme/ton_theme/modules/blocktopmenu il faut reculer avec ../ autant de fois pour arriver a theme donc ../../../img/ton image

 

EDIT  ha bin Yopixel a été plus rapide ^^

 

@++

 

Loulou66

Edited September 10, 2014 by loulou66 (see edit history)