Ce post contient les étapes et paramétrages à effectuer pour configurer le template de ce blog dans sa version 1.0.
- Choisir dans les modèles simples, le modèle "épuré"
- Modifier le code HTML (Traiter) :
- Ajouter les CSS ci-dessous :
- Ajouter le JS avant le footer :
- Personnaliser le thème :
- largeur : 990px
- mise en page : 1er choix pour contenu + 1er choix pour pied de page
- Mode avancé :
- Arrière plan principal et extérieur : #fff
- En-tête de la date :
- arrière plan : #ff8832
- texte : #fff
- Ajouter CSS :
- Style à appliquer :
- Résumé :
- Titre 1:
- Code HTML:
<!-- Le styles --> <link href='http://twitter.github.com/bootstrap/assets/css/bootstrap.css' rel='stylesheet'/> <link href='http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css' rel='stylesheet'/> <link href='http://twitter.github.com/bootstrap/assets/js/google-code-prettify/prettify.css' rel='stylesheet'/>
<script src='http://twitter.github.com/bootstrap/assets/js/google-code-prettify/prettify.js'/>
.bs-post-resume{ position: relative; margin: 15px 0; padding: 39px 19px 14px; background-color: #E5E5E5; border: 1px solid #ff8832; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .bs-post-resume::after { content: "Résumé"; position: absolute; top: -1px; left: -1px; padding: 3px 7px; font-size: 12px; font-weight: bold; background-color: #ff8832; border: 0px solid #ff8832; color: #fff; -webkit-border-radius: 4px 0 4px 0; -moz-border-radius: 4px 0 4px 0; border-radius: 4px 0 4px 0; }
<div class="bs-post-resume">Texte du résumé</div>
<div class="page-header"><h3>mon titre</h3></div>
<pre class="prettyprint lang-html"><monhtml></monhtml></pre>