fond de page internet avec SPIP

Bonjour,

J'ai un souci, je souhaiterai mettre un fond comme sur ce site par exemple http://www.allocine.fr/series/ficheserie_gen_cserie=11400.html

Ici il y le conteneur de la page et en fond, il y on mit une publicité. Sur le site de association domaine nature, www.domainenature.org, ce sera pour afficher par exemple, des images de saisons, ou d’événement comme Noël les marchés de Noël, de Pâques, ou des manifestions de handbike comme la course internationale de la Rosenau. http://www.handbike.fr/

J'ai entendu dire qu'il faillait faire un fichier, css.html. Je n'ai aucune idée de ce que cela pourrait être, ni comment, il faudrait faire.

Auriez-vous une piste ?

Le 09/12/2014 12:44, francois.delaveine47@free.fr a écrit :

J'ai un souci, je souhaiterai mettre un fond comme sur ce site par exemple
Marvel : Les Agents du S.H.I.E.L.D. - Série TV 2013 - AlloCiné

Euh... Je ne vois pas de fond... Adblock qui le bloque ?

Ici il y le conteneur de la page et en fond, il y on mit une publicité. Sur le site de association domaine nature,
www.domainenature.org, ce sera pour afficher par exemple, des images de saisons, ou d’événement comme Noël les marchés de Noël,
de Pâques, ou des manifestions de handbike comme la course internationale de la Rosenau. http://www.handbike.fr/

Comme ça alors ? (c'est mon blog...)
http://cahierdesergio.free.fr/v2/

J'ai entendu dire qu'il faillait faire un fichier, css.html. Je n'ai aucune idée de ce que cela pourrait être, ni comment, il
faudrait faire.

Tout bêtement, dans le fichier squelette/perso.css il y a une ligne :
body { background: url("andycappfond2.jpg") fixed; }

(et le fichier "andycappfond2.jpg" est dans le répertoire "squelette").

--
Sergio
Éditions Touchalon: http://touchalon.com/
Blog : http://cahierdesergio.free.fr/

salut,
ils ont dû retirer l’arrière-plan juste quand il fallait pas…
si tu veux mettre un lien cliquable c’est pas beaucoup plus difficile, avec quelques règles css, mais est-ce que tu voudrais que ce soit maîtrisé en rédaction ?
Par exemple tu pourrais faire que le dernier site publié dans une rubrique précise affiche son logo en fond de page avec un lien pour le visiter… ?

Coucou,

Merci pour vos réponses.

@Serge Delbono, je vais opter pour quelque chose de similaire. ici sur le serveur de test http://www.destinationcyber.com/domainenature/

Cela affiche, mais pas comme je voudrais.
dans perso.css
body {
    text-align: center;
    /*background: #e2f1f2; */
  background: url("fond-noel2014.jpg") 50% 0px no-repeat black;}

@chankalan, cela est beaucoup trop osé pour le service de comm. Il n'y a qu'une personne qui doit assurer la communication comme quand il y avait 2 ou 3 personnes, elle doit gérer les membres, les rentrés d'argent, les factures, les stages et les stagiaires, les contras pro, etc en fait le boulot du trésorier et du directeur.

En plus avec la pensée de trop de communication tue la communication, c'est mal parti. les autres personnes, qui sont éducateurs, ne souhaitent pas vraiment s'investir pour relater les activités.

J'ai plus de retours avec l'ASF Mulhouse sur Facebook, que de la part de mes collègues.

Par contre, pour mes sites personnels, je serais enchanté d'apprendre comment réaliser ce que tu m'expose.

Dur dur d'être bénévole...

A bientôt

----- Mail original -----
De: "chankalan" <chankalan@free.fr>
À: spip@rezo.net
Envoyé: Mardi 9 Décembre 2014 13:42:59
Objet: Re: [Spip] fond de page internet avec SPIP

salut,
ils ont dû retirer l'arrière-plan juste quand il fallait pas...
si tu veux mettre un lien cliquable c'est pas beaucoup plus difficile, avec quelques règles css, mais est-ce que tu voudrais que ce soit maîtrisé en rédaction ?
Par exemple tu pourrais faire que le dernier site publié dans une rubrique précise affiche son logo en fond de page avec un lien pour le visiter... ?

Le 09/12/2014 12:55, Serge Delbono a écrit :

Le 09/12/2014 12:44, francois.delaveine47@free.fr a écrit :

J'ai un souci, je souhaiterai mettre un fond comme sur ce site par exemple
http://www.allocine.fr/series/ficheserie_gen_cserie=11400.html

Euh... Je ne vois pas de fond... Adblock qui le bloque ?

Ici il y le conteneur de la page et en fond, il y on mit une publicité. Sur le site de association domaine nature,
www.domainenature.org , ce sera pour afficher par exemple, des images de saisons, ou d’événement comme Noël les marchés de Noël,
de Pâques, ou des manifestions de handbike comme la course internationale de la Rosenau. http://www.handbike.fr/

Comme ça alors ? (c'est mon blog...)
http://cahierdesergio.free.fr/v2/

J'ai entendu dire qu'il faillait faire un fichier, css.html. Je n'ai aucune idée de ce que cela pourrait être, ni comment, il
faudrait faire.

Tout bêtement, dans le fichier squelette/perso.css il y a une ligne :
body { background: url("andycappfond2.jpg") fixed; }

(et le fichier "andycappfond2.jpg" est dans le répertoire "squelette").

--
----
chan

Le 10/12/2014 11:59, francois.delaveine47@free.fr a écrit :

@Serge Delbono, je vais opter pour quelque chose de similaire. ici sur le serveur de test http://www.destinationcyber.com/domainenature/

Cela affiche, mais pas comme je voudrais.
dans perso.css
body {
     text-align: center;
     /*background: #e2f1f2; */
  background: url("fond-noel2014.jpg") 50% 0px no-repeat black;}

À toi de raffiner...
Effectivement, chez moi, l'image est centrée et cachée par les articles (donc ne sert à rien...). Pour moi, je mettrais une image beaucoup moins large et répétée en largeur (au moins), qu'on ait des chances de la voir sur les bordures. Mais chacun ses goûts...

--
Sergio
Éditions Touchalon: http://touchalon.com/
Blog : http://cahierdesergio.free.fr/

on peut faire mieux en obligeant l'image de fond du body à prendre toute la largeur de l'écran et à rester fixée avec
(prévoir une image très large pour les écrans très larges, disons 2000px pour être tranquille)

body {
   background-image: url("fond-noel2014.jpg");
   background-repeat:no-repeat;
   background-attachment:fixed;
   background-position:center
   -webkit-background-size: cover; /* pour Chrome et Safari */
   -moz-background-size: cover; /* pour Firefox */
   -o-background-size: cover; /* pour Opera */
   background-size: cover; /* version standardisée */

}

Le 10/12/2014 13:32, Serge Delbono a écrit :

Le 10/12/2014 11:59, francois.delaveine47@free.fr a écrit :

@Serge Delbono, je vais opter pour quelque chose de similaire. ici sur le serveur de test http://www.destinationcyber.com/domainenature/

Cela affiche, mais pas comme je voudrais.
dans perso.css
body {
     text-align: center;
     /*background: #e2f1f2; */
    background: url("fond-noel2014.jpg") 50% 0px no-repeat black;}

À toi de raffiner...
Effectivement, chez moi, l'image est centrée et cachée par les articles (donc ne sert à rien...). Pour moi, je mettrais une image beaucoup moins large et répétée en largeur (au moins), qu'on ait des chances de la voir sur les bordures. Mais chacun ses goûts...

Hello,

J'avance à petits pas. l'image est visible. mais c'est toute la page que je dois descendre maintenant. http://www.destinationcyber.com/domainenature/

Effectivement, le fameux exemple que j'avais donné, est bien une page de pub. Du coup, j'ai avec votre aide, trouvé comment mettre de la publicité sur mes sites persos, sans que notre ami le polatouche sorte les incisives.

Donc le body modifié comme ceci :

body {
    text-align: center;
    /*background: #e2f1f2; */
  background-image: url("fond-noel2014.jpg");
    background-attachment: scroll;
    background-clip: border-box;
    background-color: black;
    background-origin: padding-box;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: auto auto;
}

et pour ceux qui utilise l'excellent Japibas, également ceci :

.entete_noire1 {
background: none repeat scroll 0% 0%;
width: 100%;
padding: 3.25em 0 0 0;
margin-bottom: 0;
overflow: hidden;
}
.corps1 {
    background: none repeat scroll 0% 0%;
    width: 100%;
    overflow: hidden;*/ }

----- Mail original -----
De: "Serge Delbono" <serge.laposte@delbono.net.invalid>
À: spip@rezo.net
Envoyé: Mercredi 10 Décembre 2014 13:32:48
Objet: Re: [Spip] fond de page internet avec SPIP

Le 10/12/2014 11:59, francois.delaveine47@free.fr a écrit :

@Serge Delbono, je vais opter pour quelque chose de similaire. ici sur

le serveur de test http://www.destinationcyber.com/domainenature/

Cela affiche, mais pas comme je voudrais.
dans perso.css
body {
     text-align: center;
     /*background: #e2f1f2; */
  background: url("fond-noel2014.jpg") 50% 0px no-repeat black;}

À toi de raffiner...
Effectivement, chez moi, l'image est centrée et cachée par les articles
(donc ne sert à rien...). Pour moi, je mettrais une image
beaucoup moins large et répétée en largeur (au moins), qu'on ait des
chances de la voir sur les bordures. Mais chacun ses goûts...

--
Sergio
Éditions Touchalon: http://touchalon.com/
Blog : http://cahierdesergio.free.fr/

_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Discuter chez rezo.net

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc

oups

background-attachment: fixed;

pour que l'image soit fixe

Le 10/12/2014 16:32, francois.delaveine47@free.fr a écrit :

Hello,

J'avance à petits pas. l'image est visible. mais c'est toute la page que je dois descendre maintenant. http://www.destinationcyber.com/domainenature/

Effectivement, le fameux exemple que j'avais donné, est bien une page de pub. Du coup, j'ai avec votre aide, trouvé comment mettre de la publicité sur mes sites persos, sans que notre ami le polatouche sorte les incisives.

Donc le body modifié comme ceci :

body {
     text-align: center;
     /*background: #e2f1f2; */
  background-image: url("fond-noel2014.jpg");
     background-attachment: scroll;
     background-clip: border-box;
     background-color: black;
     background-origin: padding-box;
     background-position: 50% 0;
     background-repeat: no-repeat;
     background-size: auto auto;
}

et pour ceux qui utilise l'excellent Japibas, également ceci :

.entete_noire1 {
background: none repeat scroll 0% 0%;
width: 100%;
padding: 3.25em 0 0 0;
margin-bottom: 0;
overflow: hidden;
}
.corps1 {
     background: none repeat scroll 0% 0%;
     width: 100%;
     overflow: hidden;*/ }

----- Mail original -----
De: "Serge Delbono" <serge.laposte@delbono.net.invalid>
À: spip@rezo.net
Envoyé: Mercredi 10 Décembre 2014 13:32:48
Objet: Re: [Spip] fond de page internet avec SPIP

Le 10/12/2014 11:59, francois.delaveine47@free.fr a écrit :

@Serge Delbono, je vais opter pour quelque chose de similaire. ici sur

le serveur de test http://www.destinationcyber.com/domainenature/

Cela affiche, mais pas comme je voudrais.
dans perso.css
body {
      text-align: center;
      /*background: #e2f1f2; */
  background: url("fond-noel2014.jpg") 50% 0px no-repeat black;}

À toi de raffiner...
Effectivement, chez moi, l'image est centrée et cachée par les articles
(donc ne sert à rien...). Pour moi, je mettrais une image
beaucoup moins large et répétée en largeur (au moins), qu'on ait des
chances de la voir sur les bordures. Mais chacun ses goûts...

--
Sergio
Éditions Touchalon: http://touchalon.com/
Blog : http://cahierdesergio.free.fr/

_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Discuter chez rezo.net

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc
_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Discuter chez rezo.net

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc

Oups, je n'avais pas vu le post de Jean-Christophe,

Je viens de me rendre compte que du coup le site ne sera peut-être pas mobile-first.

Je dois le passer à la moulinette de Google Introduction to Lighthouse  |  Chrome for Developers

Il a passé le test.

----- Mail original -----
De: "Jean-Christophe Villeneuve" <jcvilleneuve@cegetel.net>
À: spip@rezo.net
Envoyé: Mercredi 10 Décembre 2014 16:38:26
Objet: Re: [Spip] fond de page internet avec SPIP

oups

background-attachment: fixed;

pour que l'image soit fixe

Le 10/12/2014 16:32, francois.delaveine47@free.fr a écrit :

Hello,

J'avance à petits pas. l'image est visible. mais c'est toute la page que

je dois descendre maintenant.
http://www.destinationcyber.com/domainenature/

Effectivement, le fameux exemple que j'avais donné, est bien une page de

pub. Du coup, j'ai avec votre aide, trouvé comment mettre de la publicité
sur mes sites persos, sans que notre ami le polatouche sorte les
incisives.

Donc le body modifié comme ceci :

body {
     text-align: center;
     /*background: #e2f1f2; */
  background-image: url("fond-noel2014.jpg");
     background-attachment: scroll;
     background-clip: border-box;
     background-color: black;
     background-origin: padding-box;
     background-position: 50% 0;
     background-repeat: no-repeat;
     background-size: auto auto;
}

et pour ceux qui utilise l'excellent Japibas, également ceci :

.entete_noire1 {
background: none repeat scroll 0% 0%;
width: 100%;
padding: 3.25em 0 0 0;
margin-bottom: 0;
overflow: hidden;
}
.corps1 {
     background: none repeat scroll 0% 0%;
     width: 100%;
     overflow: hidden;*/ }

----- Mail original -----
De: "Serge Delbono" <serge.laposte@delbono.net.invalid>
À: spip@rezo.net
Envoyé: Mercredi 10 Décembre 2014 13:32:48
Objet: Re: [Spip] fond de page internet avec SPIP

Le 10/12/2014 11:59, francois.delaveine47@free.fr a écrit :

@Serge Delbono, je vais opter pour quelque chose de similaire. ici sur

le serveur de test http://www.destinationcyber.com/domainenature/

Cela affiche, mais pas comme je voudrais.
dans perso.css
body {
      text-align: center;
      /*background: #e2f1f2; */
  background: url("fond-noel2014.jpg") 50% 0px no-repeat black;}

À toi de raffiner...
Effectivement, chez moi, l'image est centrée et cachée par les articles
(donc ne sert à rien...). Pour moi, je mettrais une image
beaucoup moins large et répétée en largeur (au moins), qu'on ait des
chances de la voir sur les bordures. Mais chacun ses goûts...

--
Sergio
Éditions Touchalon: http://touchalon.com/
Blog : http://cahierdesergio.free.fr/

_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Discuter chez rezo.net

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc
_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Discuter chez rezo.net

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc

_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Discuter chez rezo.net

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc