osCommerce France : Accueil Forum Portail osCommerce France Réponses aux questions Foire aux contributions

Bienvenue invité ( Connexion | Inscription )

 
Reply to this topicStart new topic
> Augmenter la largeur des box
gaya_102
posté 30 Dec 2010, 21:45
Message #1


Ceinture jaune OSC
Icône de groupe

Groupe : Membres
Messages : 70
Inscrit : 22-November 10
Lieu : bédarieux
Membre no 28354



Bonjour

voila je suis en train de lire la FAQ
Je voudrais augmenter la largeur des box
Il en parle la
http://www.oscommerce-fr.info/faq/qa_info.php?qID=56

Le problème c'est que je ne trouve pas du tout la ligne ou faire la modification. J'ai vu que la page date de 2004. Ca a peut etre changé. ESt ce que quelqu'un sais ou c'est maintenant

Merci de votre aide
Go to the top of the page
 
chti_poupon
posté 31 Dec 2010, 09:52
Message #2


Ceinture noire OSC
Icône de groupe

Groupe : TechDev
Messages : 2642
Inscrit : 9-September 08
Lieu : Douai
Membre no 22915



Bonjour !
into my version it's in english:
Code
// customization for the design layout
  define('BOX_WIDTH', 125); // how wide the boxes should be in pixels (default: 125)

but into the same place !
Enjoy !
Chti poupon
PS : version OsC ???
Go to the top of the page
 
gaya_102
posté 31 Dec 2010, 12:28
Message #3


Ceinture jaune OSC
Icône de groupe

Groupe : Membres
Messages : 70
Inscrit : 22-November 10
Lieu : bédarieux
Membre no 28354



Merci pour ta réponse. Par contre c'est dans quel fichier que je dois faire la modification.

J'ai la version 2.3

Merci de ton aide

Ce message a été modifié par gaya_102 - 31 Dec 2010, 12:35.
Go to the top of the page
 
chti_poupon
posté 31 Dec 2010, 18:06
Message #4


Ceinture noire OSC
Icône de groupe

Groupe : TechDev
Messages : 2642
Inscrit : 9-September 08
Lieu : Douai
Membre no 22915



Merci de transférer/reposer la question dans la partie MS2.3
Ma réponse est pour MS 2.2.
Chti poupon
Go to the top of the page
 
gaya_102
posté 1 Jan 2011, 09:14
Message #5


Ceinture jaune OSC
Icône de groupe

Groupe : Membres
Messages : 70
Inscrit : 22-November 10
Lieu : bédarieux
Membre no 28354



ok merci quand même smile.gif
Go to the top of the page
 
FoxP2
posté 2 Jan 2011, 17:50
Message #6


Ceinture marron OSC
Icône de groupe

Groupe : Modérateurs
Messages : 1665
Inscrit : 3-June 09
Membre no 25501



hyper simple à effectuer.
lors de la première mouture, harald avait rigidifié un peu trop le template à mon goût. donc la suggestion que je lui ai remonté dans le bug report a été mise en place dans la version release.

c'est donc la classe catalog/includes/classes/osc_template.php qui gère les dimensions de ta boutique, et en particulier ces 3 paramètres :
Code
    var $_grid_container_width = 24;
    var $_grid_content_width = 16;
    var $_grid_column_width = 4;

le premier définie le nombre de colonne (*30px + 5px de margin à gauche et à droite) pour la grille.(960px en tout)
le deuxième définie le nombre de colonne pour le contenu entre la colonne de gauche et de droite (630px)
le troisième définie le nombre de colonne pour la colonne de gauche et de droite. (chacune ayant une largeur de 150px)

en élargissant $_grid_column_width à 5, tes colonnes passent à 190px, mais il te faudra d'autant diminuer la taille du conteneur central, donc $_grid_content_width à 14 afin que 5*2+14=24 (le conteneur '$_grid_container_width)

maintenant, si tu te trouves un peu trop à l'étroit dans ta boutique, tu peux changer le code avec celui-ci (1200px de large sans margin) :
Code
.container_24{margin-left:auto;margin-right:auto;width:1200px}.alpha{margin-left:0!important}.omega{margin-right:0!important}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.g
rid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16,.grid_17,.gr
id_18,.grid_19,.grid_20,.grid_21,.grid_22,.grid_23,.grid_24{display:inline;float:left;position:relative;margin-left:.0px;margin-right:.0px}.container_24 .grid_1{width:50px}.container_24 .grid_2{width:100px}.container_24 .grid_3{width:150px}.container_24 .grid_4{width:200px}.container_24 .grid_5{width:250px}.container_24 .grid_6{width:300px}.container_24 .grid_7{width:350px}.container_24 .grid_8{width:400px}.container_24 .grid_9{width:450px}.container_24 .grid_10{width:500px}.container_24 .grid_11{width:550px}.container_24 .grid_12{width:600px}.container_24 .grid_13{width:650px}.container_24 .grid_14{width:700px}.container_24 .grid_15{width:750px}.container_24 .grid_16{width:800px}.container_24 .grid_17{width:850px}.container_24 .grid_18{width:900px}.container_24 .grid_19{width:950px}.container_24 .grid_20{width:1000px}.container_24 .grid_21{width:1050px}.container_24 .grid_22{width:1100px}.container_24 .grid_23{width:1150px}.container_24 .grid_24{width:1200px}.container_24 .prefix_1{padding-left:50px}.container_24 .prefix_2{padding-left:100px}.container_24 .prefix_3{padding-left:150px}.container_24 .prefix_4{padding-left:200px}.container_24 .prefix_5{padding-left:250px}.container_24 .prefix_6{padding-left:300px}.container_24 .prefix_7{padding-left:350px}.container_24 .prefix_8{padding-left:400px}.container_24 .prefix_9{padding-left:450px}.container_24 .prefix_10{padding-left:500px}.container_24 .prefix_11{padding-left:550px}.container_24 .prefix_12{padding-left:600px}.container_24 .prefix_13{padding-left:650px}.container_24 .prefix_14{padding-left:700px}.container_24 .prefix_15{padding-left:750px}.container_24 .prefix_16{padding-left:800px}.container_24 .prefix_17{padding-left:850px}.container_24 .prefix_18{padding-left:900px}.container_24 .prefix_19{padding-left:950px}.container_24 .prefix_20{padding-left:1000px}.container_24 .prefix_21{padding-left:1050px}.container_24 .prefix_22{padding-left:1100px}.container_24 .prefix_23{padding-left:1150px}.container_24 .suffix_1{padding-right:50px}.container_24 .suffix_2{padding-right:100px}.container_24 .suffix_3{padding-right:150px}.container_24 .suffix_4{padding-right:200px}.container_24 .suffix_5{padding-right:250px}.container_24 .suffix_6{padding-right:300px}.container_24 .suffix_7{padding-right:350px}.container_24 .suffix_8{padding-right:400px}.container_24 .suffix_9{padding-right:450px}.container_24 .suffix_10{padding-right:500px}.container_24 .suffix_11{padding-right:550px}.container_24 .suffix_12{padding-right:600px}.container_24 .suffix_13{padding-right:650px}.container_24 .suffix_14{padding-right:700px}.container_24 .suffix_15{padding-right:750px}.container_24 .suffix_16{padding-right:800px}.container_24 .suffix_17{padding-right:850px}.container_24 .suffix_18{padding-right:900px}.container_24 .suffix_19{padding-right:950px}.container_24 .suffix_20{padding-right:1000px}.container_24 .suffix_21{padding-right:1050px}.container_24 .suffix_22{padding-right:1100px}.container_24 .suffix_23{padding-right:1150px}.container_24 .push_1{left:50px}.container_24 .push_2{left:100px}.container_24 .push_3{left:150px}.container_24 .push_4{left:200px}.container_24 .push_5{left:250px}.container_24 .push_6{left:300px}.container_24 .push_7{left:350px}.container_24 .push_8{left:400px}.container_24 .push_9{left:450px}.container_24 .push_10{left:500px}.container_24 .push_11{left:550px}.container_24 .push_12{left:600px}.container_24 .push_13{left:650px}.container_24 .push_14{left:700px}.container_24 .push_15{left:750px}.container_24 .push_16{left:800px}.container_24 .push_17{left:850px}.container_24 .push_18{left:900px}.container_24 .push_19{left:950px}.container_24 .push_20{left:1000px}.container_24 .push_21{left:1050px}.container_24 .push_22{left:1100px}.container_24 .push_23{left:1150px}.container_24 .pull_1{right:50px}.container_24 .pull_2{right:100px}.container_24 .pull_3{right:150px}.container_24 .pull_4{right:200px}.container_24 .pull_5{right:250px}.container_24 .pull_6{right:300px}.container_24 .pull_7{right:350px}.container_24 .pull_8{right:400px}.container_24 .pull_9{right:450px}.container_24 .pull_10{right:500px}.container_24 .pull_11{right:550px}.container_24 .pull_12{right:600px}.container_24 .pull_13{right:650px}.container_24 .pull_14{right:700px}.container_24 .pull_15{right:750px}.container_24 .pull_16{right:800px}.container_24 .pull_17{right:850px}.container_24 .pull_18{right:900px}.container_24 .pull_19{right:950px}.container_24 .pull_20{right:1000px}.container_24 .pull_21{right:1050px}.container_24 .pull_22{right:1100px}.container_24 .pull_23{right:1150px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}


ça remplace le fichier catalog/ext/960gs/960_24_col.css


--------------------


Go to the top of the page
 
gaya_102
posté 2 Jan 2011, 21:15
Message #7


Ceinture jaune OSC
Icône de groupe

Groupe : Membres
Messages : 70
Inscrit : 22-November 10
Lieu : bédarieux
Membre no 28354



Merci de ton aide. Demain j'essayerai.<BR><BR>ESt ce qu'en 1200 ca n'entrainerai pas un scrolling?<BR><BR>
Go to the top of the page
 
tati75
posté 4 Jan 2011, 10:27
Message #8


Ceinture blanche OSC
Icône de groupe

Groupe : Membres
Messages : 6
Inscrit : 4-January 11
Membre no 28668



bonjour à tous,

j'ai fais les modifications de FoxP2 mais comment garder les marges ?
c'est compliqué tout ça car tout est collé ensemble, je voulais aussi mettre une largeur générale de 1000px
mais du coup tout est décallé....
merci pour votre aide

tati75
Go to the top of the page
 
FoxP2
posté 4 Jan 2011, 19:19
Message #9


Ceinture marron OSC
Icône de groupe

Groupe : Modérateurs
Messages : 1665
Inscrit : 3-June 09
Membre no 25501



passez par le layout generator: arrow.gif http://960ls.atomidata.com/
vous entrez vos valeurs
WIDTH (PX / FLUID) : largeur de la boutique.
COLUMNS (#) : nombre de colonne : par défaut, la boutique en a 24 (ça permet plus de précision dans le placement des éléments)
GUTTERS (PX / %) : espace entre chaque colonne (par défaut la boutique est à 5px)
clic sur <>code
votre gabarit est généré automatiquement.
y'a plus qu'a copié coller le code dans le fichier approprié.


dernier point : afin d'avoir des boutiques rapides, il est indispensable de faire maigrir certains fichiers (style .css et javascript)
il existe (entre autre) un programme développé par un mec de chez Yahoo qui s'en charge.
c'est gratos, c'est léger et c'est hyper simple pour s'en servir :
téléchargement : http://www.phpied.com/files/yuicd/ : y'a 3 versions dispo : Linux/Mac/Windows . pas d'installation requise, c'est du green software. dézippage, clic sur l'icone yuicd.exe, on drag and drop les fichiers à compresser. mine de rien, ça peut faire gagner pas mal de ko assez rapidement (et faire la différence avec une boutique similaire qui n'aurait pas mis au régime certaines données transitant sur le net avant d'être mise en cache dans le navigateur de client). Google prend en compte également la vitesse d'un site dans sa façon de classer les résultats.



--------------------


Go to the top of the page
 
med
posté 6 Jan 2011, 15:43
Message #10


Ceinture jaune OSC
Icône de groupe

Groupe : Membres
Messages : 69
Inscrit : 4-March 08
Lieu : Everywhere
Membre no 21032



Citation
passez par le layout generator: arrow.gif http://960ls.atomidata.com/
vous entrez vos valeurs
WIDTH (PX / FLUID) : largeur de la boutique.
COLUMNS (#) : nombre de colonne : par défaut, la boutique en a 24 (ça permet plus de précision dans le placement des éléments)
GUTTERS (PX / %) : espace entre chaque colonne (par défaut la boutique est à 5px)
clic sur <>code
votre gabarit est généré automatiquement.
y'a plus qu'a copié coller le code dans le fichier approprié.


dernier point : afin d'avoir des boutiques rapides, il est indispensable de faire maigrir certains fichiers (style .css et javascript)
il existe (entre autre) un programme développé par un mec de chez Yahoo qui s'en charge.
c'est gratos, c'est léger et c'est hyper simple pour s'en servir :
téléchargement : http://www.phpied.com/files/yuicd/ : y'a 3 versions dispo : Linux/Mac/Windows . pas d'installation requise, c'est du green software. dézippage, clic sur l'icone yuicd.exe, on drag and drop les fichiers à compresser. mine de rien, ça peut faire gagner pas mal de ko assez rapidement (et faire la différence avec une boutique similaire qui n'aurait pas mis au régime certaines données transitant sur le net avant d'être mise en cache dans le navigateur de client). Google prend en compte également la vitesse d'un site dans sa façon de classer les résultats.



Merci beaucoup de partager ces infos TRÈS utiles.
Go to the top of the page
 
gaya_102
posté 11 Jan 2011, 19:16
Message #11


Ceinture jaune OSC
Icône de groupe

Groupe : Membres
Messages : 70
Inscrit : 22-November 10
Lieu : bédarieux
Membre no 28354



Merci pour ses informations car ca marche........... Merci beaucoup
Go to the top of the page
 
BrigitteB
posté 20 Nov 2011, 18:37
Message #12


Ceinture blanche OSC
Icône de groupe

Groupe : Membres
Messages : 7
Inscrit : 20-November 11
Lieu : Bretagne
Membre no 30384



Bonjour,

Je suis allée dans atomidata.com et effectivement c'est très simple, mais dans quel fichier faut-il mettre le code stp ?
Merci ! smile.gif


--------------------
version 2.3
Go to the top of the page
 
FoxP2
posté 22 Nov 2011, 17:52
Message #13


Ceinture marron OSC
Icône de groupe

Groupe : Modérateurs
Messages : 1665
Inscrit : 3-June 09
Membre no 25501



Citation (BrigitteB @ 20 Nov 2011, 18:37) *
Bonjour,

Je suis allée dans atomidata.com et effectivement c'est très simple, mais dans quel fichier faut-il mettre le code stp ?
Merci ! smile.gif


Citation (FoxP2 @ 2 Jan 2011, 17:50) *
.../...

ça remplace le fichier catalog/ext/960gs/960_24_col.css




--------------------


Go to the top of the page
 
BrigitteB
posté 23 Nov 2011, 10:09
Message #14


Ceinture blanche OSC
Icône de groupe

Groupe : Membres
Messages : 7
Inscrit : 20-November 11
Lieu : Bretagne
Membre no 30384



J'avais fini par le trouver ! Mais merci quand même !!! smile.gif


--------------------
version 2.3
Go to the top of the page
 
scientoufik
posté 19 Feb 2012, 19:52
Message #15


Ceinture jaune+ OSC
Icône de groupe

Groupe : Membres
Messages : 81
Inscrit : 16-May 10
Membre no 27574



Citation (tati75 @ 4 Jan 2011, 10:27) *
bonjour à tous,

j'ai fais les modifications de FoxP2 mais comment garder les marges ?
c'est compliqué tout ça car tout est collé ensemble, je voulais aussi mettre une largeur générale de 1000px
mais du coup tout est décallé....
merci pour votre aide

tati75


Bonjour FoxP2,

Peux tu nous en dire un peu plus sur cette astuce stp? Comment ca fonctionne exactement? J'ai essayé avec mon stylesheet.css ca m'a généré un fichier stylesheet-min.css compréssé à 30% ensuite que dois je faire? Je mets ce fichier stylesheet-min.css directement dans le repertoire catalog/ext/960gs/960_24_col.css ? Ne faut il pas le renommer en stylesheet.css avant?
Connais tu un outil pour tester le avant et apres? Merci d'avance.


--------------------
oscommerce-2.2rc1-FR-w3c-3; Customer Add Product 1.4.3; flash_bannersv2_1; HeaderTags_SEO_V_3.2.3; Make An Offer V3.1; new_products_glide - V2; osC-CenterShop v3.0 for MS2; Ultimate_SEO_URLSv22d_10; Unlimited products to manufacturers
Go to the top of the page
 
fscalda
posté 3 Oct 2013, 08:06
Message #16


Ceinture jaune+ OSC
Icône de groupe

Groupe : Membres
Messages : 128
Inscrit : 26-January 06
Lieu : Alès
Membre no 8748



C'est pas gagné pour installer mon design ... concrètement, ça sert à quoi cette histoire de grille pour cette nouvelle version ?

Avec Firefox developpeur web, je tâtonne pour déplacer mes éléments. Si vous avez un moyen rapide d'obtenir pour un 990 px :

30px | 175px | 10px | 558px | 10px | 175px | 30px

Je suis preneur, car le déplacement des boites est super étrange.


--------------------
OSC 2.3.3.1 | superfish_horizontal_navbar | Shipping in cart | generic_box_1.1.1 | modular_seo_header_tags_1.4.6_min | Nivo Slider with admin for OsC 2.3.3 |En cours remplacement de bxGallery and FancyBox avec PhotosetGrid and ColorBox ... pt1 que c'est long ...
Go to the top of the page
 

Reply to this topicStart new topic
1 utilisateur(s) sur ce sujet (1 invité(s) et 0 utilisateur(s) anonyme(s))
0 membre(s) :

 



RSS Version bas débit Nous sommes le : 21st October 2014 - 11:20
Ce site est déclaré auprès de la commision Nationale
de l'Informatique et des Libertés (déclaration n°: 1043896)