title | description | published | date | tags | editor | dateCreated |
---|---|---|---|---|---|---|
Markdown - Codes courts |
Retrouvez ici tous les codes courts utiles lorsque vous écrirez des articles en Markdown |
true |
2023-04-03 11:51:13 UTC |
markdown |
2023-01-06 10:38:56 UTC |
Le wikilibriste est propulsé grâce à wiki.js
un moteur de wiki libre et pour écrire les pages nous utilisons la syntaxe Markdown.
Pour découvrir les codes markdown qui permettent d'obtenir les présentations qui suivent, cliquez sur l'icône "Modifier la Page" en bas à droite :
[user@ordinateur:~ $] mkdir un-dossier
[user@ordinateur:~ $] sudo apt update
function lorem (ipsum) {
const dolor = 'consectetur adipiscing elit'
}
.classe-css {
color: white;
}
<head>
<div>
<h1>Titre</h1>
</div>
</head>
Lorem ipsum
dolor
Lorem ipsum dolor sit amet Consectetur adipiscing elit
Lorem ipsum dolor sit amet Consectetur adipiscing elit {.is-info}
Lorem ipsum dolor sit amet Consectetur adipiscing elit {.is-success}
Lorem ipsum dolor sit amet Consectetur adipiscing elit {.is-warning}
Lorem ipsum dolor sit amet Consectetur adipiscing elit {.is-danger}
Lorem ipsum dolor CTRL + C
sequenceDiagram
Alice ->> Bob: Hello Bob, how are you?
Bob -->> John: How about you John?
Bob --x Alice: I am good thanks!
Bob -x John: I am good thanks!
Note right of John: Bob thinks a long<br/>long time, so long<br/>that the text does<br/>not fit on a row.
Bob --> Alice: Checking with John...
Alice -> John: Yes... John, how are you?
🍎
Utilisation en 🔥 inline ➡️ pour améliorer l'UX
Visitez webfx.com
afin de retrouver l'emoji qui vous intéresse.
Vous pouvez aussi utiliser des pitcogrammes listés sur
pictogrammers.com
et les utiliser comme suit : Par exemple, pour inclure l'icône menu , ajoutez ce code<span class="mdi mdi-menu"></span>
{.is-info}
![sortirgafam091.png](/images/sortirgafam091.png "Lorem ipsum" =100x)
Lien interne au wiki
- Checked task item
- Another checked task item
- Unchecked task item
- Grid Item 1
- Grid Item 2
- Grid Item 3
- Grid Item 1
- Grid Item 2
- Grid Item 3 {.grid-list}
- Lorem ipsum dolor sit amet Subtitle description here
- Consectetur adipiscing elit Another subtitle description here
- Morbi vehicula aliquam Third subtitle description here {.links-list}
This sentence1 needs a few footnotes.2
Lorem ipsum dolor
Consectetur adipiscing elit
Any content here will go into the first tab...
Any content here will go into the second tab...
Any content here will go into the third tab...
Header 1 | Header 2 | Header 3 |
---|---|---|
Foo | Bar | Xyz |
Abc | Def | 123 |
Header 1 | Header 2 | Header 3 |
---|---|---|
Foo | Bardskfjh | Xyz |
Abc | Def | 123 |
{.dense} |
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ^ipsum^ dolor
Lorem ipsum dolor
Pour les vidéos, si une intégration iFrame est possible, vous devrez en passer par du HTML comme suit :
<p>Cette vidéo est une présentation :</p>
<br>
<iframe class="frame-style" title="Ceci est un titre" src="https://videos.surunsite.fr/videos/embed/123452ee-1234-1234-1234-f64b810e74ad" allow="fullscreen; accelerometer; encrypted-media; gyroscope; picture-in-picture" sandbox="allow-same-origin allow-scripts allow-popups" frameborder="0"></iframe>
<br>
Veuillez ne pas oublier la classe "frame-style" {.is-warning}
N'oubliez pas d'ajouter le paramètre
?autoplay=0
dans les URL Invidious à la fin du paramètresrc=
afin de ne pas lancer la lecture automatique des vidéos, comportement particulièrement génant pour la plupart des visiteurs ! Par exemple :src="https://yewtu.be/embed/iUTfvpYHFgM?autoplay=0"
{.is-danger}
Voici une vidéo pour vous familiariser avec et même apprendre rapidement le markdown :
<iframe class="frame-style" title="Cours complet langage Markdown" src="https://yewtu.be/embed/iUTfvpYHFgM?autoplay=0" allow="fullscreen; accelerometer; encrypted-media; gyroscope; picture-in-picture" sandbox="allow-same-origin allow-scripts allow-popups" frameborder="1"></iframe>![CC BY-NC-SA](/by-nc-sa.png =9%x){.align-right} <3 L'équipe WikiLibriste.fr