Intégrer une image a un endroit précis

3 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Intégrer une image a un endroit précis

Message par Ejayremy Mar 3 Avr 2012 - 13:13

Bonjour,

Désolé du titre approximatif, je n'ai pas trouvé mieux pour expliquer ma demande.
Alors je souhaite intégrer une image + lien à un endroit précis de mon forum. Peut-être via le CSS mais je ne m'y connais pas du tout dans ce langage...

Voici un screen de l'endroit ou j'aimerais intégrer cette image + lien :

Intégrer une image a un endroit précis Captur15
Il faut savoir que j'ai mis une grande marge verticale afin de voir le haut de mon background.

Voila, merci à vous pour votre aide Smile


Dernière édition par Ejayremy le Mar 3 Avr 2012 - 18:44, édité 1 fois
Ejayremy

Ejayremy
Membre habitué

Masculin
Messages : 1038
Inscrit(e) le : 03/02/2006

https://ejayremy.1fr1.net/
Ejayremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Matriochka Mar 3 Avr 2012 - 13:24

Bonjour,

Je pense qu’il n’y aura pas besoin de CSS ni même de toute autre code. Votre image est celle-ci : https://i.servimg.com/u/f41/09/01/05/17/exempl17.jpg

Afin de déplacer l’écran "Game avec Jerem", il va vous falloir passer par un logiciel de retouche. Le CSS ne pourra rien pour vous ici, c’est l’image en elle-même qui doit être modifiée.
avatar

Matriochka
Membre actif

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Ejayremy Mar 3 Avr 2012 - 13:26

Matriochka a écrit:Bonjour,

Je pense qu’il n’y aura pas besoin de CSS ni même de toute autre code. Votre image est celle-ci : https://i.servimg.com/u/f41/09/01/05/17/exempl17.jpg

Afin de déplacer l’écran "Game avec Jerem", il va vous falloir passer par un logiciel de retouche. Le CSS ne pourra rien pour vous ici, c’est l’image en elle-même qui doit être modifiée.
J'y avais pensé mais comment lui ajouter un lien à l'endroit précis (entouré dans mon premier message) ?
Ejayremy

Ejayremy
Membre habitué

Masculin
Messages : 1038
Inscrit(e) le : 03/02/2006

https://ejayremy.1fr1.net/
Ejayremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Matriochka Mar 3 Avr 2012 - 13:27

À ce moment, il faudrait alors détacher votre image (donc uniquement votre écran) en l’insérant sur un fond transparent. Là, et uniquement là, on pourra avoir recours à du CSS pour la positionner comme vous le voulez, et vous pourrez également lui attribuer un lien.

Avez-vous le moyen de faire cette action ?
avatar

Matriochka
Membre actif

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Ejayremy Mar 3 Avr 2012 - 13:33

Je n'ai pas trop compris mais j'ai bien mon image background en fond et j'ai ma petite image PNG que je souhaite insérer dans le cercle rouge de mon premier message.

Il me faudrait juste un code ou je puisse insérer l'url de mon image png + son link sur mon BG si c'est possible.
Ejayremy

Ejayremy
Membre habitué

Masculin
Messages : 1038
Inscrit(e) le : 03/02/2006

https://ejayremy.1fr1.net/
Ejayremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Matriochka Mar 3 Avr 2012 - 13:44

Oups, c’est moi qui n’ai pas compris, en fait. Je pensais que vous vouliez déplacer l’écran sur lequel il est écrit "Game avec Jerem"… J’ai mal lu votre premier message Razz

En phpBB3, c’est possible, mais en phpBB2, ça aurait été mieux, car votre image aurait pu être visible sur toutes les pages de votre forum… Actuellement, avec cette version, vous n’avez pas accès aux templates, donc vous ne pouvez pas vraiment modifier la structure de votre forum. Il aurait fallu aller modifier le header du forum directement.

Là, on peut toujours ajouter votre image en l’intégrant dans le message d’accueil (PA ► Affichage ► Page d’accueil ► Généralités ► Message sur la page d'accueil)… mais elle ne s’affichera que sur cette page :
http://www.ejayremy.fr/forum

Toutes les autres (donc les sujets, la page "Home"), ne l’auront pas…

Je vous donne tout de même l’astuce, au cas où ça vous intéresserait :

Il suffit donc de mettre votre image comme ceci :
Code:
<a href="URL"><img class="headerimg" src="URLIMAGE" /></a>
Là, j’insère une image avec un lien, qui porte le nom de headerimg. Ce nom nous est utile, car il va pouvoir être intégré à votre feuille de styles.

Rendez-vous dans PA ► Affichage ► Couleurs ► Onglet "Feuille de styles CSS", et ajoutez dans la zone de texte :
Code:
.headerimg {
margin-top:**px;
margin-left:**px;
position:absolute;}
Ici, j’ajoute donc quelques lignes de styles à votre image que j’ai appelé headerimg. Je fais en sorte qu’elle puisse être positionnée n’importe où sur votre page avec position:absolute; et je l’insère de manière précise avec margin-top et margin-left, qui me permettent d’ajouter une marge externe en haut et à gauche. Remplacez les étoiles ** par vos valeurs. Notez par ailleurs que celles-ci peuvent être négatives.
avatar

Matriochka
Membre actif

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Adam_sfp Mar 3 Avr 2012 - 13:53

Bonjour

Je me permet une petite insertion Wink

Pour avoir l'image sur toutes les pages vous pouvez collez cette partie du code donnée par Matriochka dans description de site.

Code:
        <a href="URL"><img class="headerimg" src="URLIMAGE" /></a>

Cordialement.
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une image a un endroit précis

Message par Ejayremy Mar 3 Avr 2012 - 18:43

Merci à tous, ça fonctionne parfaitement ! Cool
Ejayremy

Ejayremy
Membre habitué

Masculin
Messages : 1038
Inscrit(e) le : 03/02/2006

https://ejayremy.1fr1.net/
Ejayremy a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum