Le calepin du geek
Geek : Personne s’intéressant à des domaines pointus, avec une once de créativité.

Ceci est un site perso, dans le pur esprit web 1.0, compilant des notes diverses sur des thèmes d’intérêt. (Informatique, programmation, voyage à vélo, réflexions)

À propos de ce site
Article mis en ligne le 5 mai 2013
par aldoniel
Imprimer cet article logo imprimer

Il fonctionne avec SPIP et Escal.
La rédaction se fait en local (c’est à dire sur un serveur installé sur mon PC) en hors-ligne.
Quand j’ai fini, je l’exporte en html que j’envoie en ligne en ftp comme dans l’ancien temps...
La technique utilisée est décrite là : Rédiger un site en hors-ligne avec SPIP et WinHTTrack

 Utiliser les mots-clés

C’est tellement évident pour les concepteurs, qu’il faut chercher un peu pour activer la fonction.

  • Activer les mots-clés (1)
    • Configuration —> Contenu du site —> Les mots-clés —> Utiliser les mots-clés
  • Activer les mots-clés (2)
    • Édition —> Mots-clés
    • Créer les groupes (affichage...) et les peupler des mots indiqués sur le site des auteurs
    • Dans le sous-titre du groupe (affichage) —> Modifier ce groupe de mots
    • Dans "Les mots-clés de ce groupe peuvent être associés" Tout cocher, ça évitera de chercher 50 ans plus tard.
  • Aller dans un article / rubrique, etc. l’enregistrer et le rouvrir.
    • "Ajouter un mot-clé" apparaît (enfin !) dans ses propriétés !

 Utiliser le mots-clé "favori"

  • Configuration —> Contenu du site —> Référencement de sites et syndication
    • cocher "Gérer un annuaire de sites Web"
  • Édition : "Sites référencés" apparaît !
  • Ajout du mot-clé (idem article)

 Code

Les CMS, parfois c’est plus dur à prendre en main que d’écrire du code... d’autant plus qu’on finit par y retourner quand ça veut pas. Et là, dans la bête, va trouver les lignes à changer.

 Le bandeau

  • \plugins\auto\escal_V3
    • modifier inc-bandeau.html
  • \plugins\auto\escal_V3\styles
    • modifier general.css

 Google Map API for dummies

C’est ballot, j’aurais bien utilisé notre service national le Geoportail à la place, mais il faut rédiger son code (pas le temps), et y inclure en dur les url des fichiers kml (ce qui s’intègre mal avec un CMS).
Il y a bien un générateur de code là http://actu-loisirs.ign.fr/gilles/w... (le leur ne marche pas encore).

 Sur Google MAP, c’est simple : il y a un générateur de code.

  • créer un compte google (concernant cette API, on reste propriétaire des données fournies... ce qui n’est pas toujours le cas avec google. On partage juste irrévocablement avec eux l’usufruit mondialement).
  • Aller sur https://maps.google.fr/
  • —> Mes adresses —> "Ou créer une carte avec la version standard de Mes cartes" (ne pas cliquer sur créer une carte, c’est en béta et ça ne gère pas le KML) —> Importer
  • choisir un fichier KML précédemment exporté depuis google earth

Facile, tout est hébergé chez google (et dépend de leur bon vouloir)

Cliquer sur la petite icône lien o-o —> "Personnaliser et prévisualiser la carte intégrée"

Voilà : une fenêtre avec un code à insérer dans SPIP entre deux balises <html>là</html>

 Miniatures fonctionnelles

Problème : certaines images du site apparaissent dans une taille ridiculement grande (ex : Dans le résumé des derniers articles à la une, normalement réduites à 150 pixels dans inc-une_derniers.html), ou, à l’activation du portifolio, les images sont remplacées par une icône d’image...

Soluce : Configuration —> Fonctions avancées —> Génération de miniatures des images —> "cocher Générer automatiquement les miniatures des images"...

Lire ceci au passage sur les codes http://grand-angle.iguane.org/spip....

 et images en taille réelle

Dans inc-article.html, se trouve deux fois (#TEXTE|image_reduire{400}). Ça réduit à 400 px la taille de mes images même en embded ! Je peux encore les réduire en local si j’en ai envie !
=> À remplacer par (#TEXTE) pour retrouver le comportement normal de SPIP et afficher les images en pleine résolution.

 hack pour sauter un espace quand vraiment ça veut pas

<html>
<style>
 .bottom-three {
    margin-bottom: 1cm;
 }
</style>

<p class="bottom-three">
<br>
</p>
</html>

A télécharger

Pas de documents à télécharger pour cet article


Site réalisé sous SPIP
avec le squelette ESCAL-V3
Version : 3.70.61