Jump to content

[ global.css ] [RESOLU]->arriere plan!!![RESOLU]->icones 32x32!!![PAS RESOLU]Probleme de marge!!!

C2LABOMB
 Share

Recommended Posts

C2LABOMB Newbie

C2LABOMB

Posted
Posted

Bien le bonjour a vous.
je debarque de oscommerce et je decouvre prestashop!

voila ma question:
dans le fichier global.css
ou se trouve la ligne permetant de changer l'arriére plan.
un numero de ligne ou une indication du type /* Menu AJOUT*/ ou /* Useful */ m'aiderais bien
Par exemple sur image ci-jointe
comment changer ce qui reste de blanc en noir???
est il possible d'inserer une image de fond???

j'ai deja lu sur ce forum ce qui se trouve a propos du background.

En attente de vos réponse
Cordialement
C2LABOMB

4916_XByTTZfGR7mPmo6jqFXM_t

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

Merci Atch pour ta réponse,
mais sa ne m'eclaire pas plus.
Pour modifier mon global.css j utilise dreamweaver.
ou firebug OK...

Ensuite je lis tes 2 sites
que je regarde deja depuis plusieurs annnée...

ma question etais simple 

ou se trouve la ligne permetant de changer l’arriére plan.
un numero de ligne ou une indication du type /* Menu AJOUT*/ ou /* Useful */ m’aiderais bien



il y a bien un developpeur de theme
dans les parage qui pouras me répondre.
la sa ressemble a débrouille toi...
je pense que cette ligne peut intéresser toute la communauté NON....

En attente de vos réponse
Cordialement
C2LABOMB

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

pour modifier background

dans le fichier global.css
a la ligne 18

body {
   background: #87ceeb url('../img/infoboxcontentsbg.jpg') no-repeat; background-position: top center; background-attachment:fixed;
   font-size: 11px;
   font-family: Verdana, Arial, Helvetica, Sans-Serif;
   color: #3F96CD;
   text-align:center;
   margin-top: 12px; 
}



modifier la ligne 

background: #87ceeb url('../img/infoboxcontentsbg.jpg') no-repeat; background-position: top center; background-attachment:fixed;

sachant que

background: #87ceeb   ###->>>egal couleur
url('../img/infoboxcontentsbg.jpg') ###->>>Url de l'image
no-repeat  ###->>> ne pas repeter image
background-position: top center  ###->>>position de l'image au centre en haut
background-attachment:fixed ###---> je seche un peu!!!



une réponse de ce type me plairais bien
a bon entendeur
En attente de vos réponse
Cordialement
C2LABOMB

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

dans le fichier global.css

vers la ligne 216

dans la rubrique

/* global layout */



on trouve ceci

#page { 
   width: 980px;
   margin: 0 auto 2px auto;
   text-align:left;
   background-color: #FFFFFF;
}
h1#logo {
   float: center;
   width: 100%;
   margin-top: 0px;
   padding-left: 0px;
   background-color: #055C77;
}

#header {
background : #055C77 url(../img/header.jpg) no-repeat center top; 
   float: left;
   height:109px;
   width: 99%;
   text-align: right;
   margin: 0 0 0 0px;
}
#left_column, #center_column, #right_column {
   float:left;
}
#left_column {
   clear:left;
   width:190px;
   margin-left: 3px;
padding-right: 12px;
}
#center_column {
   width: 566px;
   margin: 0 0 30px 0;
}
#right_column {
   width: 190px;
   padding-left: 15px;
}

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

Merci Esta
Voici une premiere réponse
donc pour la couleur de l'arriere plan de vos page
modifier cette ligne

dans le fichier global.css

vers la ligne 216

dans la rubrique 

/* global layout */



#page { 
   width: 980px;
   margin: 0 auto 2px auto;
   text-align:left;
   background-color: #FFFFFF;


indiquer la couleur ici
  background-color: #FFFFFF;  ###->>> #FFFFFF etant blanc



Voila Esta nous a tous eclairé
j'espere que cette réponse vous servira

Pieces jointes AVANT et APRES

5320_B4brv3BHobUb1zk7ZId7_t

5321_yO0VFETuLGTQrA6XtCH5_t

Link to comment
Share on other sites
  • 2 weeks later...
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

je reviens a la charge avec une question!!!

-Comment redimensionner les icones sur la photo si jointe
-j'ai lu que c'etais pas modifiable le $HOOK_TOP
-y as t'il un moyen de le faire par global.css

-Peut on les remplacer par des bouttons???

en attente de vos réponse
Cordialement
C2LABOMB

5314_qLn87NwnIlHx393kYeti_t

Link to comment
Share on other sites
mandrake Explorer

mandrake

Posted
Posted

Bonjour C2LABALLE,

Tu peux modifier la taille des icônes ou les remplacer par des boutons en allant dans prestashop 1.105>themes>prestashop>img>icon et tu vas dans un éditeur graphique ou dans photofiltre (gratuit et simple)où tu redimensionnes les images.
Tu peux les remplacer par des boutons que tu renommeras avec le même nom que l'image que tu remplaceras au même format (.gif si l'image à la base est en gif, etc...)et que tu replaceras dans le dossier icon après avoir supprimé les images d'origine.
Voilà!

Cordialement,

Mandrake.

PS: poste un message à la fois, sinon tout le monde t'enverra aux oubliettes ;-)
Perso j'ai fréquenté les coquibus à Corbeille-Essonne...spécial dédicace...

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

ok je viens d'essayé
voila ce que sa donne.

contact



aucune trace de l'icone???

a si en faite

#header_link_contact a {global.css (ligne 787)
background-image:url(../img/icon/contact.gif);
}



c surement ça

#header_links a {global.css (ligne 773)
background-color:transparent;
background-position:center top;
background-repeat:no-repeat;
color:#595A5E;
display:block;
height:15px;
padding-top:19px;
text-align:center;
text-decoration:none;
}

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

Mon icone est toujours coupé
voila ce qu'il y a dans global.css

#header_user #your_account a {global.css (ligne 849)
background-image:url(../img/icon/my-account.gif);
}
#header_user #shopping_cart a, #header_user #your_account a {global.css (ligne 840)
background-position:left top;
background-repeat:no-repeat;
height:20px;
padding:2px 0 4px 26px;
text-decoration:none;
}
a {global.css (ligne 142)
color:#5D717E;
outline-color:-moz-use-text-color;
outline-style:none;
outline-width:medium;
text-decoration:underline;
}
* {global.css (ligne 11)
margin:0;
padding:0;
}
Hérité deli#your_account
#header_user #shopping_cart, #header_user #your_account {global.css (ligne 839)
font-size:0.9em;
}
#header_user li {global.css (ligne 833)
line-height:2em;
white-space:nowrap;
}
Hérité deul#header_nav
#header ul {global.css (ligne 688)
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
Hérité dediv#header_user
#header #header_user {global.css (ligne 824)
text-align:right;
}
Hérité dediv#header
#header {global.css (ligne 192)
text-align:right;
}
Hérité dediv#page
#page {global.css (ligne 182)
text-align:left;
}
Hérité debody#index
body {global.css (ligne 16)
color:#5D717E;
font-family:Verdana,Arial,Helvetica,Sans-Serif;
font-size:11px;
text-align:center;



peut etre bordure et marge

* {global.css (ligne 11)
margin:0;
padding:0;
}

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

bon voila aprés avoir tout essayé
changer cette ligne pour agrandir vos icones

#header_user #shopping_cart a, #header_user #your_account a {global.css (ligne 840)
background-position:left top;
background-repeat:no-repeat;
height:20px;
padding:2px 0 4px 26px;
text-decoration:none;
}



changé

height:20px;
padding:2px 0 4px 26px;



par

height:32px;
padding: 2px 0 4px 26px;



et le tour est joué

Merci Mandrake
pour ton aide
et n'oublié pas
sous firefox, j'utilises firebug

5342_qniJS7KsPotTrkbf55h7_t

5343_mmkAQlToN1JRzcpaVAA9_t

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

CHANGER VOS ICONES 16 x 16 PAR DES ICONES 32 x 32

aprés quelques heure j'ai réglé le probleme pour internet explorer

marche a suivre
rendez vous vers la ligne 833 de votre global.css

#header_user li {
   float: right;
   line-height: 2em;
   margin-left: 0.5em;
   white-space: nowrap;



remplacer 2em par 6em

#header_user li {
   float: right;
   line-height: 6em;
   margin-left: 0.5em;
   white-space: nowrap;

simple
line-height: 2em;
par
line-height: 6em;



ensuite juste en dessous ligne 840

#header_user #shopping_cart a, #header_user #your_account a {
   background-repeat: no-repeat;
   background-position: top left;
   padding: 2px 0 4px 26px;
   height: 20px;
   text-decoration: none;
}



remplacer la ligne
padding: 2px 0 4px 26px;
par
padding: 20px 0 20px 32px;

#header_user #shopping_cart a, #header_user #your_account a {
   background-repeat: no-repeat;
   background-position: top left;
   padding: 20px 0 20px 32px;
   height: 20px;
   text-decoration: none;
}

simple
padding: 2px 0 4px 26px;
par
padding: 20px 0 20px 32px;



Voila au boulot maintenant
je veux voir des icones
32 x 32 sur toutes les boutiques prestashop

A bon entendeur
See Ya...

ci-joint Avant Aprés

5349_7Q5aVYiFEM1GdhFZCF2L_t

5351_OMvzAIqgHmgT1aQCedvi_t

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

un petit peu plus compliqué
contact plan du site favoris

chercher vers la ligne 773 

#header_links a {
   display: block;
   height: 15px;
   color: #595a5e;
   padding-top: 19px;
   text-align: center;
   text-decoration: none;
   background-repeat: no-repeat;
   background-position: top center;
   background-color: transparent;
}



modifier

padding-top: 19px;

par

padding-top: 28px;

Ensuite rendez vous vers la ligne 824

#header #header_user {
   width: 99%;
   text-align: right;
   clear: left;
   margin:0.6em 0.6em 0 0;
}



modifier

margin:0.6em 0.6em 0 0;

par

margin:0em 0em 0 0;

on est obligé de remonté un peu
bienvenue identifier vous
mon compte
mon panier

ensuite
pour les drapauds des pays
modifier juste l'icones c bon
voila tout est dans l'ordre

a part que je travaille de droite a gauche
a bon entendeur
See Ya

5358_EW1IWEmL2JpUcCr60nJj_t

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

j'ai egalement
le probleme sur un Block pourtant le code
dans le global.css est bon

/* block myaccount */
   background: #000 url('../img/block_bg_myaccount.jpg') repeat-x bottom left;
   border-left: 2px solid #00ffff;
   border-right: 2px solid #00ffff;
}
.account_input {
   margin-left: 0px;
   width:15em;
}


   border-left: 2px solid #00ffff;
   border-right: 2px solid #00ffff;


c'est bien indiqué
               border-left: 2px solid #00ffff;
   border-right: 2px solid #00ffff;
pourquoi les barres n'apparaissent pas???


piece jointe regarder BLOCK MON COMPTE

5500_73bFTc2BBwYRqUsEP4Vn_t

5501_cxwKyJ89pP1ms6l0KkgB_t

Link to comment
Share on other sites
C2LABOMB Newbie

C2LABOMB

Posted
  • Author
Posted

je vous donne le code complet
du block

/* block myaccount */
#left_column div.myaccount, #right_column div.myaccount { background: #000 url('../img/block_footer_myaccount.jpg') no-repeat bottom left; }
div.myaccount h4 { background: #000 url('../img/block_header_myaccount.jpg') no-repeat top left; }
div.myaccount h4 a, div.myaccount h4 { color: #00ffff; }
div.myaccount, div.myaccount a { color: #E0FFFF; }
div.myaccount ul.bullet { margin-top: 0.6em; }
div.myaccount ul.bullet li { background-image: url('../img/bullet_myaccount.gif'); }
div.myaccount ul.bullet .icon { display: none; }
div.myaccount p.logout { padding: 0.3em 0 0.3em 2em; }
div.myaccount p.logout, div.myaccount p.logout a { color: #dd2a81; }
div.myaccount p.logout a { text-decoration: underline; }
div.myaccount p.logout a:hover { text-decoration: none; }
div.myaccount .block_content {
   background: #000 url('../img/block_bg_myaccount.jpg') repeat-x bottom left;
   border-left: 2px solid #00ffff;
   border-right: 2px solid #00ffff;
}
.account_input {
   margin-left: 0px;
   width:15em;
}

Link to comment
Share on other sites
  • 3 weeks later...
Guest

Guest

Posted
Posted

wesh wesh, C 2 LA BALLE le rap de l'essonne ? passe écouter le rap du 45 ^^ (le site underground dans ma signature) ! On est voisin khei, c'est la miff' ;)

Sinon pour ton problème de marge, tes réglage à faire sont au niveau du /* global layout */

essaye avec ça :

/* global layout */
#page {
   width: 980px;
   margin: 0 auto 2px auto;
   text-align:left;
}
h1#logo {
   float: left;
   width: 29%;
   margin-top:0.5em;
}
#header {
   float: left;
   height:100px;
   width: 71%;
   text-align: right;
}
#left_column, #center_column, #right_column {
   float:left;
}
#left_column {
   clear:left;
   width:190px;
   padding-right: 15px;
}
#center_column {
   width: 556px;
   margin: 0 0 30px 0;
}
#right_column {
   width: 190px;
   padding-left: 15px;
}

Link to comment
Share on other sites
  • 2 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...