PrestaShop Forum

The best place in the world to ask questions about PrestaShop and get advice from our passionate community!

PrestaShop Forum

Jump to content

 

Configuration prduits phares (RESOLU)

24 replies to this topic
#1
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts
Bonjour à tous,
Après avoir longuement parcouru le forum en long,en large en travers, etc... je n'ai pas trouvé la solution à mon problème qui est le suivant: je voudrais changer la forme de la partie produits phares pour quelle soit comme sur le template suivant http://atchworks.free.fr/testshop/ (magnifique template au passage! merci atch) et même en utilisant firebug je ne trouve pas la solution alors please help!!

#2
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
tu es sur un theme a 3 ou 2 colonne ?

#3
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262869729:

tu es sur un theme a 3 ou 2 colonne ?


sur 3 colones, en fait je voudrais le faire sur le thème d'origine.

#4
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
comme sur mon theme alors
;) iles produits phares sont issus de celui de atch

#5
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262870127:

comme sur mon theme alors
;) iles produits phares sont issus de celui de atch


exactement!!! mais je bidouille je suis pas fortiche en css!
comment t'as fait?

#6
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
a tu installer fire bug ?

http://www.prestasho..._dot__dot__dot_


je te donne le script ce soir quand je rentre ;) c est dans le fichier global.css

#7
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262872816:

a tu installer fire bug ?

http://www.prestasho..._dot__dot__dot_


je te donne le script ce soir quand je rentre ;) c est dans le fichier global.css


je te remercie d'avance et a ce soir

#8
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
de rien j en profiterais aussi pour tenter de stabliser le script pour Ie6 qui affiche un bug !

#9
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
ajoute ce code depuis /* Produits Phares*/ (ligne 1051) jusqua /* Block tags */(ligne 1232) dans le fichier global.css de ton template ;)
il y a un petit souci d affichage sous Ie 6 je travail dessus, je te posterais les modif ;)
sur celui la j ai modifier quelques lignes car celui de atch ne rentrais pas dans un 3 colonne

/*  Produits Phares*/

/* Special style for block products in center column */
#center_column .products_block {
border-style: none;
float: left;
width: 555px;
}

#center_column .products_block {
color: #595a5e;
}



#center_column .products_block .block_content {
background-image: none;
background-color: #fff;
padding: 0;
}

#center_column .products_block ul li:hover {
background-color: #EDEDDF;

}

#center_column .products_block ul li {
background-color: #fff;
border-top:3px solid #C99716;
border-left:1px solid #a5a5a5;
border-right:1px solid #a5a5a5;
border-bottom:1px solid #a5a5a5;
margin-top: 10px;
clear: none;
float: right;
/*width: 250px; IE6 */
width: 250px;
padding:0 2px 5px;
margin-left: 4px;
margin-right: 3px;
height: 150px;
}


#center_column .products_block li.last_item_of_line {
margin-right: 2px;
display: block;
float: left;
}

#center_column .products_block li.first_item_of_line {
display: block;
float: left;
clear:both;
}

#center_column .products_block li.last_line {
}

#center_column .products_block p, #center_column .products_block h5 {
}

#center_column div.products_block h5 {
display: block;
height: auto;
font-weight: bold;
font-size: 1em;
text-align: left;
border-left-style: solid;
border-left-width: 0;
padding-top: 5px;
margin: 0 0 5px 4px;
}

#center_column div.products_block h5 a {
color: #424243;
font-size: 1.1em;
}

#center_column div.products_block ul li p {
padding: 0;
display: block;
margin: 0;
float: right;
}

#center_column div.products_block p.product_desc {
color: #595a5e;
width: 140px;
display: block;
height: 50px;
overflow: hidden;
margin-bottom: 4px;
padding-bottom: 0;
z-index: 1;
}

#center_column div.products_block a.product_image {
display: inline;
background-color: transparent;
width: 110px;
height: 110px;
margin: 0;
float: left;
}

#center_column div.products_block a.product_image img {
margin: 0;
display: inline;
margin-top: -60px;
}

#center_column div.products_block p.product_desc, #center_column div.products_block h5 {
margin-right:0.6em;
text-align: right;
}

#center_column div.products_block ul li p.product_desc a {
font-weight: normal;
font-style: normal;
display: block;
margin-left: 30px;
width: 110px;
}

#center_column .products_block span.price {
text-align: center;
color: #C99716;
display: block;
font-size: 12px;
direction: ltr;
line-height: 17px;
border-width: 1px;
border-style: none;
margin: 2px 1px 2px 0;
margin-top: -20px;
}

#center_column .products_block a.button {
margin: 0.1em 1px 0.2em 0;
margin-left: 130px;
margin-top : 90px;
}

#center_column .products_block a.exclusive {
display: block;
margin-right: 0;
margin-left: 130px;
}

#center_column .products_block span.exclusive {
margin: 0.5em auto 0.5em 0;
display: none;
}

/* Special style for block accessories in center column (product page) */

#center_column .products_block.accessories_block .block_content {
background-image: none;
font-size: 1em;
border-bottom: 1px solid #85949d;
display: inline-block;
height: auto;
vertical-align: top;
}

#center_column div.products_block.accessories_block p.product_desc {
color: gray;
font-size: 1em;
display: inline-block;
height: auto;
margin: 0;
}

/* Special style for block accessories in center column (product page) */
#center_column .products_block.accessories_block .block_content{ background:none; }
#center_column div.products_block.accessories_block p.product_desc { height:6.5em; }
#center_column .products_block.accessories_block .block_content li{ background:none; }
#center_column .products_block.accessories_block .block_content li a.product_image, #center_column .products_block.accessories_block .block_content li a.product_description { border-right:1px solid #d0d3d8; font-weight:bolder; }
#center_column .products_block.accessories_block .block_content li.last_item a.product_image{ border:none; }


#10
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262888760:

ajoute ce code depuis /* Produits Phares*/ (ligne 1051) jusqua /* Block tags */(ligne 1232) dans le fichier global.css de ton template ;)
il y a un petit souci d affichage sous Ie 6 je travail dessus, je te posterais les modif ;)
sur celui la j ai modifier quelques lignes car celui de atch ne rentrais pas dans un 3 colonne

/*  Produits Phares*/

/* Special style for block products in center column */
#center_column .products_block {
border-style: none;
float: left;
width: 555px;
}

#center_column .products_block {
color: #595a5e;
}




#center_column .products_block .block_content {
background-image: none;
background-color: #fff;
padding: 0;
}

#center_column .products_block ul li:hover {
background-color: #EDEDDF;

}

#center_column .products_block ul li {
background-color: #fff;
border-top:3px solid #C99716;
border-left:1px solid #a5a5a5;
border-right:1px solid #a5a5a5;
border-bottom:1px solid #a5a5a5;
margin-top: 10px;
clear: none;
float: right;
/*width: 250px; IE6 */
width: 250px;
padding:0 2px 5px;
margin-left: 4px;
margin-right: 3px;
height: 150px;
}


#center_column .products_block li.last_item_of_line {
margin-right: 2px;
display: block;
float: left;
}

#center_column .products_block li.first_item_of_line {
display: block;
float: left;
clear:both;
}

#center_column .products_block li.last_line {
}

#center_column .products_block p, #center_column .products_block h5 {
}

#center_column div.products_block h5 {
display: block;
height: auto;
font-weight: bold;
font-size: 1em;
text-align: left;
border-left-style: solid;
border-left-width: 0;
padding-top: 5px;
margin: 0 0 5px 4px;
}

#center_column div.products_block h5 a {
color: #424243;
font-size: 1.1em;
}

#center_column div.products_block ul li p {
padding: 0;
display: block;
margin: 0;
float: right;
}

#center_column div.products_block p.product_desc {
color: #595a5e;
width: 140px;
display: block;
height: 50px;
overflow: hidden;
margin-bottom: 4px;
padding-bottom: 0;
z-index: 1;
}

#center_column div.products_block a.product_image {
display: inline;
background-color: transparent;
width: 110px;
height: 110px;
margin: 0;
float: left;
}

#center_column div.products_block a.product_image img {
margin: 0;
display: inline;
margin-top: -60px;
}

#center_column div.products_block p.product_desc, #center_column div.products_block h5 {
margin-right:0.6em;
text-align: right;
}

#center_column div.products_block ul li p.product_desc a {
font-weight: normal;
font-style: normal;
display: block;
margin-left: 30px;
width: 110px;
}

#center_column .products_block span.price {
text-align: center;
color: #C99716;
display: block;
font-size: 12px;
direction: ltr;
line-height: 17px;
border-width: 1px;
border-style: none;
margin: 2px 1px 2px 0;
margin-top: -20px;
}

#center_column .products_block a.button {
margin: 0.1em 1px 0.2em 0;
margin-left: 130px;
margin-top : 90px;
}

#center_column .products_block a.exclusive {
display: block;
margin-right: 0;
margin-left: 130px;
}

#center_column .products_block span.exclusive {
margin: 0.5em auto 0.5em 0;
display: none;
}

/* Special style for block accessories in center column (product page) */

#center_column .products_block.accessories_block .block_content {
background-image: none;
font-size: 1em;
border-bottom: 1px solid #85949d;
display: inline-block;
height: auto;
vertical-align: top;
}

#center_column div.products_block.accessories_block p.product_desc {
color: gray;
font-size: 1em;
display: inline-block;
height: auto;
margin: 0;
}

/* Special style for block accessories in center column (product page) */
#center_column .products_block.accessories_block .block_content{ background:none; }
#center_column div.products_block.accessories_block p.product_desc { height:6.5em; }
#center_column .products_block.accessories_block .block_content li{ background:none; }
#center_column .products_block.accessories_block .block_content li a.product_image, #center_column .products_block.accessories_block .block_content li a.product_description { border-right:1px solid #d0d3d8; font-weight:bolder; }
#center_column .products_block.accessories_block .block_content li.last_item a.product_image{ border:none; }


un grand merci a toi et ta générosité
je te tiens au jus dès demain

#11
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262890517:

From 1262888760:

ajoute ce code depuis /* Produits Phares*/ (ligne 1051) jusqua /* Block tags */(ligne 1232) dans le fichier global.css de ton template ;)
il y a un petit souci d affichage sous Ie 6 je travail dessus, je te posterais les modif ;)
sur celui la j ai modifier quelques lignes car celui de atch ne rentrais pas dans un 3 colonne

/*  Produits Phares*/

/* Special style for block products in center column */
#center_column .products_block {
border-style: none;
float: left;
width: 555px;
}

#center_column .products_block {
color: #595a5e;
}




#center_column .products_block .block_content {
background-image: none;
background-color: #fff;
padding: 0;
}

#center_column .products_block ul li:hover {
background-color: #EDEDDF;

}

#center_column .products_block ul li {
background-color: #fff;
border-top:3px solid #C99716;
border-left:1px solid #a5a5a5;
border-right:1px solid #a5a5a5;
border-bottom:1px solid #a5a5a5;
margin-top: 10px;
clear: none;
float: right;
/*width: 250px; IE6 */
width: 250px;
padding:0 2px 5px;
margin-left: 4px;
margin-right: 3px;
height: 150px;
}


#center_column .products_block li.last_item_of_line {
margin-right: 2px;
display: block;
float: left;
}

#center_column .products_block li.first_item_of_line {
display: block;
float: left;
clear:both;
}

#center_column .products_block li.last_line {
}

#center_column .products_block p, #center_column .products_block h5 {
}

#center_column div.products_block h5 {
display: block;
height: auto;
font-weight: bold;
font-size: 1em;
text-align: left;
border-left-style: solid;
border-left-width: 0;
padding-top: 5px;
margin: 0 0 5px 4px;
}

#center_column div.products_block h5 a {
color: #424243;
font-size: 1.1em;
}

#center_column div.products_block ul li p {
padding: 0;
display: block;
margin: 0;
float: right;
}

#center_column div.products_block p.product_desc {
color: #595a5e;
width: 140px;
display: block;
height: 50px;
overflow: hidden;
margin-bottom: 4px;
padding-bottom: 0;
z-index: 1;
}

#center_column div.products_block a.product_image {
display: inline;
background-color: transparent;
width: 110px;
height: 110px;
margin: 0;
float: left;
}

#center_column div.products_block a.product_image img {
margin: 0;
display: inline;
margin-top: -60px;
}

#center_column div.products_block p.product_desc, #center_column div.products_block h5 {
margin-right:0.6em;
text-align: right;
}

#center_column div.products_block ul li p.product_desc a {
font-weight: normal;
font-style: normal;
display: block;
margin-left: 30px;
width: 110px;
}

#center_column .products_block span.price {
text-align: center;
color: #C99716;
display: block;
font-size: 12px;
direction: ltr;
line-height: 17px;
border-width: 1px;
border-style: none;
margin: 2px 1px 2px 0;
margin-top: -20px;
}

#center_column .products_block a.button {
margin: 0.1em 1px 0.2em 0;
margin-left: 130px;
margin-top : 90px;
}

#center_column .products_block a.exclusive {
display: block;
margin-right: 0;
margin-left: 130px;
}

#center_column .products_block span.exclusive {
margin: 0.5em auto 0.5em 0;
display: none;
}

/* Special style for block accessories in center column (product page) */

#center_column .products_block.accessories_block .block_content {
background-image: none;
font-size: 1em;
border-bottom: 1px solid #85949d;
display: inline-block;
height: auto;
vertical-align: top;
}

#center_column div.products_block.accessories_block p.product_desc {
color: gray;
font-size: 1em;
display: inline-block;
height: auto;
margin: 0;
}

/* Special style for block accessories in center column (product page) */
#center_column .products_block.accessories_block .block_content{ background:none; }
#center_column div.products_block.accessories_block p.product_desc { height:6.5em; }
#center_column .products_block.accessories_block .block_content li{ background:none; }
#center_column .products_block.accessories_block .block_content li a.product_image, #center_column .products_block.accessories_block .block_content li a.product_description { border-right:1px solid #d0d3d8; font-weight:bolder; }
#center_column .products_block.accessories_block .block_content li.last_item a.product_image{ border:none; }


un grand merci a toi et ta générosité
je te tiens au jus dès demain


Bonjour,
aie, aie aie!!!! j'ai bon chercher dans le global.css du template je ne trouve ni le début ni la fin d'ou je dois insérer le code faut dire que je suis pas bien doué!! ;-)

#12
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
recherche la ligne de fin est de début que je t ai donné avec Ctrl+f dans ton éditeur pour les localiser ensuite tu remplace la partie qui se trouve entre les 2 lignes par ce que je ta donné
utilise notepad sinon pour les localiser avec les lignes que je t ai donné (tu dois avoir un petit écart quand même avec l original car j ai ajouter du code sur d autre category.

#13
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262951958:

recherche la ligne de fin est de début que je t ai donné avec Ctrl+f dans ton éditeur pour les localiser ensuite tu remplace la partie qui se trouve entre les 2 lignes par ce que je ta donné
utilise notepad sinon pour les localiser avec les lignes que je t ai donné (tu dois avoir un petit écart quand même avec l original car j ai ajouter du code sur d autre category.


yes! yes! yeeeeeeeesssssssssss!!!!
global css ouvert avec word pad et ligne trouvé facilement.

un enorme merci pour ton coup de main

#14
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
de rien c est la premiere foie que je rend heureux quelqu un ici a mon tour :)
je te fait suivre mes fichier pour IE6 dés que c fait

#15
gribouillon

    PrestaShop Apprentice

  • Members
  • PipPip
  • 39 posts

From 1262973824:

de rien c est la premiere foie que je rend heureux quelqu un ici a mon tour :)
je te fait suivre mes fichier pour IE6 dés que c fait


Ok!!

#16
vestax

    PrestaShop Apprentice

  • Members
  • PipPip
  • 328 posts
Je voulez juste dire un grand merci pour ce code, je galère depuis pas mâle de mois pour pouvoir aboutir a voir mes produits phares sur 2 colonnes, a ce jours c'est chose faite.

encore merci c'est vraiment cool

#17
vestax

    PrestaShop Apprentice

  • Members
  • PipPip
  • 328 posts
Bonjour a tous,

Je voulez juste un renseignement car je viens de voir que en bas des produits phares, il y avez une grande marge, c'est possible de la mettre moins large ?

Cordialement

#18
donaldlloyds

    PrestaShop Apprentice

  • Members
  • PipPip
  • 273 posts
un lien vers ton site ?

#19
jazz009

    PrestaShop Newbie

  • Members
  • Pip
  • 19 posts
Merci pour le code donaldlloyds
As tu reussi a resoudre le probleme avec IE6 ?
Les boutons d'achats sont decales.
Faut il creer une feuilles de style speciale IE6 ?
merci
http://www.airsoftforall.com
Prestashop 1.2.5 + Modules: addstuff - menulavalamp - carouselnc - freeblock - shippingestimate
Thank you to all the developers

#20
vestax

    PrestaShop Apprentice

  • Members
  • PipPip
  • 328 posts
Bonjour,

A tu été voir sur ma boutique le petit soucis au quel javez fait allusion en bas des produits phares la marge qui ne sert a rien est prend de la place ?

Cordialement