[Réglé] Image background

Pour les recherches et les demandes de modifications de styles concernant votre forum phpBB 3.2

Modérateur: Equipe

Règles du forum
A lire impérativement : Règlement de phpBB-fr.com - Conditions générales de support graphique

Attention : pour éviter les bogues, votre style doit être mis à jour en même temps que votre forum, et ce, dans la dernière version disponible de phpBB !

[Réglé] Image background

Messagepar On Stage » 03 Avr 2018 à 16:42

Bonjour,

Depuis hier je rame.
J'essaie de mettre une image background en fond de forum, j'ai bien lu différent tuto mais pas d'image qui s'afiche.
J'ai réussi à installer la transparence mais pour l'image je sèche. Mon image est bien dans le dossier /images du thème, ce thème est un thème hérité de prosilver

J'ai forcément loupé quelque chose mais je ne vois pas.

Dans la style sheet j'ai ces lignes :
Code: Tout sélectionner
html, body {
	color: #c1f2e6;
	background: url("./images/background.jpg"); 
}


J'ai bien entendu vidé le cache

Par avance merci
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar FTH10 » 03 Avr 2018 à 16:46

bonjour,

je l'aurais mis dans le colour.css :D
Relax Arcade Pro pour phpBB 3.1.12 et 3.2.x en libre téléchargement ainsi que des jeux Flash ou HTML5
FTH10
Posteur habitué
Posteur habitué
 
Messages: 221
Enregistré le: 09 Jan 2014 à 00:00

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 16:56

J'ai déjà essayé, je viens de mettre ces lignes dans colour.css mais l'image ne s'affiche pas
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar Mazeltof » 03 Avr 2018 à 17:51

'jour ici,

Puisque tu as un style hérité, il ne faut surtout pas (plus) modifier prosilver qui doit rester d'origine.

Il y a quelque chose de louche dans le code de ton forum :
<body id="phpbb" class="nojs notouch section-app//images/background.jpg ltr ">
tu devrais avoir quelque chose comme ça :
<body id="phpbb" class="nojs notouch section-index ltr ">

Tu as modifié le html ?
C'est les résidus d'une extension ?

Il y a aussi un soucis avec ton image quand on veut l'enregistrer et elle est beaucoup trop lourde.
Essai plutôt celle-ci (171Ko au lieu de 2.55Mo, c'est déjà mieux) :
background.jpg
Image Image Image
Avatar de l’utilisateur
Mazeltof
Resp. des graphistes
Resp. des graphistes
 
Messages: 2856
Enregistré le: 09 Mar 2009 à 22:02
Localisation: Arras

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 18:00

J'ai mis ton image Mazeltof mais toujours pas d'image qui s'affiche.

Quant au html j'ai modifié le viewtopic_body.html pour avoir mes rangs no_name, la ligne 157 remplacé par celle-ci :
Code: Tout sélectionner
<!-- IF postrow.RANK_TITLE or postrow.RANK_IMG --><dd class="profile-rank"><!-- IF postrow.RANK_IMG -->{postrow.RANK_IMG}<!-- ELSE -->{postrow.RANK_TITLE}<!-- ENDIF --></dd><!-- ENDIF -->
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar Mazeltof » 03 Avr 2018 à 18:14

ok, pas grand chose a voir avec le morceau de code que j'indique plus haut, qui se trouve dans overall_header.html de ton style hérité (vers la ligne 76) tu dois avoir :
Code: Tout sélectionner
<body id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">


C'est le cas ?

Edit :
on dirait que c'est rentré dans l'ordre sur ce point.

Edit 2 :
le background n'est pas au bon endroit. Il doit être dans le même répertoire que ton logo
Image Image Image
Avatar de l’utilisateur
Mazeltof
Resp. des graphistes
Resp. des graphistes
 
Messages: 2856
Enregistré le: 09 Mar 2009 à 22:02
Localisation: Arras

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 18:21

Oui la ligne 76 est bien celle-ci
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar Mazeltof » 03 Avr 2018 à 18:23

Mazeltof a écrit:Edit 2 :
le background n'est pas au bon endroit. Il doit être dans le même répertoire que ton logo
Image Image Image
Avatar de l’utilisateur
Mazeltof
Resp. des graphistes
Resp. des graphistes
 
Messages: 2856
Enregistré le: 09 Mar 2009 à 22:02
Localisation: Arras

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 18:25

Ces 2 images sont dans le même répertoire /theme/images
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar Mazeltof » 03 Avr 2018 à 18:36

dans ton fichier style-stageleft.css
tu as un */ en trop ou un /* en moins qui met la dawa.

remplace :
Code: Tout sélectionner
/* stageleft Style sheet - On Stage ( https://www.stageleft.fr/ ) */
--------------------------------------------------------------
	Style name:			stageleft (onstage phpBB 3.2.2 style)
	Based on style:     prosilver
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		onstage ( https://www.stageleft.fr/ )
    --------------------------------------------------------------
*/

par :
Code: Tout sélectionner
/* stageleft Style sheet - On Stage ( https://www.stageleft.fr/ ) */
/* 
--------------------------------------------------------------
	Style name:			stageleft (onstage phpBB 3.2.2 style)
	Based on style:     prosilver
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		onstage ( https://www.stageleft.fr/ )
    --------------------------------------------------------------
*/
Image Image Image
Avatar de l’utilisateur
Mazeltof
Resp. des graphistes
Resp. des graphistes
 
Messages: 2856
Enregistré le: 09 Mar 2009 à 22:02
Localisation: Arras

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 18:44

Merci chef, ce qui est beaucoup mieux

Image

L'image n'est pas adapté en proportion, il faut que je suive ce qui est dit ici pour avoir l'image entière ?
documentation/styles/30-image-de-fond-qui-s-adapte-a-la-taille-d-ecran-a18-view.html

Edit :
L'image bouge avec le défilement du forum alors qu'il faudrait qu'elle soit fixe
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 19:22

Avec le tuto ci-dessus l'image est fixe et centrée à l'écran.

Merci à toi Mazeltof
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar Mazeltof » 03 Avr 2018 à 20:28

Pour avoir ton background fixe et qui s'adapte aux tailles d'écrans, il y a plus simple depuis la date de création de ce tuto (il est pour phpBB 3.0).

Annule ta dernière modification et dans style-stageleft.css, laisse :
Code: Tout sélectionner
html, body {
	color: #c1f2e6;
	background: url("./images/background.jpg") no-repeat center fixed; 
	background-size: cover;
}
Image Image Image
Avatar de l’utilisateur
Mazeltof
Resp. des graphistes
Resp. des graphistes
 
Messages: 2856
Enregistré le: 09 Mar 2009 à 22:02
Localisation: Arras

Re: Image background

Messagepar On Stage » 03 Avr 2018 à 21:21

Fait, je suis revenu en arrière avec ton code, effectivement beaucoup plus simple !

Alors il me reste un truc à virer, ce sigle en haut à gauche du screen

Image
Version du forum : 3.2.3
Version de PHP : 7.2.7

Image
Avatar de l’utilisateur
On Stage
Posteur habitué
Posteur habitué
 
Messages: 211
Enregistré le: 19 Mar 2018 à 16:04

Re: Image background

Messagepar Sylveretour » 03 Avr 2018 à 21:56

Bonjour,

Cela vient d'une petite faute inattention dans overall_header.html
Code: Tout sélectionner
<body id="phpbb" class="section-index ltr">>

Puis, ton logo non entièrement visible, tu a mis
Code: Tout sélectionner
left: 100px;

à remplacer par:
Code: Tout sélectionner
height: 91px;
Avatar de l’utilisateur
Sylveretour
Maître-posteur
Maître-posteur
 
Messages: 461
Enregistré le: 21 Nov 2017 à 18:24
Localisation: West Coast

Suivante

Retourner vers [3.2.x] Modifications et recherche de styles

 


  • Articles en relation
    Réponses
    Vues
    Dernier message

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 1 invité