Changer le style d'un article wiki

Documentation Guides pour les développeurs
,
1

Un guide rapide pour changer le style de vos publications wiki :

image
image832×792 56.5 KB

Changer la couleur d’arrière-plan :

Dans votre /admin/customize/themes, ajoutez ce CSS sous Common > CSS

.wiki .topic-body .cooked {
  background-color: #dcffdc; /*vert clair*/
}

Changer la taille du texte

Si vous le souhaitez, vous pouvez également modifier la police utilisée ou la taille du texte, même la couleur

.wiki .topic-body .cooked p {
  font-size: 18px;
  color: green;
}

image
image788×795 55.8 KB

Ajouter du texte

Vous pouvez ajouter un texte pour indiquer clairement aux utilisateurs que ce qu’ils regardent est une publication wiki

.post-info.edits .wiki::before {
  content: "EDIT THIS WIKI POST";
  color: green;
  background-color: #d2e2d2;
  margin-right: 3px;
  font-weight: bold;
  border: 1px solid green;
  padding: 3px;
}

image
image355×213 5.72 KB

Ce document est contrôlé par version - suggérez des modifications sur github.

22 « J'aime »
Wikified Posts Component
Configuring wiki settings
Change author of wiki posts to encourage edits
Editing and creating wiki posts
Place for total coding beginners to learn how to customise?
Place for total coding beginners to learn how to customise?
2

Hey, we just changed the background color of wikis on the Fairphone forum, but like all other posts each wiki starts out as staff-blue when you load it, then slowly turns white and only then turns green.
Is there a way to disable this animation for wiki posts?

3

I believe this should do the trick:

.wiki .topic-body {animation: none;}

6 « J'aime »
4

Here’s a Theme Component which makes Wikified posts pale green again, and incorporates @Kris’s animation: none tweak. (I chose an essentially random pale green as I did this surreptitiously while I was supposed to be paying attention in a meeting. But you can change the RGB value in the Theme Component CSS after installation)

Improvements always welcome by pull request.

4 « J'aime »
5

Is there a way to make background conditional on light and dark theme? Appreciate your response

1 « J'aime »
6

The simplest thing to do is create two different theme components, one for the Light theme and one for the Dark theme so you don’t need to write any more CSS

2 « J'aime »
7

For Wiki customisations to work well in Private Messages with the new changes, I suggest a slight tweak to the CSS so that it targets .cooked:

// customises wiki posts
.wiki .topic-body .cooked {
    background-color: #e8f9fd;
    animation: none;
}
.post-info.edits .wiki::before {
    content: "Wiki Post";
    margin-right: 5px;
    font-weight: bold;
}

I’ll pop this in the OP too.

Later…
And for the hell of it I turned it into the Theme Component with the ability to customise the background color and the text.

2 « J'aime »