Comment avoir un thème alternatif avec fond blanc

Je vous propose dans ce tuto de modifier légèrement le thème du forum.

Les deux changements majeurs sont que désormais la couleur de fond des messages est le blanc et que le forum n'occupe plus toute la largeur de l'écran, mais il y a une colonne centrale. Les longs textes me semblent ainsi plus faciles à lire.
Attention cependant c'est un peu du "bricolage" car je n'ai pas accès aux paramètres d'administration du forum. J'aurai souhaité pouvoir modifier le réglage qui limite l'affichage des photos à 640 pixels de largeur mais avec la technique que j'utilise ce n'est pas possible. De plus réduire la largeur de la zone d'affichage fait que dans certains cas la zone pour saisir des réponses à un message n'est pas aussi large que je l'aurai souhaité (là encore je ne peux pas modifier ce paramètre).

1 - Dernière chose ce bidouillage n'est possible qu'avec certains navigateurs car vous devez installer l'extension Stylus.

Pour la télécharger sur Firefox c'est ici : https://addons.mozilla.org/fr/firefox/addon/styl-us/
et sur Chrome c'est ici : https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=fr

une fois Stylus ajouté en haut à droite de l'écran vous devez avoir un

Si cela n'apparait pas sur Chrome cliquez en haut à droite sur
pour faire apparaitre Stylus.

2 - Seconde étape allez sur la page d'accueil de notre forum. Cliquez sur  


puis dans la zone que j'ai mis en jaune


Collez tout le texte vert dans Stylus :

Code:


@-moz-document domain("forumvoyage.forumactif.com") {
body {
  background-color: #eae9da;
}
#wrap {
max-width:1260px;
background-color: #f9f9f9;
border-right: 2px solid #fff;
border-left: 2px solid #fff;
}

.row1 {
  background-color: #f5f5f5;
}
.row2 {
  background-color: #ffffff;
}

ul.forums {
  background-color: #fdfcee;
}
.navbar {
  background-color: #f0f0e6;
}

.element {
  width: 75%;
}


.textarea_content {
    width:75% !important;
}

textarea_content {
    width:75% !important;
}
ul.topiclist dt, ul.topiclist dd.dterm {
  padding-left: 10px;
    padding-top: 10px;
}
.panel {
      background-color: #f7f7f7;
}
#sce_smilies_body {
  background-color: #e9f0e5;
}

#smiley-box, .smile-status-box {
      background-color: #e9f0e5;
}
a.topictitle {
  margin-left: 18px;
}

.topictitle {
  margin-left: 18px;
}

blockquote {
    background-color: #e9f0e5;
}
}

Pour valider cliquez sur Remplacer le style en bas de la boite de dialogue.
et je pense qu'il faut cliquer sur Enregistrer en haut à gauche de l'écran également.

Si vous avez réussi votre coup, l'apparence du site est modifiée.


---


Vous pouvez, vous même modifier ce thème.
si par exemple vous souhaitez que la colonne centrale soit plus large
Cliquer sur
puis sur le petit crayon à droite de forumvoyage.forumactif.com

et modifiez la ligne 5
max-width:1260px;
vous pouvez mettre
max-width:100%;
pour que cela utilise tout l'écran
ou mettre comme j'ai mis une valeur en pixels.

Pensez à Enregistrer (en haut à gauche).

Je ne connaissais pas stylus.
Si je comprends bien, cela permet de modifier des feuilles de style lors de l’affichage d’une url, et d’en ajouter ? Je m’y collerai dès que j’aurai accès à mon PC.
Ça me permettra de revoir mon css qui s’est un peu rouillé après des années d’inactivité. J’utilisai alors Web Developer, pour des simulations.

Tiens, au passage, si tu as des lignes de css qui permettent de mettre un display : none sur les bandeaux blancs, tu peux faire des heureux…

Pour la taille des images, le sujet a été plusieurs fois abordé. Beaucoup seraient plutôt favorables à 800 px, mais la réponse a toujours été niet.

Je ne connaissais pas stylus.
Si je comprends bien, cela permet de modifier des feuilles de style lors de l’affichage d’une url, et d’en ajouter ?

C'est exactement ça, la différence avec les éditeurs intégrés dans Firefox ou Chrome, c'est que l'on peut sauvegarder les styles et même les héberger en ligne.
Stylus ne permet de modifier que les CSS. Et pour la taille des images, il y a j'ai l'impression du Javascript qui prends le dessus sur la largeur que l'on assigne aux images

Tiens, au passage, si tu as des lignes de css qui permettent de mettre un display : none sur les bandeaux blancs, tu peux faire des heureux…

Je vois pas trop de quelles zones tu parles... des zones de publicités ?

Je parle des bandeaux blancs qu’il y a parfois au dessus des images, selon la façon de les insérer.
https://forumvoyage.forumactif.com/t1804-discussion-autour-de-la-bande-blanche#24098

Mais si tu es sur un environnement Windows, tu ne les vois sans doute pas…

Effectivement elles n'apparaissent pas quelque soit le navigateur sous Windows.

Ça va pas trop le faire avec Apple.
Les extensions Chrome et Firefox ne sont pas autorisées (Opera non plus d’ailleurs).
On peut éventuellement installer une extension Safari sur Chrome, mais je crois comprendre de ton message, que Stylus n’existe pas sur Safari…

Je n'ai pas de Mac je laisse quelqu'un d'autre te répondre, mais sachant qu'il y a énormément de développeurs sur Mac. J'ai du mal à croire que l'installation d'extensions soit impossible sur Chrome et Firefox.

Bonjour à toutes et à tous.

Certains utilisateurs préfèrent un affichage plus neutre voir monochrome pour la lecture d'un forum.
Pour répondre à ce besoin et reprendre partiellement la suggestion ci-dessus, nous mettons en "test" une petite évolution.
Un sélecteur situé en haut et à gauche de la page d'accueil permet d'un simple clic de basculer du mode standard (aux couleurs du forum), à un affichage "clair" et monochrome de la partie message.
La page d'accueil n'est pas modifiée pour conserver l'identité visuelle du forum.



Bon tests !

Je viens de tester j’ai une couleur gris clair pas sympa qui s’affiche  
C’est un peu lugubre comme couleur .
Précision sur Mac  IPad . C’est peut être ça .

C'est pour éviter un blanc trop "cru" et lumineux, mais c'est un test, cela pourra se modifier et surtout cela dépend des appareils utilisés et de la luminosité activée.

C’est vraiment lugubre , peu engageant , mais si ça peut s’arranger sans avoir à trop bidouiller pourquoi pas .
Il faudrait un truc qui conviennent à tous les utilisateurs quel que soit les appareils utilisés .
Merci du travail effectué , bonne chance pour les bidouillages .

Je trouve ça mieux.
Mais personnellement, je navigue sur IPad en mode mobile. Je clique sur « nouveautés « ainsi j’ai tous les nouveaux messages et ne vais pratiquement jamais sur la page d’accueil.
Et vous comment faites vous ?

Quel bonheur d'avoir enfin un admin 2.0

La page d'accueil n'est pas modifiée pour conserver l'identité visuelle du forum.

Tu es sûr ?

Style par défaut


Clair


Les couleurs sont les mêmes (heureusement, d'ailleurs) sur PC et sur iPad.
Perso, la couleur choisie ne me dérange pas, j'aime bien. Mieux, je préfère  

@Masterpo

Lapsus En-tête et non Accueil ...

Pour la couleur choisie, c'est mon côté "éminence grise" qui à parlé 

@daisyone a écrit:personnellement, je navigue sur IPad en mode mobile.

Tu n'es pas plutôt en version web ?
Parce que sur l'iPad en version mobile, il n'y a aucune différence entre le style par défaut et ce nouveau style clair...

En-tête et non Accueil

Ah, OK

À l'usage (si on peut dire, ça doit faire 10 minutes), j'aime assez la couleur claire du fond des messages (gris légèrement rosé, #f4eeee).
En revanche, le bleu des bordures ne va plus trop du coup (#7dc7d8)

Et, éminence ou pas, le gris de l'accueil (#c3bebe) n'est effectivement pas terrible...

J'espère que le "Style par défaut" restera toujours possible parce que, après essai, le fond clair me fatigue vite les yeux.
Ou alors peut-on tenter un fond "Sombre" ou "Nuit" (avec les écritures en blanc) ?

Ce gris est vraiment sinistre , et on ne peut pas lire de façon confortable , ce type de couleur plombe le moral . 

Pourquoi ne pas laisser comme c’était , il me semblait d’autre part que c’était les couleurs du drapeau Ukrainien .

Pourquoi ne pas laisser comme c’était

Ben, ça ne dépend que de toi...

@Masterpo 

On peut donc conserver les deux versions , dans ce cas pas de pb , je conserve la vieille version .

Le choix entre plusieurs thèmes serait génial (par défaut, light mode, dark mode, etc.) mais l’idéal serait la personnalisation des css, au moins celles qui concernent les couleurs. L’extension proposée par c64 le permettrait, mais sur Apple, a priori, ça ne fonctionnerait pas.

) mais l’idéal serait la personnalisation des css,

Heu , tu peux traduire ? CSS ….

CSS = Feuilles de style en cascade.
A priori, ça fait partie des trucs qu’il vaut mieux ne pas toucher si on ne sait pas ce que c’est, mais en insistant beaucoup, on y arrive.
De toute façon, ça reste pour l’instant un voeu pieux.

A défaut de carnets  de voyage on se régale avec ce voyage dans le labyrinthe de la technicité ….
Je continue mes demandes : feuilles de style en cascade ?  Traduction SVP .