Jump to content

Recommended Posts

Bonjour,

j'utilise le theme par défault de presta 1.6, et je souhait le modifier.

 

J'ai donc crée une page cms de test et cela s'affiche très bien.

 

Le souci arrive quand je met mon code dans l'éditeur de page d'accueil, les images redeviennent en 1000px (au lieu de s'adapter au site) l'affichage n'est plus comme ma page de test cms.

 

Il doit avoir un souci avec la home. quelqu'un peut-il m'aider?

 

Merci pour vos conseils précieux.

 

Share this post


Link to post
Share on other sites

Bonjour,

 

Idéalement, avez-vous une page en ligne pour tester le souci ? 

Sur la largeur des images, il y a la possibilité d'ajouter une classe pour régler le souci :

<img src="/votreImage.jpg" class="img-responsive" />

La classe img-responsive permet de définir la largeur maximum des images (via le framework CSS bootstrapCSS).

Share this post


Link to post
Share on other sites

Bonjour,

 

Idéalement, avez-vous une page en ligne pour tester le souci ? 

Sur la largeur des images, il y a la possibilité d'ajouter une classe pour régler le souci :

<img src="/votreImage.jpg" class="img-responsive" />

La classe img-responsive permet de définir la largeur maximum des images (via le framework CSS bootstrapCSS).

Merci pour ta réponse.

voici ce que j'ai pour l'image:

<img src="https:mon-image" alt="9f341869de89065a18f2828ebe0da7fb0dc057f4" width="1000" height="1000" /></a>

Mais sur une page test cela s'affiche très bien (voir mp que je t'ai envoyé)

D'ou ma question

Share this post


Link to post
Share on other sites

Et bien sur les pages CMS, vous avez cette propriété CSS qui fait que les images sont réduites :

#cms #center_column img {
    margin: 4px 0 17px;
    max-width: 100%;
    height: auto;
}

En clair, toutes les images dans des pages CMS auront pour taille maximum 100% du conteneur.

 

Soit vous ajoutez la classe CSS img-responsive à chaque image de la page, soit vous ajoutez la propriété CSS dans votre fichier global.css :

#index #columns img {
    max-width: 100%;
    height: auto;
}

Share this post


Link to post
Share on other sites

 

Et bien sur les pages CMS, vous avez cette propriété CSS qui fait que les images sont réduites :

#cms #center_column img {
    margin: 4px 0 17px;
    max-width: 100%;
    height: auto;
}

En clair, toutes les images dans des pages CMS auront pour taille maximum 100% du conteneur.

 

Soit vous ajoutez la classe CSS img-responsive à chaque image de la page, soit vous ajoutez la propriété CSS dans votre fichier global.css :

#index #columns img {
    max-width: 100%;
    height: auto;
}

 

J'ai donc testé en modifiant le golbal, c'est quand même mieux! un grand merci pour ton aide.

 

Il reste que l'affichage ne se fait pas vraiment pareil, car des espaces ne sont plus là par exemple.

Car les boutons touchent les images par exemple (contrairement à ma page de test),

Share this post


Link to post
Share on other sites

Vous pouvez juste ajouter la ligne :

margin: 4px 0 17px;

Dans les lignes que vous avez ajoutées sur le global CSS, ça devrait le faire.

Super! c'est ok.

merci pour ton aide

Share this post


Link to post
Share on other sites

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

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More