Introduction on Documentation plopcom.fr

Creating a New Theme

Sat, 16 Nov 2024 00:00:00 +0000

nouveau site de doc avec hugo sur la base du theme hugo book by alex-shpak

Mon, 01 Jan 0001 00:00:00 +0000

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/TjaO_YpiG4s" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

2 widgets dans le dossier code_personalise_gjanssens

accès et connexion

Mon, 01 Jan 0001 00:00:00 +0000

Pour accèder à l’administration visiter val-revermont.fr/admin/

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/taRFQMqet7c" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

Accès rapide

Mon, 01 Jan 0001 00:00:00 +0000

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/dk-ujLydwQA" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

Le module d’accès rapide se gère via Modules > Accès rapides

Agenda et actualités

Mon, 01 Jan 0001 00:00:00 +0000

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/itYbtEGgBa4" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

Les modules d’agenda et actualités sont similaire dans leurs fonctionnements et se gèrent respectivement via Modules > Actualités et Modules > Agenda

arborescence, recherche et edition de page

Mon, 01 Jan 0001 00:00:00 +0000

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/Y7eryepLn98" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

Image d'accroche

Mon, 01 Jan 0001 00:00:00 +0000

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/6Aq9Ifzc_i0" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

Les images d’accroche s’éditent dans les propriétés de la page dans l’onglet “contenu et mise en page”

pour les articles

Mon, 01 Jan 0001 00:00:00 +0000

Dans les articles de blog, l’image principale est servie en plusieurs résolution :

ecrans < 320px :

320x180

entre 320px et 480px :

320x180

entre 480px et 768px :

480x270

entre 768px et 1024px :

768x432

a partir de 1024px :

1024x576

Toutes les images sont mises au format webp et en qualité 90%.

pour les blocs

Mon, 01 Jan 0001 00:00:00 +0000

Dans les blocs “texte image”, les images ajoutées sont croppée en format carré (1:1) de 420x420 et 350x350 et affichées suivant la taille de l’écran.

les images des blocs avec une décoration sont croppées au format 8:5 (672x420 et 560x350)

Les images sont mises au format webp et en qualité 90%.

pour les pages

Mon, 01 Jan 0001 00:00:00 +0000

Sur les pages illustrées par une image, l’image servie dépend de la résolution de l’écran

< 480px

image redimentionnée à 360px de large

entre 480px et 768px :

image redimentionnée à 576px de large

entre 768px et 1196px :

image redimentionnée à 897px de large

au delà de 1196px

image redimentionnée à 1200px

Toutes les images sont mises au format webp et en qualité 90%.

presentation de l'admnistration

Mon, 01 Jan 0001 00:00:00 +0000

* { padding: 0; margin: 0; overflow: hidden; } body, html { height: 100%; } img, svg { position: absolute; width: 100%; top: 0; bottom: 0; margin: auto; } svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 70.7%, 8%)); transition: all 250ms ease-in-out; } body:hover svg { filter: drop-shadow(1px 1px 10px hsl(206.5, 0%, 10%)); transform: scale(1.2); } " src="https://www.youtube.com/embed/Y7eryepLn98" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>