Site web static
Générateur de site web statique VS Site dynamique[modifier | modifier le wikicode]
Besoin d'un CV en ligne, d'un portfolio ou juste d'un blog? Évidement vous viennent à l'esprit les CMS du type "WordPress" ou micro-blogging tels que "Tumblr". Sauf que vous voulez tatez du Python, publier rapidement vos articles et faire votre propre mise en page ? Alors bienvenue chez Pélican, le générateur de site web statique open-source et léger.
C'est son poids plume son premier avantage. Au lieu de gérer une base de donnée comme sur les CMS et que l'accès a votre site fonctionne sur le type:
envoie de la requête -> recherche d'information -> mise en page -> affichage
On compile les 3 dernières phases nous même pour que son affichage soit immédiat, facile de gestion et de mise à jour. De plus, en gérant vous même vos fichiers vous pouvez facilement les archiver et les sécuriser.
Pourquoi choisir Pélican?[modifier | modifier le wikicode]
Installer Pélican[modifier | modifier le wikicode]
sur linux[modifier | modifier le wikicode]
sudo apt-get install pip sudo pip install pelican
Créer son environnement de travail[modifier | modifier le wikicode]
Créez un dossier où vous allez mettre le contenu de votre site et où Pelican génèrera ces fichiers de configuration puis votre site web (en HTML et CSS). Placez-vous dans ce dossier et effectuez la commande pelican quickstart. Une série de question vous est alors posée pour pré-configurer votre site :
> Where do you want to create your new web site? [.] #ici, dans le dossier ou vous vous trouvez > What will be the title of this web site? #le nom de votre site > Who will be the author of this web site? #le nom de l'auteur > What will be the default language of this web site? [en] #la langue : fr pour le français > Do you want to specify a URL prefix? e.g., http://example.com (Y/n) # n si vous n'avez pas de nom de domaine > What is your URL prefix? (see above example; no trailing slash) #le nom de domaine > Do you want to enable article pagination? (Y/n) #paginer les article du site (faire apparaitre une chronologie) > How many articles per page do you want? [10] #nombre d'article par page > Do you want to generate a Makefile to easily manage your website? (Y/n) #je ne sais plus > Do you want an auto-reload & simpleHTTP script to assist with theme and site development? (Y/n) #non plus Done. Your new project is available at #emplacement de votre dossier/monSiteWeb
Voici l'architecture de l'espace de travail ainsi créer :
monSiteWeb/ ├-- content/ #le dossier où vous écrirez le contenu de votre site, ainsi que vous mettrez les médias ├-- output/ #le dossier où Pelican "compile" le site (génère le HTML et le CSS) ├-- pelicanconf.py #fichier de configuration qu'il faudra parfois éditer └-- publishconf.py #je ne sais pas
Rédaction de notre premier article[modifier | modifier le wikicode]
Dans quel langage écrire?[modifier | modifier le wikicode]
Si Pélican permet de ne pas rédiger ses articles en HTML et même de ne jamais voir une feuille de CSS c'est d’abord parce-qu’il à le rôle de "convertisseur" de langage. Mais pour qu'il sache que tel ou tel élément correspond... Il existe différent langage de balisage léger, plus ou moins récent ou populaire, orienté vers tel ou tel usage. Voici la liste peut-être non exhaustif des langages compris par Pelican:
- RestrecuredText
- Markdown
- Latex :
- Txt2tags : ce dernier à l'avantage d'être conçu comme un méta langage de balisage : c'est à dire que le logiciel du même nom (écrit lui aussi en Python) permet de convertir le texte écrit avec cette syntaxe dans tout les langages cités plus haut et même dans bien d'autres (Wiki,HTML...). Il permet donc une multiplatformitée parfaites pour publier vos articles sous une multitude de support. Pourtant il est souvent dénigré (comme le wiki) car il utilise des balisesp qui s'ouvre puis se ferme un marquage est donc plus long à écrire qu'en Markdown par exemple. Pour l'utiliser, il faut l'installer par aptitude install txt2tags puis suivre le tut du plugin : [1]
Pas obligé de faire un ce choix cornélient tout de suite ! Car chaque articles peut-être écrit dans un langage différent, il faut simplement le préciser dans l’extension du fichier par exemple: .rsd .md .? .t2t .... L'important est d'être efficace dans la rédaction (connaitre les balises par cœur) et la publication (correspondant à ses usages) avec le langage choisit.
Génération du Site[modifier | modifier le wikicode]
Compilation Simple[modifier | modifier le wikicode]
Une fois que tout les éléments sont en place et que l'on veut générer notre site pour pouvoir admirer le travail, il nous suffit de se placer à la racine du dossier du projet (là où on a fait le "quickstart") et de taper : make html ou alors tout simplement pelican content le dossier content est alors "compilé" en suivant la configuration du fichier pelicanconf.py. Le site est maintenant disponible dans le dossier output.
Visualisation du site[modifier | modifier le wikicode]
La solution la plus simple pour visualiser le résultat, sans tout publier sur un server conecté à internet, est de créer un petit serveur local sur sont ordinateur. Cela tombe à pique python sait très bien le faire ! Il vous suffit de vous placer dans le dossier output et de taper python -m SimpleHTTPServer suivit du numéro du port que vous voulez utiliser (par défaut 8000). Enfin on ouvre un navigateur web et on tape dans la barre d'adresse : http://localhost:numeroDuPortChoisit Et tadam le beau site !
Serveur de développement[modifier | modifier le wikicode]
Le soucis de cette solution est que à chaque modification effectuées, on est obligé de recompiler le site et de relancer un serveur. Heureusement, Pelican embarque la solution avec la commande lancée à la racine du dossier de projet : make devserversuivit de "PORT=" et du numéro de port voulue (par défaut cette fois c'est le 80) Et là vous avez même dans le terminal un beau "log" du serveur qui vous indiquera si quelque-chose cloche durant l'écriture de votre site en recompilant constament votre content. A noté que vous pouvez toujours lancer la commande make html si par exemple vous changez un élement du pelicanconf.py. Pour arreter le serveur ...
Plus loin dans la rédaction[modifier | modifier le wikicode]
En-tête[modifier | modifier le wikicode]
Pelican rajoute une couche de "syntaxe", de "structuration" du texte par l'obligation d'écrite un en-tête à notre article. Cela permet d'ajouter des métadonnées à l’article qui vont permettre de les trier par exemples. Il se rédige ainsi :
- le titre
- la date
- les dates de modifications
- les tags
- la catégorie
- le slug
- les auteurs
- le résumé
- la langue
- le template ou theme
Seuls le titre et la catégorie sont obligatoire !
Articles ou Page?[modifier | modifier le wikicode]
Je vous parle d'articles depuis le début, mais il existe aussi des pages qui doivent elles être stockées dans le dossier content/pages. Elles ont le même fonctionnement que les articles, sans l'obligation d'indiquer de catégories (pas de tags non plus). Les articles peuvent donc être regroupés par catégories (ce que beaucoup de template (theme) Pelican proposent) alors que les pages sont des éléments uniques comme la page "A propos" d'un site.
Publier des images[modifier | modifier le wikicode]
Chaque langage de balisages léger propose une syntaxe pour faire un lien vers une image qui sera affichée. Qu'importe le langage, il est conseillé de rajouter un dossier images dans le content et d'y mettre les images que l'on veut afficher dans un articles. Il est ensuite nécessaire d'ajouter la variable STATIC_PATHS = ['images'] dans le pelicanconf.py. Voilà, normalement les images doivent s'afficher dans les pages web !
Plus loin dans la publication[modifier | modifier le wikicode]
Les thèmes[modifier | modifier le wikicode]
C'est bien beau d'écrire ses articles et de les publier mais quel est l’intérêt si tout les sites se ressemble? Surtout que nous ne voulons pas tous faire du micro-bloging ou un recueil de tuto ! Heureusement il n'existe pas qu'un seul thème sur Pelican. Allez faire un tour sur le github de pelican ou sur le site pelicanthemes.com pour vous en rendre compte. La manière la plus simple pour en utiliser un est de le télécharger. Si le site est généré à partir de content, il est possible de lui donner une infinité de forme. Cela grâce aux templates. Ils génèrent un code html en suivant des règles qu'on lui fournit. Par exemple....
