Cette liste d'actions est la documentation générée automatiquement par le plugin à partir des informations récupérés dans le code source de l'action.

🆙 addclass : ajoute une classe à un sélecteur CSS (body par défaut.) DEMO
Il est possible :
- de cibler le parent d'un sélecteur CSS ou être relatif à l'emplacement du shortcode
- de créer la règle CSS avec l'option 'css-head=.foo[color:red]'
syntaxe {up addclass=nom_classe}
Utilisation : changer l'image de fond à partir d'un article
@author: LOMART @version: UP-0.9 @license: GNU/GPLv3 @tags: Expert
  • addclass: nom de la classe ajoutée à la balise
  • selector = body: balise cible. Ne pas oublier le point pour une classe ou le # pour un ID
  • parent: 1 si on cible le parent de selector, 2 le grand-père, ...

options secondaires

  • id: identifiant
  • css-head (base-css): code CSS pour head. Attention utiliser [] au lieu de {}
  • filter: conditions. Voir doc action filter (v1.8)
🆙 addcodehead : ajoute du code libre dans le head. DEMO
possibilité d'ajouter du code libre dans le head sans risque de nettoyage par un éditeur WYSIWYG
syntaxe 1 {up addCodeHead=}
syntaxe 2 {up addCodeHead=meta | property=og:title | content=Page title}
Attention : l'option XXX doit être remplacée directement dans le shortcode par un nom d'attribut et sa valeur
@author: LOMART @version: UP-0.9 @license: GNU/GPLv3 @tags: Expert
  • addcodehead: code à ajouter dans le head ou balise
  • xxx = yyy: couple attribut-valeur. ex: title=le titre, href=//google.fr

options secondaires

  • filter: conditions. Voir doc action filter (v1.8)
  • id: identifiant
🆙 addcsshead : ajoute du code ou fichier CSS dans le head. DEMO
sans risque de nettoyage par un éditeur WYSIWYG
syntaxe 1 {up addCssHead=.foo[color:red]} Attention: mettre des [ ] au lieu de {}
syntaxe 2 {up addCssHead}.foo{color:red}{/up addCssHead}
syntaxe 3 {up addCssHead=chemin_fichier_css}
Utilisation : charger un fichier CSS spécifique à une page
@author: LOMART @version: UP-0.9 @license: GNU/GPLv3 @tags: Expert
  • addcsshead: fichier ou code CSS. ATTENTION [ ] à la place des {} pour code dans shortcode
  • filter: conditions. Voir doc action filter (v1.8)
  • id: identifiant
🆙 addscript : ajoute du code ou un fichier JS ou JQuery DEMO
Par défaut, le code est ajouté dans le head.
Si le paramètre principal est body, le code est inséré à la position du shortcode
syntaxe {up addScript=body | jquery }code ou fichier{/up addScript}
@author: LOMART @version: UP-1.3.1 @license: GNU/GPLv3 @tags: Expert
  • addscript = head: ou body pour insérer le code à la position du shortcode
  • jquery: 1: entoure avec appel jquery (sauf fichier)
  • filter: conditions. Voir doc action filter (v1.8)
  • id: identifiant
🆙 ajax_view : Affiche un bouton pour charger le contenu d'un article ou un fichier DEMO
il est possible de demander un mot de passe
syntaxe {up ajax-view=999 | btn-label=Voir un article}
syntaxe {up ajax-view=fichier.ext | btn-label=afficher un fichier}
syntaxe {up ajax-view=fichier.jpg | btn-label=[img src='photo-mini.jpg'][br]Cliquer pour voir l'image en grand | password=1234}
@author: LOMART @version: UP-2.9 @license: GNU/GPLv3 @tags: editor
  • ajax_view: id article ou chemin vers fichier txt ou image

Style du bouton d'appel du contenu ajax

  • btn-label = en=load content;fr=charger le contenu: texte sur le bouton appel
  • btn-style = btn btn-primary: style et classe du bouton appel
  • btn-tag = div: balise principale

Demande de mot de passe

  • password: mot de passe pour télécharger le fichier

options secondaires

  • HTML: 0= aucun traitement, 1=affiche le code, ou liste des tags à garder (ex: img,a)
  • EOL: forcer un retour à la ligne
  • ext-images = jpg,png,gif,webp: les extensions des fichiers images autorisés

Style

  • id: identifiant
  • main-tag (block) = div: balise principale
  • class: classe(s) pour bloc
  • style: style inline pour bloc
  • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
🆙 anim_aos : affiche du contenu avec des animations sur scroll de page (librarie en pure JS) DEMO
syntaxe 1 : anime le contenu du shortcode
{up anim-aos} votre texte {/up anim-aos}
syntaxe 2 : anime les tags indiqués dans le contenu
{up anim-aos | repeat=liste tags} contenu avec les tags cibles {/up anim-aos}
syntaxe 3 : anime tous les tags indiqués à partir de la position du shortcode jusqu'à la fin de l'article
{up anim-aos | repeat=liste tags}
@author: Conseilgouz @version: UP-1.6.3 @license: GNU/GPLv3 @credit: Script de michalsnik @tags: layout-dynamic
  • anim_aos = zoom-in-right: nom de l'animation
  • delay: délai en millisecondes (50-3000 ms)
  • duration: durée animation en millisecondes (50-3000 ms)
  • easing: effet: linear, ease-in-back, ease-out-cubic, ease-in-sine
  • offset: en px, hauteur pour déclenchement par rapport au bas de l'écran.
  • anchor-placement: déclenche l'effet lorsque le scrolling de l'élément arrive à certaines positions
  • once: one-time effect or not
  • repeat: applique l'effet à tous les tags. Ex: h2,h3
  • css-before: style de l'élément avant l'animation
  • css-after: style de l'élément après l'animation
  • id: identifiant
  • style: style inline appliqué au bloc
  • class: classe(s) appliquée(s) au bloc
🆙 attr : Ajoute des attributs à la première balise interne DEMO
syntaxe {up attr | class=bg-yellow}< p>texte< /p>{/up attr}
syntaxe {up attr | class=bg-yellow | tag=img}

< img src="/image.jpg" >

{/up attr}
@version: UP-2.6 @author: Lomart @license: GNU/GPLv3 @tags: HTML
  • attr: classe(s) et/ou style
  • tag: balise recherchée, sinon la première

Toutes les autres clés sont considérées comme des attributs

  • xxx = yyy: couple attribut-valeur. ex: title=le titre, href=//google.fr

options secondaires

  • id: identifiant
  • class: classe(s) pour bloc interne
  • style: style inline pour bloc interne
  • css-head (base-css): style ajouté dans le HEAD de la page
🆙 barcode : Création de code à barres à partir de la librairie TCPDF. DEMO
syntaxe : {up barcode=text | type=...|height=..|width=...|color=...}
@author: ConseilGouz @version: UP-1.8 @license: GNU/GPLv3 @tags: Widget
  • barcode = text: valeur alphanumérique du code code barre
  • type = EAN13: type de code-barres : C39,C39+,C39E,C39E+,C93,S25,S25+,I25,C128,C128A,C128B,EAN2,EAN5,EAN8,EAN13,UCPA,UPCE,MSI,MSI+,POSTNET,PLANET,RMS4CC,KIX,IMB,IMBPRE,CODABOR,CODE11,PHARMA,PHARMA2
  • format = html: format de sortie
  • height (h,hauteur) = 30: hauteur du code à barres
  • width (l,largeur,w) = 1: espacement des barres
  • color = #000: Couleur du code-barre. En mode PNG, on attend des valeurs RGB séparées par des virgules, sinon la couleur en forme texte.
  • align = center: alignement code barres et texte (left, center, right)
  • showtext = 1: montrer le texte ayant permis de générer le code barres

styles

  • id: identifiant
  • class: Class(s) pour bloc
  • style: Inline style pour bloc
  • css-head (base-css): Régles CSS définie par le webmaster (ajoutées dans head)
🆙 bbcode : Saisir du code HTML avec un éditeur WYSIWYG DEMO
syntax 1 {up bbcode=content}
syntax 2 {up bbcode} content {/up bbcode}
@author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: Editor
  • bbcode: contenu au format BBCODE
  • tags: balises à traiter. vide: par défaut, liste (a,b,p) ou balise en plus de défaut (+a,b,p)
  • css-head (base-css): style ajouté dans le HEAD de la page
🆙 bg_image : Affiche une image en fond d'un bloc DEMO
syntaxe :
fond du site : {up bg-image=chemin_image}
fond du bloc : {up bg-image=chemin_image} contenu {/up bg-image}
fond d'un autre bloc : {up bg-image=chemin_image | bg-selector=#foo}
doc : https://developer.mozilla.org/fr/docs/Web/CSS/background
@author: LOMART @version: UP-1.5 @license: GNU/GPLv3 @tags: Body

    images

    • bg_image: images séparées par des points-virgules
    • mobile: image ou règle(s) css (si smartphone)
    • path: chemin de base ajouté devant le nom des fichiers

    emplacement du fond image

    • bg-selector = body: sélecteur du bloc pour image(s) de fond

    paramètres de l'image

    • bg-color: couleur sous image
    • bg-repeat = no-repeat: répétition de l'image : no-repeat, repeat-x, repeat-y, repeat, space
    • bg-position = center: position de l'image : left|center|right top|center|bottom
    • bg-size = cover: remplissage : cover, contain, 100%, 100px
    • bg-attachment = scroll: défilement de l'image : scroll, fixed, local
    • bg-overlay: image ajoutée en overlay

    transparence du contenu de la page

    • page-selector: si un bloc est défini, sélecteur du bloc sur lequel appliquer la transparence
    • page-overlay = 70: transparence sous la forme 70, #RGBA, image overlay ou règle CSS

    options secondaires

    • filter: conditions. Voir doc action filter (v1.8)
    • center: centrage vertical du contenu entre shortcodes
    • id:
    • style: style inline pour bloc
    • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
    🆙 bg_slideshow : Affiche une série d'images défilantes en fond du site ou d'un bloc DEMO
    syntaxe :
    fond site : {up bg-slideshow=liste images ou dossier}
    fond bloc : {up bg-slideshow=liste images ou dossier}contenu{/up bg-slideshow}
    fond autre bloc : {up bg-slideshow=liste images ou dossier | bg-selector=#foo}
    doc : https://developer.mozilla.org/fr/docs/Web/CSS/background
    @author: LOMART @version: UP-1.5 @license: GNU/GPLv3 @credit: Vegas de jaysalvat @tags: Body

      images

      • bg_slideshow: dossier ou images séparées par des points-virgules
      • mobile: image ou règle(s) css
      • path: chemin commun aux images indiquées en argument principal

      emplacement du fond image

      • bg-selector = body: bloc portant le slideshow

      paramètres de l'image

      • bg-overlay: calque superposé à l'image de fond (png, opacité, RGBA, CSS)
      • bg-color: couleur sous image

      transparence du contenu de la page

      • page-selector: bloc sur contenu
      • page-overlay: background de page-selector (png, opacité, RGBA, CSS)

      options secondaires

      • filter: conditions. Voir doc action filter (v1.8)
      • center = 1: centrage vertical du contenu entre shortcodes
      • id: identifiant
      • style: classes et styles inline pour bloc créé
      • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
      • js-options: options non prévues par l'action

      paramétres de l'animation

      • delay = 5000: durée par image
      • transition = fade: random,blur,flash,negative,burn,slideLeft,slideRight,slideUp,slideDown,zoomIn,zoomOut,swirlLeft,swirlRight
      • transitionDuration = 1000: durée transition
      • animation: kenburns,kenburnsLeft,kenburnsUp,kenburnsDown,kenburnsUpLeft,kenburnsUpRight,kenburnsDownLeft,kenburnsDownRight,random
      • animationDuration = auto: durée des animations
      • timer = 1: affiche barre de progression
      🆙 bg_video : Affiche une video locale ou youtube en fond de site ou dans un bloc DEMO
      syntaxe :
      fond site : {up bg-video=fichier video}
      fond bloc : {up bg-video=fichier video}content{/up bg-video}
      @author: LOMART @version: UP-1.5 @license: GNU/GPLv3 @credit: Script videoBackground de lemehovskiy @tags: Body

        video

        • bg_video: fichier video ou ID video Youtube.
        • poster: fichier image affiché avant chargement vidéo
        • mobile: image ou css si un appareil mobile est détecté

        paramètres de la vidéo

        • bg-position = 50% 50%: 50% 50% = position poster et video
        • bg-ratio = 16/9: proportion de la video
        • bg-overlay: calque superposé à l'image de fond (png, opacité, RGBA, CSS)
        • bg-color: couleur de fond sous la vidéo lors chargement

        transparence du contenu de la page

        • page-selector: bloc sur contenu
        • page-overlay: background de page-selector (png, opacité, RGBA, CSS)

        options secondaires

        • center: style et classe pour centrage vertical du contenu entre shortcodes
        • filter: conditions. Voir doc action filter (v1.8)
        • id: identifiant
        • style: classes et style inline pour bloc créé
        • class: classes pour bloc créé (deprecated)
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

        gestion tarteaucitron

        • height (h,hauteur) = 400px: hauteur d'une video Youtube ou Vimeo avec tarteaucitron
        • rgpd = 1: 0 pour ne pas appliquer la règle pour le RGPD
        🆙 box : affiche une boite avec un tite, sous-titre, image, contenu et action DEMO
        syntaxe: {up box=model | title=title}contenu HTML{/up box}
        ##title## ##title-link## ##subtitle## ##subtitle-link## ##title-subtitle## ##title-subtitle-link##
        ##link## ##target##
        ##image## ##image-link## ##image-css## ##image-css-xxx##
        ##action-link## ##action-text##
        ##content##
        ##head## & ##/head## : une balise DIV avec les attributs définis par head-class & head-style
        ##body## & ##/body##
        @author: LOMART @version: UP-1.9.5 @license: GNU/GPLv3 @tags: Layout-static
        • box: model [danger, info] ou prefset
        • template (item-template) = ##head## ##title-link## ##subtitle## ##image## ##/head## ##content## ##action-link##: modèle
        • multibox = 3-2-1: nombre de blocs sur la même ligne (desktop-tablet-mobile)
        • multibox-class = fg-vspace-between-1: classe(s) pour le bloc externe
        • multibox-style: style CSS pour le bloc externe

        box

        • id:
        • class: classe(s) pour la box
        • style: style inline pour la box

        title

        • title (titre): titre. Si vide et demandé : on prend le premier hx du contenu
        • title-tag = h4: balise pour titre
        • title-class: class user pour titre
        • title-style: style inline pour titre
        • title-link-class: class user pour titre avec lien
        • title-link-style: style inline pour titre avec lien

        subtitle

        • subtitle: sous-titre
        • subtitle-tag = h5: mise en forme du sous-titre
        • subtitle-class: class user pour sous-titre
        • subtitle-style: style inline pour sous-titre
        • subtitle-link-class: class user pour sous-titre avec lien
        • subtitle-link-style: style inline pour sous-titre avec lien

        image

        • image: image. Si vide et demandée : on prend la première image du contenu
        • image-alt: texte alternatif pour l'image. Par défaut, le nom du fichier humanisé
        • image-class: class user pour image
        • image-style: style inline pour image
        • image-link-class: class user pour image avec lien
        • image-link-style: style inline pour image avec lien

        action

        • action: texte du bouton action
        • action-tag = div: mise en forme du bouton action
        • action-class: class user pour action
        • action-style: style inline pour action
        • action-link-class: class user pour action avec lien
        • action-link-style: style inline pour action avec lien

        link

        • link: lien. . Si vide et demandé : on prend le premier lien sur title ou image
        • link-target: _blank pour nouvelle fenêtre

        header

        • head-class: class pour le bloc entête. en général title, subtitle, image
        • head-style: style pour le bloc entête

        body

        • body-class: class pour le bloc. en général content et action
        • body-style: style pour le bloc. en général content et action

        general

        • css-head (base-css): style CSS inséré dans le HEAD
        • align-vertical = fg-vspace-between-1: type de repartition verticale en multibox
        🆙 cache_cleaner : Efface les fichiers du cache DEMO
        Supprime tous les fichiers PHP du sous-dossier indiqué en option. com_content par défaut
        syntaxe {up cache-cleaner=com_modules} // defaut : com_content
        @version: UP-2.6 @author: Lomart @license: GNU/GPLv3 @tags: Expert
        • cache_cleaner = com_content: liste des dossiers du cache (séparateur: point-virgule)
        🆙 cell : affiche de 1 à 6 blocs enfants sur une même ligne DEMO
        syntaxe 1 : {up cell=x1-x2}contenu avec 2 blocs enfants{/up cell}
        syntaxe 2 : {up cell=x1-x2}contenu cell-1 {====} contenu cell-2{/up cell}
        x1-x2 sont les largeurs sur la base d'une grille de 12 colonnes
        exemple cell=6-6 pour 2 colonnes égales.
        On utilise les largeurs de la classe UP-width
        @author: Lomart @version: UP-0.9 @license: GNU/GPLv3 @tags: Layout-static
        • cell = 12: nombre de colonnes
        • mobile: nombre de colonnes sur petit écran
        • tablet: nombre de colonnes sur moyen écran

        style des blocs enfants (colonnes)

        • class-*: class pour tous les blocs colonnes. sinon voir class-1 à class-6
        • style-*: style inline pour tous les blocs colonnes. sinon voir style-1 à style-6

        style et options secondaires

        • id: identifiant
        • class: class bloc principal
        • style: style inline bloc parent
        • filter: conditions. Voir doc action filter (v1.8)
        🆙 center : Centre tous les blocs enfants en supprimant les margins superflus DEMO
        syntaxe {up center=classe/style(s)}contenu{/up center}
        note: cette action reconnait les classes et les styles dans : bg-yellow;color:red
        @author: LOMART @version: UP-1.5 @license: GNU/GPLv3 @tags: HTML
        • center: classe(s) et style(s) pour le bloc interne (celui qui est centré)
        • id: identifiant
        • class: classe(s) pour bloc externe
        • style: style inline pour bloc externe
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        🆙 chart : Graphiques statistiques avec GoogleChart DEMO
        syntaxe {up chart=type_chart}... data ...{/up chart}
        @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @credit: https://developers.google.com/chart/interactive/docs @tags: Widget
        • chart: type de chart : area, bar,bubble,column,combo,line,pie,scatter,SteppedArea
        • separator: séparateur des valeurs dans la liste

        mise en forme du graph

        • area: valeur en % dans l'ordre : left, top, width, height. EX: 10,25,90,75
        • maximized: affichage remplit le bloc
        • height (h,hauteur): min-height bloc parent
        • colors: liste des couleurs

        titre du graph

        • title (titre): titre du graphique
        • title-position: in, out, none (defaut)
        • title-style: color: 'blue', fontsize: '14px', bold:true (attention à la syntaxe)

        légende du graph

        • legend-position: in, none (defaut), top, bottom
        • legend-style: ex: color:'blue',fontSize:14,bold:true

        Paramètres spécifiques selon le type de graph

        • vertical: horizontal par défaut ou vertical. Tous sauf bar et bubble
        • bar-width: largeur des barres en %. Area, bubble, pie, scatter & stepped
        • 3D: camembert en relief. Tous sauf pie
        • donut: part du trou central. ex: 0.5 pour la moitié. uniquement pour pie
        • isstacked: 0, true (absolute) ou relative. Tous sauf bubble, line, pie & scatter
        • options: les autres options proposées par google.chart (remplacer {} par [] dans la chaine JSON )

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 chart_org : Affiche le graphe d'une organisation DEMO
        syntaxe {up chart-org} liste UL / OL {/up chart-org}
        @version: UP-2.2 @license: GNU/GPLv3 @author: Lomart @credit: script Responsive Hierarchical Organization Chart In Pure CSS de erinesullivan @tags: Widget
        • chart_org: aucun argument
        • line-color: couleur liaisons entre bloc
        • color-bg: couleur arrière-plan par défaut des blocs
        • color-text: couleur par défaut des textes
        • border: bordure (outline) par défaut des blocs. ex: 1px red solid
        • radius: arrondi des blocs. border doit être none

        style des blocs selon le niveau

        • color-bg-*: couleur des blocs de niveau 1 à 6
        • color-text-*: couleur des blocs de niveau 1 à 6
        • border-*: bordure (outline) des blocs de niveau 1 à 6. ex: 1px red solid

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 clocks_gmt : Affiche une horloge analogique et/ou digitale avec l'heure d'un fuseau horaire DEMO
        syntaxe {up clocks-gmt=ville | offset=décalage horaire}
        @author: LOMART @version: UP-1.4 @license: GNU/GPLv3 @credit: script jClocksGMT de mcmastermind @tags: Widget
        • clocks_gmt: Nom de la ville (pour légende)
        • label-style: style inline pour le nom ville
        • digital-style: style inline pour horloge digitale
        • date-style: style inline pour date
        • base-js-params: règles JS définies par le webmaster (ajout dans init JS)

        style général

        • id: id genérée automatiquement par UP
        • class: classe(s) ajoutées au bloc principal
        • style: style inline ajouté au bloc principal
        • css-head (base-css): autres règles CSS définies par le webmaster (ajout dans le head)

        Paramétres Javascript pour l'horloge

        • offset: GMT offset
        • title (titre) = Greenwich, England: titre
        • skin = 1: indice images (voir la démo)
        • dst = 1: gestion heure d'été
        • analog = 1: afficher horloge analogique
        • digital = 1: afficher horloge digitale
        • timeformat = HH:mm: format pour la date
        • date: afficher la date
        • dateformat = MM/DD/YYYY: format pour l'heure
        • imgpath: chemin vers les images
        🆙 color : retourne la valeur d'une couleur de la feuille de style de UP DEMO
        syntaxe {up color=UP-COLOR-NAME}
        @version: UP-2.5 @author: Lomart @license: GNU/GPLv3 @tags: HTML
        • color: nom UP de la couleur (français ou anglais) ou de la variable CSS (--red)
        • default = #000: couleur retournée si nom couleur inexistant
        • info: affiche la liste des couleurs avec leurs valeurs
        🆙 corner : Affiche un texte sur ruban dans un angle DEMO
        syntaxe 1 (body) : {up corner=texte}
        syntaxe 2 (bloc) : {up corner=texte}contenu du bloc{/up corner}
        @author: LOMART @version: UP-1.6 @license: GNU/GPLv3 @tags: Body
        • corner: texte affiché dans le coin ou ruban

        position, taille et style du corner

        • position = top-left: angle sous la forme top-left ou tl
        • width (l,largeur,w) = 100px: coté du carré
        • height (h,hauteur) = 100px: coté du carré
        • angle = 45: angle en valeur absolue
        • shadow: ajoute une ombre 'orientée' au corner. La valeur indiquée est la force de l'ombre
        • color = #ffffff: couleur du texte
        • bgcolor = #ff0000: couleur de fond du coin
        • style: styles CSS (non proposés ci-dessus) pour le coin
        • class: idem style

        si le corner est clicable

        • url: lien
        • target = _blank: ou _self pour ouvrir le site dans le même onglet

        style du bloc si le shortcode a un contenu

        • bloc-class: classe(s) pour bloc
        • bloc-style: style inline pour bloc

        style et options secondaire

        • id: identifiant
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        • filter: chaine de conditions. Voir documentation filter
        🆙 countdown : affiche un compte à rebours ou une horloge digitale DEMO
        syntaxe:
        {up countdown=201801010000} // délai jusqu'à une date
        {up countdown=120} // compte à rebours en secondes
        {up countdown} // affiche une horloge
        @author: Lomart @version: UP-0.9 @license: GNU/GPLv3 @credit: Lexxus - jq-timeTo @tags: widget
        • countdown: date, nombre de secondes ou vide pour horloge
        • align: left, center ou right

        style et options secondaires

        • id: identifiant
        • class: classe
        • style: style inline
        • filter: condition d'éxécution

        paramétres Javascript pour configuration du compteur

        • callback: Fonction appelée à la fin du compte à rebours
        • captionSize: fontsize legendes
        • countdownAlertLimit = 10: alerte en seconde avant fin countdown
        • displayCaptions: 1 = légendes affichées
        • displayDays: nb chiffres affichés pour jours
        • fontFamily = Verdana, sans-serif: Police pour chiffres
        • fontSize = 28: Taille police en pixels pour chiffres
        • lang = en: Défini automatiquement par UP
        • seconds: Temps initial en secondes pour le compte à rebours
        • start = 1: démarrer automatiquement la minuterie
        • theme = white: style : white, black ou blue
        🆙 countdown_simple : Affiche un compte à rebours simple et facilement adaptable par CSS DEMO
        syntaxe {up countdown-simple=AAAAMMJJHHMM}
        @author: LOMART @version: UP-2.2 @license: GNU/GPLv3 @credit: Countdown From A Specific Date de anik4e @tags: widget
        • countdown_simple: date cible ou délai si débute par +
        • model: CSS de base pour la présentation (digital, rainbow)
        • digit-view = YMDHMS: afficheurs. Mettre un X pour ne pas l'afficher. Pour les premiers non affichés, la valeur sera convertie et ajoutée au premier affiché

        Textes ajoutés au compteur

        • intro-text: texte avant les afficheurs
        • close-text: texte après les afficheurs
        • prefix: texte avant valeur
        • suffix = lang[en=years,months,days,hours,minutes,seconds;fr=années,mois,jours,heures,minutes,secondes]: texte après valeur
        • elapsed-text = lang[en=Too late;fr=Trop tard]: Texte ou bbcode affiché si délai écoulé

        style des chiffres

        • digit-class: classe(s) pour les chiffres
        • zero: ajoute un zéro devant les heures, minutes et secondes

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        • filter: condition d'éxécution
        🆙 counter : Ajoute un compteur avec prefix et suffix DEMO
        Syntaxe : {up counter=0,100}
        @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @credit: jquery-simple-counter de marcovincit @tags: Widget
        • counter: min,max : valeurs de départ et de fin
        • width (l,largeur,w): largeur minimal (par défaut en pixels)
        • mono = 1: force la police en monospace

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        • filter: conditions. Voir doc action filter (v1.8)

        paramétres Javascript pour configuration du compteur

        • start: valeur de départ du compteur
        • end = 100: valeur d'arrivée du compteur
        • easing = swing: ou linear : effet
        • duration = 1500: durée du décompte en millisecondes
        • prefix: texte devant compteur. BBcode autorisé
        • suffix: texte après compteur. BBcode autorisé
        🆙 csv2def : Conversion d'un contenu au format CSV en liste de définition (DL/DT/DD) DEMO
        1/ {up csv2def=emplacement-fichier} // le contenu est lu dans un fichier
        2/ {up csv2def}
        [=item=]definition
        [=item1; "item;2"; ...=]
        definition1
        {===}
        definition 2
        {/up csv2def}
        @author: LOMART @version: UP-1.6 @license: GNU/GPLv3 @tags: layout-static
        • csv2def: chemin vers fichier à afficher
        • separator = ;: séparateur des colonnes (fichier uniquement)
        • HTML: pour fichier (contenu CSV): 0=affiche le rendu, 1=affiche le code ou liste des tags conservés (strip_tags)
        • model = stack: stack: empile par défaut. flex: sur 2 colonnes

        Style du bloc liste de définition

        • class: classe(s) pour la balise DL
        • style: style inline pour la balise DL

        Style des termes définis (DT)

        • term-class: classe(s) pour le bloc des termes
        • term-style: style pour le bloc des termes
        • term-style-separator: style pour séparer les différents termes

        Style des définitions (DD)

        • def-class: classe(s) pour le bloc des definitions
        • def-style: style pour le bloc des définitions
        • def-style-separator: style pour séparer les différentes définitions

        ne concerne que le mode FLEX

        • flex-vgap = 10: espace vertical (px) entre les blocs dt/dd
        • flex-hgap = 10: espace horizontal (px) entre les blocs dt et dd
        • flex-term-width = 25: largeur en pourcentage de la colonne des termes

        options secondaires

        • id: identifiant
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        🆙 csv2list : Conversion d'un contenu au format CSV en liste avec point de conduite DEMO
        1/ {up csv2list=emplacement-fichier} // le contenu est lu dans un fichier
        2/ {up csv2list}
        article 1;5€
        article 2;25€
        {/up csv2list}
        Ressources : caractères unicode, caractères spéciaux et couleurs sures
        @author: LOMART @version: UP-1.6 @license: GNU/GPLv3 @tags: layout-static
        • csv2list: chemin vers fichier à afficher
        • separator = ;: séparateur des colonnes
        • HTML = b,a,span,strong,i,em,u,mark,small,img,code: 0= aucun traitement, 1=affiche le code, ou liste des tags a garder (strip_tags)
        • model = stack: nom de la classe modèle dans le fichier csv2list.css

        Style des points de conduite

        • leaders: points de conduite
        • leaders-color: couleur points de conduite

        style du bloc principal de la liste

        • class: classe(s) pour la balise UL
        • style: style inline pour la balise UL
        • bgcolor: couleur de fond. #FFF par defaut

        style des lignes de la liste

        • col-style-*: style inline pour les nièmes balise SPAN
        • list-style: code hexadecimal et couleur du caractère (bb,red ou 26BD,#F00)

        Style de l'entête

        • header: 0: pas de titre, 1: la première ligne du contenu sera le titre des colonnes
        • header-class: classe(s) pour la première balise LI si titre
        • header-style: style pour la première balise LI si titre
        • header-bgcolor: couleur de fond du titre

        Style du pied de liste

        • footer: 0: pas de pied, 1: la dernière ligne du contenu sera le pied des colonnes
        • footer-class: classe(s) pour la dernière balise LI si pied
        • footer-style: style pour la dernière balise LI si pied
        • footer-bgcolor: couleur de fond de la dernière ligne

        style et options secondaires

        • id: identifiant
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        🆙 csv2table : Conversion d'un contenu au format CSV en table DEMO
        1/ le contenu est lu dans un fichier
        {up csv2table=emplacement-fichier}
        2/ le contenu est saisi entre les shortcodes
        {up csv2table}
        article 1;5€
        "article 2";25€
        {/up csv2table}
        @author: LOMART @version: UP-1.6 @license: GNU/GPLv3 @tags: layout-static
        • csv2table: URL ou chemin et nom d'un fichier local
        • separator = ;: séparateur des colonnes
        • HTML: 0= aucun traitement, 1=affiche le code, ou liste des tags a garder (strip_tags)
        • model: nom de la classe modèle dans le fichier csv2table.css : noborder, line, blue, green

        style de la table

        • class: classe(s) pour la table
        • style: style inline pour la table

        style des colonnes

        • col-list: liste des colonnes utilisées. ex: 1,2,5 (v2.8)
        • col: alignement et largeur des colonnes sous la forme x-D-C5-100 pour rien-droite-centre 5%-100% (voir doc)
        • col-style-*: style inline pour tous les blocs colonnes. sinon voir style-1 à style-6

        style des lignes

        • color-contrast: couleur des lignes impaires. la couleur des lignes paires est à définir dans class ou style

        Entête des colonnes

        • header: 0: pas de titre, 1: premiere ligne contenu, titre des colonnes format CSV
        • header-class: classe(s) pour la balise thead
        • header-style: style pour la balise thead

        Pied des colonnes

        • footer: 0: pas de pied, 1: dernière ligne contenu, pied colonne
        • footer-class: classe(s) pour la balise tfoot
        • footer-style: style pour la balise tfoot

        style et options secondaires

        • id: identifiant
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        🆙 csv_info : Retourne la valeur brute d'un élément (ligne/colonne) d'un fichier CSV

        Cliquer pour lire la documentation

        syntaxe {up csv-info=chemin-fichier | col=x | line=x}
        @version: UP-2.6 @license: GNU/GPLv3 @author: Denis HANTZ @tags: HTML
        • csv_info: URL ou chemin et nom d'un fichier local
        • separator = ;: séparateur des colonnes
        • line = -1: Titre dans la 1ere colonne ou numéro de la ligne où se trouve l'information. un nombre négatif recherche à partir de la fin
        • col = 1: Titre de la colonne dans la première ligne ou numero de colonne de l'information. Négatif à partir de la fin
        • default = [b class="t-red"]###[/b]: valeur retournée si coordonnées cellule hors feuille
        🆙 div : Facilite la saisie de blocs DIV avec un éditeur wysiwyg DEMO
        syntaxe {up div=class_and_style}content{/up div}
        @author: LOMART @version: UP-2.0 @license: GNU/GPLv3 @tags: HTML
        • div: classes et style (séparateur : point-virgule)
        • id: si indiqué, l'attribut ID est ajouté à la balise SPAN
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 donation : Formulaire de donation avec Paypal DEMO
        syntaxe {up donation=compte_paypal}
        @author: LOMART @version: UP-2.0 @license: GNU/GPLv3 @tags: widget
        • donation: Votre adresse e-mail PayPal enregistrée ou votre identifiant PayPal
        • template (item-template) = ##title## ##amount## ##currency## ##button##: modèle mise en page

        définition du titre (##title##)

        • title (titre): texte pour ##title##. bbcode accepté
        • title-tag: balise pour le titre (##title##) span par défaut si title-style
        • title-style: classes et styles pour le titre

        définition du texte d'accompagnement (##text##)

        • text: texte bbcode pour motclé ##text##
        • text-tag: balise pour le titre (##text##) span par défaut si text-style
        • text-style: classes et styles pour texte d'accompagnement

        définition du bouton (##button##)

        • button = lang[en=Donate;fr=Faire un don]: texte ou image Paypal pour ##button##
        • button-style = b;t-grisFonce;background:#FFC439;border:#ECB300 1px outset;border-radius:50px;cursor:pointer: classes et styles pour bouton (##button##)

        définition du montant et de la devise (##amount## & ##currency##)

        • amount = 10: Montant du don. Inutile si ##amount##
        • currency-code = EUR: Devise. Inutile si ##currency##
        • currency-list = EUR,USD,GBP,CHF,AUD,HKD,CAD,JPY,NZD,SGD,SEK,DKK,PLN,NOK,HUF,CZK,ILS,MXN: liste des devises acceptées. 1ère par défaut
        • amount-style: classes et styles pour montant (##amount##)
        • currency-style: classes et styles pour choix devises (##currency##)

        Données transmises et utilisées par le site de Paypal

        • item-name = Donation: La raison de vos dons. Sera imprimé sur la confirmation PayPal
        • image-url: URL du logo de de votre organisme affiché sur la confirmation d Paypal
        • url-valid = http:: ', // Chemin complet vers la page de retour après un paiement correct
        • url-cancel = http:: ', // Chemin complet vers la page de retour après un échec de paiement
        • use-sandbox: pour tester la donation

        style et options secondaires

        • id: id pour bloc externe
        • class = tc: classe(s) pour bloc externe
        • style: style inline pour bloc externe
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 facebook_timeline : affiche la timeline Facebook DEMO
        {up facebook=facebook id}
        voir https://developers.facebook.com/docs/plugins/page-plugin
        @author: PMLECONTE @version: UP-1.3 @license: GNU/GPLv3 @tags: widget
        • facebook_timeline: ID facebook. Voir https://findmyfbid.com
        • tabs = timeline: Onglets à afficher, par exemple : timeline, events, messages
        • width (l,largeur,w) = 200: La largeur du plugin en pixels. Valeur mini = 180, maxi = 500
        • height (h,hauteur) = 500: La hauteur du plugin en pixels. valeur mini = 70.
        • adaptwidth = 1: Essayer d’adapter la largeur au conteneur.
        • facepile = 1: Affiche les photos de profils quand des amis aiment le contenu.
        • hidecover: Masque la photo de couverture dans l’en-tête
        • smallheader: Utiliser un en-tête réduit

        style et options secondaires

        • id: identifiant
        • class: classe bloc parent
        • style: style inline bloc parent
        🆙 faq : accordion très simple DEMO
        syntaxe : une alternance de titres pour les onglets en H4 et de contenu HTML
        {up faq}
        -- titre en H4
        -- contenu HTML
        {/up faq}
        @author: lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: ryans temkoski @tags: layout-dynamic
        • faq: aucun argument nécessaire

        Définition des titres des onglets

        • title-tag = h4: pour utiliser une autre balise pour les titres
        • title-tag-preserve: 1 pour conserver 'title-tag' au lieu de div
        • title-class: classe pour le titre (onglet)
        • title-style: style inline pour le titre

        Définition des panneaux

        • content-class: classe pour le contenu
        • content-style: style inline pour le contenu

        style et options secondaires

        • id: identifiant
        • css-head (base-css): style ajouté dans le HEAD
        🆙 field : Retourne la valeur d'un custom field pour le contenu courant DEMO
        syntaxe
        {up field=id_or_name_field} // contenu brut du champ
        {up field=id_or_name_field | model=value} // contenu mis en forme du champ
        {up field=id_or_name_field | model=label : [b]%id_or_name_field%[/b]} // modèle avec BBCODE
        @version: UP-2.3 @author: Lomart @license: GNU/GPLv3 @tags: Joomla
        • field: id ou name du champ
        • model: modèle BBCODE avec id ou nom des champs entre signes %
        • separator: sépare les éléments d'un tableau pour rawvalue
        • tag: balise pour bloc principal

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 file : Force le téléchargement d'un fichier DEMO
        Propose un lien sur un fichier.
        Le fichier peut etre affiché (si prise en charge par navigateur client)
        ou le téléchargement peut-etre forcé avec changement de nom optionnel
        Une icône représentative est affichée devant le lien
        syntaxe :
        {up file=nomfichier.ext | download | icon |target }
        texte du lien
        {/up file}
        @author: LOMART @version: UP-1.2 @license: GNU/GPLv3 @tags: file
        • file: chemin et nom du fichier à télécharger
        • download: vide ou nom du fichier récupéré par le client
        • icon = 32: chemin et nom de l'icone devant le lien ou taille de l'icone selon extension du fichier (16 ou 32)
        • target: argument ou _blank si option sans argument
        • rel: nofollow, noreferrer, ...

        style et options secondaires

        • id: Identifiant
        • class: classe(s) pour la balise a
        • style: style inline pour la balise a
        🆙 file_download : Gestionnaire simple de téléchargements avec stats et protection par mot de passe DEMO
        syntaxe 1 {up file-download=dossier ou fichier}
        syntaxe 2 {up file-download=dossier ou fichier}##icon## ##filename-link##{/up file-download}
        présentation des liens :
        ##link## ##/link## ##filename-link## ##filename## ##icon## ##icon-link##
        ##hit## ##lastdownload##
        ##info## ##size## ##date##
        @author: LOMART @version: UP-1.9 @license: GNU/GPLv3 @tags: file
        • file_download: fichier ou dossier
        • file-mask: pour sélectionner les fichiers d'un dossier. ex: fic-*
        • extensions = zip, pdf,txt,md,png,jpg,gif,svg,doc,docx,xls,xlsx,odt,ods: extensions autorisées
        • password: mot de passe pour télécharger le fichier
        • template (item-template) = ##icon## ##filename-link## (##size## - ##date##) [small]##hit## ##lastdownload##[/small] [br]##info##: modèle de mise en page. keywords + bbcode

        Définition du type de liste

        • main-tag (block) = ul: balise pour la liste des fichiers
        • main-style: style pour la liste des fichiers
        • main-class = list-none: classes pour la liste des fichiers

        Définition d'une ligne pour un fichier

        • item-tag = li: balise pour un bloc fichier
        • item-style: style pour un bloc fichier
        • item-class: classes pour un bloc fichier
        • link-style: style pour le lien (classes admises)
        • icon = 32: chemin et nom de l'icône devant le lien ou taille de l'icône selon extension du fichier (16 ou 32)

        format pour les mots-clés

        • format-date = lang[en=m/d/Y H:i;fr=d/m/Y H:i]: 'd/m/Y H:i' format pour la date
        • model-hit = téléchargé %s fois: présentation pour ##hit##
        • model-lastdownload = dernier téléchargement le %s: présentation pour ##lastdownload##
        • model-info = %s: présentation pour ##info##

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        • filter: condition pour exécuter l'action
        🆙 file_in_content : Utilise tous les fichiers d'un dossier pour construire un article DEMO
        syntaxe {up file-in-content=fichier ou dossier}
        Mots-clés
        ##title## : le nom du fichier txt
        ##content## : le contenu du fichier txt
        ##image## : fichier image de même nom que le fichier texte
        ##date## : la date du fichier
        @author: LOMART @version: UP-2.8..1 @license: GNU/GPLv3 @tags: file
        • file_in_content: chemin et nom du fichier
        • file-mask: pour sélectionner les fichiers d'un dossier sur le serveur. ex: fic-*
        • maxi: nombre maxima de fichier (selon sort-order).
        • sort-order = desc: sens du tri. asc ou desc. Tri selon date
        • msg-no-file = en=no file;fr=aucun fichier: message si aucun fichier PDF dans le dossier
        • template (item-template) = [h2]##title##[/h2][div]##image####content##[/div]: modèle pour affichage

        balise et style du bloc contenant les différents fichiers

        • main-tag (block) = div: balise pour le bloc externe (si main-tag<>0)
        • main-style: idem class & style

        balise et style du bloc d'un fichier

        • item-tag = div: balise pour le bloc d'un fichier (si item-tag<>0)
        • item-style: style et classe pour le bloc d'un fichier

        Définition pour ##image##

        • image-style: style et classe pour l'image
        • image-popup: 1 pour afficher en grand dans fenêtre modale
        • image-extension = jpg,JPG,jpeg,JPEG,png,PNG: liste des extensions acceptées

        Formattage

        • HTML: 0= aucun traitement, 1=affiche le code, ou liste des tags à garder (ex: img,a)
        • EOL: forcer un retour à la ligne
        • format-date = lang[en=m/d/Y H:i;fr=d/m/Y H:i]: format pour la date. ex: 'd/m/Y H:i'

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc (si main-tag<>0)
        • style: idem class
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        🆙 file_office_view : Affiche un fichier MS Office (word, excel, powerpoint) DEMO
        syntaxe {up file_office_view=nom_fichier}
        @version: UP-2.9 @author: Lomart @license: GNU/GPLv3 @credit: script xxx de xxx @tags: Widget
        • file_office_view: nom du fichier
        • mode = office-embed: ou office-view, google-docs, google-drive
        • width (l,largeur,w) = 100%: largeur du bloc conteneur
        • height (h,hauteur) = 50vh: hauteur du bloc conteneur

        style et options secondaires

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 file_view : Force le chargement d'un fichier pour l'afficher en brut DEMO
        syntaxe {up file-view=chemin fichier}
        Utilisation :
        - charger du contenu récurrent à plusieurs pages
        - voir un fichier CSV
        - voir le code HTML
        @author: LOMART @version: UP-1.6 @license: GNU/GPLv3 @tags: file
        • file_view: chemin et nom du fichier

        Style du bloc

        • main-tag (block) = div: balise principale
        • class: classe(s) pour bloc
        • style: style inline pour bloc

        Mise en forme du fichier

        • HTML: 0= aucun traitement, 1=affiche le code, ou liste des tags à garder (ex: img,a)
        • EOL: forcer un retour à la ligne

        style et options secondaires

        • id: identifiant
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
        🆙 filter : affiche du contenu si toutes les conditions sont remplies DEMO
        Reprise du plugin LM-Filter de Lomart
        SYNTAXE 1 (condition comme option):
        {up filter | datemax=20171225} contenu si vrai {====} contenu si faux {/up filter}
        Le contenu si faux est optionnel. Il doit être après le contenu si vrai et séparé par {===} (au minima 3 signes égal)
        SYNTAXE 2 (condition comme argument principal):
        {up filter=datemax:20171225} contenu si vrai {====} contenu si faux {/up filter}
        SYNTAXE 3 (mono-shortcode):
        {up filter | guest=0 | return-true=REGISTER | return-false=GUEST}
        --> guest=0 est vrai si un utilisateur est connecté
        --> la valeur retournée est saisie comme option
        SYNTAXE 4 (multi-conditions et négation):
        {up filter=!day:1,7 ; hperiod:0900-1200,1500-1900 | return-true=OUVERT | return-false=FERME}
        --> vrai si pas lundi ou dimanche et entre 9-12h ou 15-19h
        @author: Lomart @version: UP-1.0 @license: GNU/GPL @tags: editor
        • filter: condition sous la forme cond1:val1,val2 ; cond2:val1,val2

        Les conditions

        • datemax: vrai jusqu'à cette date AAAAMMJJHHMM
        • datemin: vrai à partir de cette date AAAAMMJJHHMM
        • period: vrai entre ces dates AAAAMMJJHHMM-AAAAMMJJHHMM
        • day: liste des jours autorisés. 1=lundi, 7=dimanche
        • month: liste des mois autorisés. 1=janvier, ...
        • hmax: vrai jusqu'à cette heure HHMM
        • hmin: vrai à partir de cette heure HHMM
        • hperiod: vrai entre ces heures HHMM-HHMM
        • guest: vrai si utilisateur invité
        • admin: vrai si admin connecté
        • user: liste des userid autorisé. ex: 700,790
        • username: liste des username autorisé. ex: admin,lomart
        • group: liste des usergroup autorisé. ex: 8,12
        • lang: liste des langues autorisées. ex: fr,ca
        • mobile: vrai si affiché sur un mobile
        • homepage: vrai si affiché sur la page d'accueil
        • server-host: vrai si le domaine du serveur contient un des termes de la liste
        • server-ip: vrai si l'adresse IP du serveur des dans la liste
        • artid: vrai si l'ID de l'article courant est dans la liste
        • catid: vrai si l'ID de la catégorie de l'article courant est dans la liste
        • menuid: vrai si l'ID du menu actif est dans la liste

        retour pour version mono-shortcode

        • return-true = 1: valeur retournée si vrai et pas de contenu
        • return-false: valeur retournée si faux et pas de contenu

        Divers

        • info: affiche les valeurs actuelles des arguments pour les conditions
        • id: identifiant
        🆙 flexauto : une grille responsive sur plusieurs colonnes DEMO
        syntaxe 1 : {up flexauto=x_ordi | tablet=x_tablet | mobile=x_mobile }contenu{/up flexauto}
        syntaxe 2 : {up flexauto=x_ordi-x_tablet-x_mobile }contenu{/up flexauto}
        x=1 à 12 est le nombre de colonnes sur grand écran et tablette. 4 sur mobile.
        @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @tags: layout-static
        • flexauto = 3: nombre de colonnes sur grand écran ou ordi-tablet-mobile
        • tablet = 2: nombre de colonnes sur moyen écran
        • mobile = 1: nombre de colonnes sur petit écran

        Style

        • id: identifiant
        • class: classe(s) ajoutée(s) au bloc parent
        • style: style inline ajouté au bloc parent
        • bloc-style: style inline ajoutés au bloc enfant
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 flexbox : affiche des blocs enfants dans une grille FLEXBOX responsive DEMO
        syntaxe 1 : {up flexbox=x1-x2}contenu avec plusieurs blocs enfants{/up flexbox}
        syntaxe 2 : {up flexbox=x1-x2}contenu bloc-1 {====} contenu bloc-2{/up flexbox}
        x1-x2 sont les largeurs relatives des colonnes
        exemple : flexbox=4-8 ou flexbox=33-66 pour 2 colonnes (équivalent: span4 et span8)
        Note : les options class-1 à class-6 et style-1 à style-6 sont à saisir directement dans le shortcode
        @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @tags: Layout-static
        • flexbox: nombre de colonnes ou prefset sous la forme x-x-x-x
        • tablet: nombre de colonnes sur moyen écran sous la forme x-x-x-x
        • mobile: nombre de colonnes sur petit écran sous la forme x-x-x-x

        Style

        • class: class bloc principal
        • style: style inline bloc parent
        • class-*: class pour tous les blocs colonnes. sinon voir class-1 à class-6
        • style-*: style inline pour tous les blocs colonnes. sinon voir style-1 à style-6
        • bloc-style: classe et style inline ajoutés au bloc enfant
        • css-head (base-css): style ajouté dans le HEAD de la page
        • id: identifiant
        🆙 folder_list : retourne la liste mise en forme du contenu d'un dossier sur le serveur DEMO
        syntaxe {up folder_list=folder_relative_path_on_server | template=##file## (##size)}0
        ##file## : chemin/nom.extension - pour copier/coller comme argument shortcode
        ##dirname## : chemin (sans slash final)
        ##basename## : nom et extension
        ##filename## : nom sans extension (sans le point)
        ##extension## : extension
        ##relpath## : chemin relatif au chemin passé comme principal argument
        ##size## : taille du fichier
        ##date## : date dernière modification
        Motclé disponible pour le dossier en format liste (ul/li)
        ##foldername## : nom du dossier (sans l'arboresccence)
        ##folderpath## : chemin et nom du dossier (avec l'arboresccence)
        @version: UP-2.5 @license: GNU/GPLv3 @author: Lomart @tags: layout-dynamic
        • folder_list: chemin relatif du dossier sur le serveur
        • mask: masque de sélection des fichiers
        • recursive: niveaux d'exploration des sous-dossiers

        Modèle de mise en forme

        • template (item-template) = ##file##: modèle de mise en forme du résultat
        • template-folder = [b]##foldername##[/b]: modèle de mise en forme pour les dossier en vue liste

        Balises pour les blocs parents et enfants

        • main-tag (block): balise principale. indispensable pour utiliser id, class et style
        • item-tag = p: balise pour un fichier ou dossier

        Format des éléments mot-clé

        • date-format = %Y/%m/%d %H:%M: format de la date
        • decimal = 2: nombre de décimales pour la taille du fichier

        Styles CSS

        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        • id: Identifiant
        🆙 form_select : liste déroulante d'options DEMO
        syntaxe : {up form-select=action_onchange}liste options CSV (label;value){/up form-select}
        @author: LOMART @version: UP-1.9 @license: GNU/GPLv3 @tags: expert
        • form_select = url: mot-clé (url, url-blank) ou argument pour onchange ou prefset
        • file: fichier CSV pour contenu
        • separator = ;: séparateur des colonnes
        • no-content-html = en=content not found : %s;fr=contenu non trouvé : %s: message erreur. %s:nom fichier

        Styles CSS

        • id: Identifiant
        • style: classes et styles
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 gmap (googlemap) : affiche une carte google pour une adresse DEMO
        syntaxe : {up gmap=1 rue de la paix, Paris}
        IMPORTANT: il faut saisir son APIKey dans les paramétres du plugin sous la forme: gmap-key=apikey
        @author: lomart @version: UP-0.9 @license: GNU/GPLv3 @tags: widget
        • gmap (googlemap): adresse postale
        • width (l,largeur,w) = 100%: largeur de la carte
        • height (h,hauteur) = 300px: hauteur de la carte

        Gestion RGPD (tarteaucitron)

        • rgpd = 1: 0 pour ne pas appliquer la règle pour le RGPD

        Styles CSS

        • class: classe
        • style: style-inline
        • id: identifiant
        🆙 googlefont : ajoute une police GoogleFont, ainsi qu'une classe pour l'utiliser DEMO
        syntaxe :
        {up googlefont=nompolice} contenu {/up googlefont}
        {up googlefont=nompolice | class=foo} < p class="foo">...< p>
        @author: LOMART @version: UP-0.9 @license: GNU/GPLv3 @tags: Expert
        • googlefont: nom police
        • size: ajout font-size et line-height
        • family: famille de substitution (cursive, fantasy)

        Divers

        • tag = span: balise HTML pour entourer le contenu
        • className: nom de la classe pour utiliser la police ailleurs dans la page

        Style

        • id: identifiant
        • css-head (base-css): complément de css: color, font-size, ....
        🆙 gotop : Affiche un bouton avec indicateur de position pour revenir en haut de page. DEMO
        syntaxe {up gotop}
        @version: UP-2.9 @license: GNU/GPLv3 @credit: script Ivan Grozdic de https://codepen.io/ig_design/pen/yrwgwO @tags: Expert
        • gotop: texte ou caractère unicode pour la flèche. ex \25b2, \21ea ou top
        • circle-bgcolor: couleur de fond du cercle
        • circle-color: couleur de la bordure du cercle
        • circle-color-active: couleur de la bordure pour la partie activé
        • icon-color: couleur pour l'icone ou le texte
        • icon-color-hover: couleur pour l'icone ou le texte lors du survol

        Divers

        • id: identifiant
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 hr : affiche un trait horizontal avec une icône et/ou du texte DEMO
        syntaxe 1 : {up hr=nom_class_modele}
        syntaxe 2 : {up hr=nom_prefset}
        syntaxe 3 : {up hr=1px, solid, #F00, 50%}
        @author: Lomart @version: UP-1.7 @license: GNU/GPLv3 @tags: Editor
        • hr: nom icône, code unicode, chemin image ou nom dans prefs.ini + color, size

        la ligne de séparation

        • hr-border-top = 3px double #666: style du trait supérieur
        • hr-border-bottom: style du trait inférieur
        • hr-width = 100%: largeur du trait
        • hr-height: hauteur pour bg
        • hr-bg: argument pour background : couleur, dégradé, image
        • hr-align = center: position de la ligne : left, center, right
        • hr-style: style inline pour la ligne
        • hr-class: classe pour la ligne

        texte ou image sur la ligne

        • icon: icon. admet raccourci icon, size, color
        • icon-text: texte en remplacement ou après l'icone
        • icon-size = 24px: taille icone en px, rem (px par defaut) - coté du carré dans lequel est inscrit l'image
        • icon-color: couleur pour icon et texte
        • icon-bg = #ffffff: couleur de fond
        • icon-space = 4px: espace entre icon et trait
        • icon-h-offset: décalage horizontal en px ou rem négatif pour aller vers la gauche
        • icon-v-offset: décalage vertical dans la même unité que icon-size. Par défaut moitié de icon-size
        • icon-style: style inline pour l'icône ou le texte

        Divers

        • fontname = icomoon: pour icomoon ou FontAwesome ou autres (a mettre dans pref.ini)
        • id: identifiant
        🆙 html : permet de créer une entité HTML (balise) avec classe(s), style et attribut sans passer en mode code DEMO
        Syntaxe 1 :
        {up html=div | class=foo | id=x123}contenu{/up html}
        --> < div id="x123" class="foo">contenu< /div>
        Syntaxe 2 :
        {up html=img | class=foo;border:1px red solid | src=images/img.jpg}
        --> < img class="foo" style="1px red solid" src="/images/img.jpg" >
        note: toutes les options sont considérées comme des attributs de la balise
        Syntaxe 3 :
        {up html=h1.foo.xx} équivaut à {up html=h1 | class=foo xx}
        @version: UP-1.0 @author: LOMART 2017-08 @license: GNU/GPLv3 @tags: html
        • html = div: balise html
        • id: ID spécifique
        • class: classe(s)
        • style: style inline
        • xxx = yyy: couple attribut-valeur. ex: title=le titre, href=//google.fr
        🆙 icon : uniformise l'appel des icônes. Evite de passer en mode code pour la saisie DEMO
        syntaxe 1 : {up icon=nom_icone}
        syntaxe 2 : {up icon=Ux1F7A7}
        syntaxe 3 : {up icon=images/icone.png}
        syntaxe 4 : {up icon=Ux1F7A7,#F00,2rem}
        Important : indiquer dans prefs.ini le préfixe pour la police d'icones installée sur le site
        @author: Lomart @version: UP-0.9 @license: GNU/GPLv3 @tags: editor
        • icon: jeu d'options ou src,color,size
        • src: nom icône, code unicode, chemin image (indispensable si prefset)
        • size: taille icône en px, em (px par defaut) - coté du carré dans lequel est inscrit l'image
        • color: couleur
        • color-hover: couleur lors survol icône (sauf image et unicode coloré)

        Pour ajouter l'icône à un bloc sur la page

        • selector: selecteur CSS pour identifier le bloc ciblé

        Divers

        • info: 1 affiche la liste des icônes définies dans prefs.ini comme un message debug, 2 la retourne pour affichage à la place du shortcode
        • title (titre): texte affiché au survol de l'icone
        • prefix = icon-: pour icomoon ou 'fa fa-' pour font-awesome (a mettre dans pref.ini)
        • fontname = icomoon: pour icomoon ou FontAwesome ou autres (a mettre dans pref.ini)

        Style CSS

        • style: style inline
        • class: classe
        • id: identificateur
        🆙 iframe : introduire un iFrame responsive dans un article DEMO
        syntaxe {up iframe=URL}
        @author: LOMART @version: UP-1.9.5 @license: GNU/GPLv3 @credit: https://css-tricks.com/snippets/sass/maintain-aspect-ratio-mixin/ @tags: HTML
        • iframe: URL site distant
        • preview: image affichée avant chargement de l'iframe

        paramétre de l'iframe

        • allowfullscreen = allowfullscreen: autorise le plein ecran
        • scrolling = no: affiche les ascenseurs si nécessaire
        • ratio = 16:9: sous forme largeur:hauteur ou ratio 0.5625 ou pourcentage 56.25%
        • height (h,hauteur): hauteur (utile pour mobile)

        Style CSS

        • id: identifiant
        • class: classe(s) pour bloc externe
        • style: style inline pour bloc externe
        • css-head (base-css): style ajouté dans le HEAD de la page

        Interne, conservé pour compatibilité

        • iframe-class: classe(s) pour bloc
        • iframe-style: style inline pour bloc
        🆙 image_compare : comparaison de 2 images par déplacement d'un volet DEMO
        {up imagecompare}
        < img src="/avant.jpg" >
        < img src="/apres.jpg" >
        {/up imagecompare}
        @author: lomart @version: UP-0.9 @license: GNU/GPLv3 @credit: script de Sylvain Combes @tags: image
        • image_compare: aucun argument nécessaire

        Style CSS

        • id: Identifiant
        • class: classe(s) pour le bloc
        • style: style inline pour le bloc

        paramètres Javascript pour la configuration

        • initVisibleRatio = 0.2: position initiale
        • interactionMode = drag: mode: drag, mousemove, click
        • addSeparator = 1: ajoute séparateur (ligne verticale)
        • addDragHandle = 1: ajoute poignée sur séparateur
        • animationDuration = 450: durée animation en ms
        • animationEasing = linear: animation: linear, swing
        • precision = 2: précision rapport, nb decimales
        🆙 image_gallery : Affiche une ou plusieurs images dans une lightbox DEMO
        avec adaptation de la taille image à celle de l'appareil et légendes
        syntaxe 1 {up image-gallery=chemin_image | alt=texte}
        syntaxe 2 {up image-gallery=chemin_dossier}
        syntaxe 3 {up image-gallery}contenu avec des images{/up image-gallery}
        @author: LOMART @version: UP-1.4 @license: GNU/GPLv3 @credit: jqPhotoSwipe de Ergec - photoswipe.com - Masonry - Shuffle.js @tags: image
        • image_gallery: fichier image, dossier pour galerie ou largeurs des images contenues
        • layout = masonry-3-2-1: layout pour galerie : grid-x-x-x, none-x-x-x, shuffle-x-x-x
        • nb-img: nombre de vignettes affiché pour la galerie d'un dossier, 0 = toutes
        • gallery = 1: affiche la galerie dans une lightbox. Saisie obligée pour faire une galerie des images du contenu

        configuration de la legende (type et style)

        • legend: label pour image unique
        • legend-type = 2: 0:aucune, 1:hover-top, 2:hover-bottom, 3:sous l'image
        • legend-class: classe(s) pour la légende vignette
        • legend-style: style pour la légende vignette

        style des images

        • img-class: classe(s) pour bloc figure avec image et legende
        • img-style: style inline pour bloc avec image et legende

        style du bloc principal

        • id: identifiant
        • class: classe(s) pour bloc principal
        • style: style inline pour bloc principal
        • css-head (base-css): style CSS inséré dans le HEAD

        options pour layout=masonry uniquement (recherche et classement par sous-dossiers)

        • random: tri aléatoire des images en mode shuffle
        • search: afficher un champ de recherche
        • shuffle-reverse: inverser l'ordre d'affichage des sous-dossiers

        mode chargement progressif (layout=masonry uniquement)

        • infinite-scroll: 0 ou le nombre d'images affichées pour activer infinite scroll

        gestion responsive. paramétres des images adaptées (srcset)

        • img-sizes: largeur image en pourcentage de wmax-page en mode desktop, tablette et mobile. 100,100,100 par défaut
        • wmin-image = 600: largeur mini de l'image pour prise en charge
        • wmax-page = 1200: largeur maxi du conteneur contenu de la page
        • wmax-lightbox = 1200: largeur image dans lightbox
        • wmax-lightbox-mobile = 768: largeur image dans lightboox sur mobile ou 0 pour désactiver. Multiplié par pixel-ratio
        • pixel-ratio: facteur DPR. ex: 0:sans, vide, 1 ou 2: 2, 3:3
        • quality = 70: taux compression jpeg
        • similarity = 80: taux minimal. Si la largeur entre 2 images alternatives est inférieure a 80%, la plus petite n'est pas cree
        • bp-tablet = 768: point de rupture tablette
        • bp-mobile = 480: point de rupture smartphone

        gestion du dossier de stockage des variantes de tailles pour les images (a mettre dans custom/prefset.ini)

        • srcset-dir: par défaut, dans le dossier de l'image. 'tmp/subdir' = non sauvegardé par Akeeba-backup
        • srcset-raz: 1 pour supprimer tous les sous-dossiers srcset du dossier passé comme option principale
        🆙 image_hover : Superpose un contenu HTML sur une image avec des effets lors du survol DEMO
        {up image-hover=images/image.jpg | effect=xx}
        -- contenu HTML affiché au survol
        {/up image-hover}
        Voir la démo pour les numéros des effets
        @author: Lomart @version: UP-0.9 @license: GNU/GPLv3 @credit: Sanjay Jadon @tags: image
        • image_hover: nom de l'image
        • effect = 11: nom de l'effet à trouver sur le site démo

        Style CSS pour le bloc externe

        • id: identifiant
        • class: classe
        • style: style inline

        Style CSS pour l'image

        • img-class: classe pour image
        • img-style: style inline pour image

        Style CSS pour le contenu HTML

        • text-class: classe pour bloc texte lors survol
        • text-style: style inline pour bloc texte lors survol

        Divers

        • css-head (base-css): code css pour le head. ATTENTION [] au lieu de {}
        🆙 image_logo : Ajoute une image ou un texte sur une image DEMO
        syntaxe {up image-logo=prefset,image_logo ou texte}image{/up image-logo}
        @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: image
        • image_logo: prefset,image_logo ou texte
        • pos = right,bottom: position horizontale (left, gauche, right, droite, center, centre), verticale (top, haut, bottom, bas, center, centre)
        • width (l,largeur,w): largeur logo en px, rem, %. % par défaut

        Style pour le logo

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc

        Style pour le bloc externe

        • main-class: classe(s) pour le bloc du contenu
        • main-style: style inline pour le bloc du contenu

        Divers

        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 image_magnify : affiche un effet de loupe sur une image DEMO
        syntaxe 1 {up image-magnify=petite image | imgzoom=grande image pour zoom}
        syntaxe 2 {up image-magnify=image pour vignette et zoom}
        @author: LOMART @version: UP-0.9 @license: GNU/GPLv3 @credit: thdoan @tags: image
        • image_magnify: fichier image normale
        • imgzoom: fichier image utilisé pour le zoom. si vide: image principale

        Paramètres de la loupe

        • size: diamètre de la loupe en pixel
        • radius: taille de l'arrondi de la loupe en pixel
        • border: modele de bordure pour la loupe. fin ou vide

        Style CSS

        • class: classe(s) ajoutées au bloc principal
        • style: style inline ajouté au bloc principal
        • id: id genérée automatiquement par UP
        🆙 image_pannellum : Affiche un panorama 3D à partir d'une image equirectangular DEMO
        syntaxe {up image_pannellum=chemin_image_equirectangular}
        @author: LOMART @version: UP-1.6 @license: GNU/GPLv3 @credit: script pannellum de Matthew Petroff. @tags: image
        • image_pannellum: chemin de l'image
        • height (h,hauteur) = 400px: hauteur en px ou vh
        • width (l,largeur,w) = 100%: largeur en px ou %
        • fullscreen: 1 pour autoriser la vue plein écran
        • language: liste motclé (bylineLabel,loadButtonLabel,loadingLabel) + traduction. Exemple:bylineLabel:lang[en=by %s;fr:par %s], loadingLabel:Loading...
        • options: liste des options supplémentaires . ex: showZoomCtrl:true,compass:true - Attention au min/maj. voir cette page

        Style CSS

        • id: id genérée automatiquement par UP
        • class: classe(s) ajoutées au bloc principal
        • style: style inline ajouté au bloc principal
        • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

        paramètres Javascript pour configuration

        • panorama: chemin image (il est rempli automatiquement avec l'argument principal du shortcode)
        • preview: chemin image preview
        • type = equirectangular: type de l'image
        • title (titre): titre. pseudo BBCode et traduction acceptes
        • author: auteur. pseudo BBCode et traduction acceptes
        • authorURL: lien vers site auteur
        • autoLoad: chargement auto de l'image
        • autoRotate: rotation nombre de degrés par seconde
        • showControls = 1: 0 pour masquer tous les boutons
        • showZoomCtrl = 1: 0 pour masquer les boutons +/- du zoom
        • showFullscreenCtrl = 1: 0 pour masquer le bouton plein écran
        • hotSpotDebug: 1 pour afficher les coordonnées hotspot dans la console
        🆙 image_random : Affiche aléatoirement une des images d'un dossier DEMO
        Le dossier peut être un pattern valide pour la fonction PHP GLOB
        syntaxe 1 : {up image-random=folder}
        syntaxe 2 : {up image-random}image 1{===}image 2 avec lien{/up image-random}
        syntaxe 3 : {up image-random}content 1{===}content 2{/up image-random}
        @author: LOMART @version: UP-1.8.2 @license: GNU/GPLv3 @tags: image
        • image_random: dossier des images
        • path-only: retourne uniquement le chemin de l'image pour utilisation par une autre action.

        Style CSS

        • id: Identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 image_rollover : Change l'image au survol DEMO
        syntaxe {up image-rollover=image_base | hover=image_survol}
        @author: LOMART @version: UP-1.4 @license: GNU/GPLv3 @tags: image
        • image_rollover: image repos
        • hover: image au survol
        • click: image lors clic

        Style CSS

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        🆙 image_secure : Affiche une image de manière à compliquer sa récupération DEMO
        syntaxe {up image-secure=chemin_image}
        @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: image
        • image_secure: chemin relatif vers image jpg ou png
        • folder-source = images: dossier racine des images originales
        • folder-strip = images/image-secure: dossier avec les images fractionnées
        • nb-strip = 5: nombre de bandes
        • alt: texte alternatif pour image. Si vide: nom du fichier humanisé
        • quality = 80: pourcentage qualité en JPG
        • reset: force la génération des images strip
        • delete-source: supprime l'image source après génération des strips

        Style CSS

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 imagemap : une image clicable et responsive DEMO
        syntaxe {up imagemap=chemin_image}
        < area target="" alt="" title="" href="/" coords="" shape="">;
        OU pour prévenir l'effacement par editeur (remplacer les <> par [])
        [area target="" alt="" title="" href="/" coords="" shape=""];
        {/up imagemap}
        utiliser un générateur en ligne pour définir les zones : www.image-map.net
        @author: LOMART @version: UP-1.2 @license: GNU/GPLv3 @credit: script RWD Image Maps de stowball @tags: image
        • imagemap: le chemin et nom de l'image

        Style CSS

        • id: id genérée automatiquement par UP
        • class: classe(s) ajoutées au bloc principal
        • style: style inline ajouté au bloc principal
        🆙 jcat_image : Affiche une image en rapport avec la catégorie de l'article courant DEMO
        syntaxe {up jcat_image}
        @author: LOMART @version: UP-1.95 @license: GNU/GPLv3 @tags: joomla
        • jcat_image: dossier/chemin/url vers une image si la catégorie n'en possède pas

        Style CSS

        • id: identifiant
        • class: classe(s) pour bloc
        • style: style inline pour bloc
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 jcategories_by_tags : liste des catégories d'un mot-clé (tag) DEMO
        syntaxe : {up jcategories-by-tags=id-ou-nom-tag}
        MOTS-CLES :
        ##title## ##title-link## ##subtitle## ##link##
        ##intro## ##content## : la description de la catégorie en HTML
        ##intro-text## ##intro-text,100## : la description de la catégorie en TEXT
        ##image## ##image-link## ##image-src## ##image-alt##
        ##date-crea## ##date-modif## ##new## ##count## ##hits## ##tags-list##
        @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Joomla
        • jcategories_by_tags: ID ou nom du tag
        • maxi: Nombre maxi d'article dans la liste
        • no-published (no_published): 1 pour obtenir les catégories non publiées
        • sort-by = title: tri: title, rgt, created_time, modified_time, id, hits
        • sort-order = asc: ordre de tri : asc, desc
        • no-content-html = [p]aucune catégorie pour ce mot-clé[/p]: retour si aucune catégorie trouvée

        Modèle pour affichage résultat

        • template (item-template): modèle de mise en page. Si vide le modèle est défini par le contenu

        Style du bloc principal

        • main-tag (block) = div: balise pour le bloc englobant tous les articles. 0 pour aucun
        • main-style: classes et styles inline pour bloc principal
        • main-class: classe(s) pour bloc principal (obsoléte)

        Style d'une ligne résultat

        • item-tag = div: balise pour le bloc. 0 pour aucun
        • item-style: classes et styles inline
        • item-class: classe(s)

        Paramètres pour images

        • image-src: lorempixel.com/150/150', // image par défaut
        • image-alt = news: image, texte alternatif par défaut

        Formats pour les mots-clés

        • date-format = %e %B %Y: format pour les dates
        • date-locale: localisation pour les dates. Par défaut, celle du navigateur client.
        • new-days = 30: nombre de jours depuis la création de l'article
        • new-html = [span class="badge-red"]nouveau[/span]: code HTML pour badge NEW
        • tags-list-prefix: texte avant les autres eventuels tags
        • tags-list-style: classe ou style pour les autres mots-clés

        Style CSS

        • id: identifiant
        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 jcategories_list : liste des catégories descendantes DEMO
        la catégorie parente n'est pas affichée
        syntaxe : {up jcategories-list=id}
        MOTS-CLES ITEM MENU:
        ##id## ##access## ##title-link## ##title## ##note## ##extension## ##language##
        @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: Joomla
        • jcategories_list: id catégorie ou vide pour toutes
        • component = Content: nom de l'extension pour laquelle récupérer les catégories
        • level: nombre de niveaux. O = tous

        Modèles de présentation

        • template (item-template) = ##title-link##[small] (id:##id##) ##access## ##extension## ##language##[/small] ##note##: modèle de mise en page. keywords + bbcode
        • model-note = [i class="t-blue"]%s[/i]: présentation pour ##note##

        Balise et style du bloc principal

        • main-tag (block) = ul: balise pour bloc parent
        • style: classes et styles
        • id: identifiant

        Balise pour les lignes

        • item-tag = li: balise pour blocs enfants (lignes)

        Style CSS

        • css-head (base-css): style ajouté dans le HEAD de la page
        🆙 jcontent_by_categories (jnews) : liste des articles d'une catégorie DEMO
        syntaxe 1 : {up jcontent-by-categories=id-catégorie(s) | template=##title-link##}
        syntaxe 2 : {up jcontent-by-categories=id-catégorie(s)}##title-link##{/up jcontent-by-categories}
        Une action très pratique pour lister les articles de la catégorie en cours, il suffit de taper {up article-category}
        Les mots-clés :
        ##title## ##title-link## ##subtitle## ##link##
        ##intro## ##intro-text## ##intro-text,100## ##content##
        ##image## ##image-src## ##image-alt##
        ##date-crea## ##date-modif## ##date-publish##
        ##author## ##note## ##cat## ##cat-link## ##new## ##featured## ##hits## ##tags-list##
        ##upnb## : nbre actions UP dans la page - ##uplist## : nbre par actions
        @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Joomla
        • jcontent_by_categories (jnews): ID(s) catégorie(s) séparé(s) avec virgule, vide pour celle de l'article actuel ou 0 pour toutes
        • maxi: Nombre maxi d'articles dans la liste. Vide = tous
        • exclude: liste des id des catégories non reprises si option principale=0
        • current: 1 pour inclure l'article en cours
        • no-published (no_published) = 1: Liste aussi les articles non publiés
        • author: filtre sur auteur: liste des id ou article, current
        • sort-by = publish_up: tri: title, ordering, created, modified, publish_up, id, hits
        • sort-order = desc: ordre de tri : asc, desc
        • no-content-html = Pas de nouvelles, bonnes nouvelles ...[br]No news, good news ...: texte si aucune correspondance. 0=aucun texte

        Modèles de présentation

        • template (item-template): modèle de mise en page. Si vide le modèle est le contenu

        Balise et style pour le bloc principal

        • main-tag (block) = div: balise pour le bloc englobant tous les articles. 0 pour aucun
        • main-style: classes et styles inline pour bloc principal
        • main-class: classe(s) pour bloc principal (obsolète)

        Balise et style pour un article

        • item-tag = div: balise pour le bloc d'un article. 0 pour aucun
        • item-style: classes et styles inline pour un article
        • item-class: classe(s) pour un article (obsolète)

        Paramètre pour l'image

        • image-src: lorempixel.com/300/300', // image par défaut
        • image-alt = news: image, texte alternatif par défaut

        Format pour les mots-clés

        • date-format = %e %B %Y: format pour les dates
        • date-locale: localisation pour les dates. Par défaut, celle du navigateur client.
        • new-days = 30: nombre de jours depuis la création de l'article
        • new-html = [span class="badge bg-red t-white"]nouveau[/span]: code HTML pour badge NEW
        • featured-html = &#x2B50: code HTML pour article en vedette
        • tags-list-prefix: texte avant les autres éventuels tags
        • tags-list-style = badge;margin-right:4px: classe ou style affecté à une balise span par mot-clé
        • tags-list-separator: séparateur entre mots-clés

        Style CSS

        • id: identifiant
        • css-head (base-css): code CSS dans le head
        🆙 jcontent_by_subcat : Les articles par categories et sous-categories DEMO
        syntaxe 1 : {up jcontent-by-subcat=id-categorie}
        liste des articles d'une catégorie et ses sous-catégories
        syntaxe 2 : {up jcontent-by-subcat}
        liste des articles de la catégorie en cours et ses sous-catégories
        syntaxe 3 : {up jcontent-by-subcat=0}
        liste des articles de toutes les catégories
        syntaxe 4 : {up jcontent-by-subcat}##title##{/up jcontent-by-subcat}
        variante : saisie template pour articles entre shortcodes
        Les mots-clés article:
        ##title## ##title-link## ##subtitle## ##link##
        ##intro## ##intro-text## ##intro-text,100## ##content##
        ##image## ##image-src## ##image-alt##
        ##date-crea## ##date-modif## ##date-publish##
        ##author## ##note## ##cat## ##new## ##featured## ##hits## ##tags-list##
        ##upnb## : nbre actions UP dans la page - ##uplist## : nbre par actions
        Les mots-clés catégorie:
        ##catpath## : Chemin des categories depuis la categorie racine.
        ex: si on demande la categorie 2 avec 3 niveaux (subcat=3): 2.1 > 2.1.1 > 2.1.1.1
        ##title## ##title-link## ##link## : titre et lien de la categorie
        ##alias## ##note## ##id## ##count## : nombre d'articles dans la catégorie
        @author: LOMART @version: UP-2.5 @license: GNU/GPLv3 @tags: Joomla

          Sélection des catégories

          • jcontent_by_subcat: ID catégorie, vide pour celle de l'article actuel ou 0 pour toutes
          • exclude: liste des id des catégories non reprises si option principale=0
          • cat-level = 99: 0 a 99 - niveau maxi exploration des sous-catégories

          filtrage et tri des articles

          • maxi: Nombre maxi d'articles dans chaque catégorie. Vide = tous
          • current: 1 pour inclure l'article en cours
          • no-published (no_published): Liste aussi les articles non publies
          • author: filtre sur auteur: liste des id user ou article, current
          • sort-by = title: tri: title, ordering, created, modified, publish_up, id, hits
          • sort-order = asc: ordre de tri : asc, desc

          Paramètres d'affichage des catégories

          • cat-template = [small]##catpath##[/small] [b]##title##[/b]: modèle pour les lignes de catégories
          • cat-tag = h5: balise pour ligne catégorie. LI pour passer en format liste UL/LI
          • cat-class: classe(s) pour la ligne catégorie
          • cat-style: style pour la ligne catégorie
          • cat-separator = »: pour séparer l'arborescence des catégories
          • cat-root-view = 1: afficher l'unique catégorie racine. root=jamais, plusieurs=toujours

          Paramètres d'affichage des articles

          • template (item-template): modele de mise en page. Si vide le modèle est le contenu
          • item-tag = div: balise pour le bloc d'un article.
          • item-style: classes et styles inline pour un article
          • item-class: classe(s) pour un article (obsolete)

          style du bloc principal

          • main-tag (block) = p: balise pour le bloc englobant tous les articles.
          • id: identifiant pour main-tag
          • main-style: classes et styles inline pour bloc principal
          • main-class: classe(s) pour bloc principal (obsolete)

          Format pour les mots-clés

          • date-format = %e %B %Y: format pour les dates
          • date-locale: localisation pour les dates. Par defaut, celle du navigateur client.
          • new-days = 30: nombre de jours depuis la création de l'article pour badge 'nouveau'
          • new-html = [span class="badge bg-red t-white"]nouveau[/span]: code HTML pour badge NEW
          • featured-html = &#x2B50: code HTML pour article en vedette
          • image-src: lorempixel.com/300/300', // image par defaut
          • image-alt = news: image, texte alternatif par defaut
          • tags-list-prefix: texte avant les autres éventuels tags
          • tags-list-style = badge;margin-right:4px: classe ou style affecte a une balise span par mot-cle
          • tags-list-separator: séparateur entre mots-cles

          Divers

          • no-content-html = lang[en=No content found;fr=Aucun contenu trouvé: texte si aucune correspondance. 0=aucun texte
          • css-head (base-css): code CSS dans le head
          🆙 jcontent_by_tags : liste des catégories d'un mot-clé (tag) DEMO
          syntaxe : {up jcontent-by-tags=id-ou-nom-tag}
          syntaxe : {up jcontent-by-tags=id-ou-nom-tag}##title##{/up jcontent-by-tags}
          Les mots-clés :
          ##title## ##title-link## ##subtitle## ##link##
          ##intro## ##intro-text## ##intro-text,100## ##content##
          ##image## ##image-link## ##image-src## ##image-alt##
          ##date-crea## ##date-modif##
          ##cat## ##new## ##hits## ##tags-list##
          ##CF_id_or_name## : valeur brute du custom field
          ##CF_id_or_name | [span class="t-red"]%label% : [:span]%value% ## (ou %rawvalue%)
          @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Joomla
          • jcontent_by_tags: ID ou nom du tag
          • maxi: Nombre maxi d'articles dans la liste
          • no-published (no_published): 1 pour obtenir les catégories non publiées
          • current: 1 pour inclure l'article en cours
          • sort-by = title: tri: title, rgt, created, modified, id, hits
          • sort-order = asc: ordre de tri : asc, desc

          Modèles de présentation

          • template (item-template): modèle de mise en page. Si vide le modèle est le contenu

          balise & style pour le bloc principal

          • main-tag (block) = div: balise pour le bloc englobant tous les articles. 0 pour aucun
          • id: identifiant
          • main-style: classes et styles inline pour bloc principal
          • main-class: classe(s) pour bloc principal (obsolète)

          balise & style pour un élément

          • item-tag = div: balise pour un bloc article. 0 pour aucun
          • item-style: classes et styles inline pour bloc principal
          • item-class: classe(s) pour bloc principal (obsoléte)

          Paramètre pour l'image

          • image-src: lorempixel.com/150/150', // image par défaut
          • image-alt = news: image, texte alternatif par défaut

          Format pour les mots-clés

          • date-format = %e %B %Y: format pour les dates
          • date-locale: localisation pour les dates. Par défaut, celle du navigateur client.
          • new-days = 30: nombre de jours depuis la création de l'article
          • new-html = [span class="badge-red"]nouveau[/span]: code HTML pour badge NEW
          • tags-list-prefix: texte avant les autres éventuels tags
          • tags-list-style: classe ou style pour les autres mots-clés

          Divers

          • no-content-html = aucune catégorie pour ce mot-clé: retour si aucune catégorie trouvée
          • css-head (base-css): style ajouté dans le HEAD de la page
          🆙 jcontent_in_content : Affiche le contenu d'un article dans un autre DEMO
          syntaxe 1 : {up jcontent-in-content=id_article}
          syntaxe 2 : {up jcontent_in_content=145}template{/up jcontent_in_content}
          Les mots-clés :
          ##id## ##title## ##title-link## ##subtitle## ##link##
          ##intro## ##intro-text## ##intro-text,100## ##content##
          ##image## ##image-src## ##image-alt##
          ##date-crea## ##date-modif## ##date-publish##
          ##author## ##note## ##cat## ##new## ##featured## ##hits##
          @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Joomla
          • jcontent_in_content: ID de l'article
          • no-published (no_published) = 1: Liste aussi les articles non publiés

          Modèle de présentation

          • template (item-template) = ##content##: modèle de mise en page. Si vide le modèle est le contenu. BBCode accepté

          Balise & style pour le bloc parent

          • main-tag (block) = div: balise pour le bloc d'un article. 0 pour aucun
          • id: identifiant
          • main-style: classes et styles inline pour un article
          • main-class: classe(s) pour un article (obsoléte)

          Format pour les mots-clés

          • date-format = %e %B %Y: format pour les dates
          • date-locale: localisation pour les dates. Par défaut, celle du navigateur client.

          Style CSS

          • css-head (base-css): code CSS dans le head
          🆙 jcontent_info : Affiche des informations sur l'article courant DEMO
          syntaxe 1 : {up jcontent-info=nom_info}
          syntaxe 2 : {up jcontent_info}<b>une info :</b> ##nom_info##{/up jcontent_info}
          syntaxe 3 : {up jcontent_info | template=[b]une info :[/b] ##nom_info##}
          Les mots-clés :
          ##id## ##title## ##subtitle##
          ##image## ##image-src## ##image-alt## ##image-legend##
          ##image-full## ##image-full-src## ##image-full-alt## ##image-full-legend##
          ##date-crea## ##crea_by## ##date-modif## ##modif_by##
          ##url-a## ##url-b## ##url-c##
          ##date-publish## ##date-unpublish##
          ##note## ##cat## ##catid## ##breadcrumbs##
          ##featured## ##hits## ##tags## ##tags-list## ##author##
          @author: LOMART @version: UP-2.5 @license: GNU/GPLv3 @tags: Joomla
          • jcontent_info: le nom d'un élément ou rien

          Modèle de présentation

          • template (item-template) = ##content##: modèle de mise en page. Si vide le modèle est le contenu. BBCode accepté

          balise & style du bloc principal

          • tag = _div: balise pour le bloc d'un article. _div = div si class ou style, sinon rien. = 0=jamais
          • id: identifiant
          • style: classes et styles inline pour un article
          • class: classe(s) pour un article (obsoléte)

          Format pour les mots-clés

          • date-format = %e %B %Y: format pour les dates
          • date-locale: localisation pour les dates. Par défaut, celle du navigateur client.
          • featured-html = [b class="t-gris"]&#x2605;[/b], [b class="t-jauneFonce"]&#x2605;[/b]: présentation mise en vedette
          • tags-list-prefix: texte avant les autres eventuels tags
          • tags-list-style = badge;margin-right:4px: classe ou style affecte a une balise span par mot-cle
          • tags-list-separator: separateur entre mots-cles
          • path-separator = »: caractère ou bbcode pour séparer les items menus ou les catégories
          • path-current-class = b: style de l'élement terminal d'un chemin
          • path-parent-class = fs90: style des élements parents
          • path-order = asc: asc: élément terminal à la fin, desc : au début
          • path-link = 1: affiche les liens sur les éléments.

          Style CSS

          • css-head (base-css): code CSS dans le head
          🆙 jcontent_list (article_category) : liste des articles d'une catégorie DEMO
          syntaxe : {up jcontent-list=id-catégorie(s)}
          Une action très pratique pour lister les articles de la catégorie en cours, il suffit de taper {up jcontent-list}
          @author: LOMART @version: UP-0.9 @license: GNU/GPLv3 @tags: Joomla
          • jcontent_list (article_category): ID de la catégorie ou vide pour celle de l'article actuel
          • maxi: Nombre maxi d'article dans la liste
          • no-published (no_published) = 1: Liste aussi les articles non publiés
          • author: filtre sur auteur: liste des id ou article, current
          • sort-by = title: tri: title, ordering, created, modified, publish_up, id, hits
          • sort-order = asc: ordre de tri : asc, desc

          Style du bloc principal

          • id: identifiant
          • main-class: classe(s) pour bloc principal (obsoléte)
          • main-style: classes et styles inline pour bloc principal
          • class: idem main-class. Conservé pour compatibilité descendante
          • style: idem main-style. Conservé pour compatibilité descendante

          Titre : balise et style

          • title (titre): titre HTML si article trouvé.
          • title-tag = h3: niveau du titre
          • title-style: classes et styles inline pour le titre
          • title-class: classe(s) pour le titre (obsoléte)

          Style de la liste

          • list-style: classes et styles inline pour la liste
          • list-class: classe(s) pour la liste (obsoléte)

          Style CSS

          • css-head (base-css): code CSS dans le head
          🆙 jextensions_list : liste des extensions installées sur le site DEMO
          syntaxe : {up jextensions-list=prefset ou type(s)}
          MOTS-CLES:
          ##id## ##client## ##type## ##name-link## ##name## ##author## ##version## ##note## ##folder## ##state##
          @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Joomla
          • jextensions_list = component,module,plugin: nom d'un prefset ou un des types suivants : component,module,plugin
          • type-exclude: 1= tous les types sauf ceux passés en paramètre principal
          • client: 0=site, 1=admin, 2=tous
          • minimal-id = 10000: pour exclure les composants du core Joomla 3.0
          • author-exclude = Joomla! Project: pour exclure les composants du core Joomla 4.0
          • actif-only: 1 pour lister les extensions dépubliées
          • sort = type,folder,name: tri

          Modèle de présentation

          • template (item-template) = ##state####name##[small] ##client## ##type####folder## ##version## (id:##id##) ##author## [/small] ##note##: modèle de mise en page. keywords+bbcode

          Balise et style du bloc principal

          • main-tag (block) = ul: Balise pour bloc principal
          • style: classes et styles
          • id: identifiant

          Balise pour les lignes

          • item-tag = li: Balise pour blocs lignes

          Format pour les mots-clés

          • model-folder = %s: présentation pour ##folder##
          • model-version = vers:%s: présentation pour ##version##
          • model-note = [i class="t-blue"]%s[/i]: présentation pour ##note##
          • state-list = t-red: liste de choix : inactif, actif 🔴

          Style CSS

          • css-head (base-css): style ajouté dans le HEAD de la page
          🆙 jmenus_list : liste des menus DEMO
          syntaxe : {up jmenus-list=menutype}
          MOTS-CLES MENUTYPE:
          ##id## ##menutype## ##title## ##description##
          MOTS-CLES ITEM MENU:
          ##id## ##title## ##link## ##title-link## ##note## ##access## ##language## ##component##
          @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: Joomla
          • jmenus_list: prefset, nom menutype ou vide pour tous
          • menuid: ID menu parent pour limiter à cette branche

          Balise et style du bloc principal

          • main-tag (block) = ul: balise pour la liste des fichiers
          • style: classes et styles
          • id:

          Modèle de présentation

          • template-menutype = [h5]##title## (id:##id##)[/h5] ##description## / ##menutype##: modèle pour menutype. keywords + bbcode
          • template-menu = ##title-link##[small] (id:##id##) ##access## - ##component## ##language##[/small] ##note##: modèle item menu. keywords + bbcode
          • model-note = [i class="t-blue"] %s[/i]: modèle pour ##note## keywords + bbcode

          Style CSS

          • css-head (base-css): style ajouté dans le HEAD de la page
          🆙 jmodules_list : liste des modules sur le site DEMO
          syntaxe : {up jmodules-list=position ou client_id}
          MOTS-CLES:
          ##id## ##client## ##position## ##module## ##title##
          ##state## ##note## ##ordering## ##language##
          @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: Joomla

            Critères de sélection des modules

            • jmodules_list: prefset ou position(s). vide=tous les modules site
            • position-exclude: 1= toutes les positions sauf celles passées en paramètre principal
            • client: 0=site, 1=admin, 2=tous
            • module: nom du module. ex: LM-Custom-SITE
            • module-exclude: 1= tous les modules sauf ceux passés au paramètre module
            • actif-only: 1 pour lister les extensions dépubliées
            • order = position, ordering, title: ²
            • no-content-html = [p]aucun module a cette position[/p]: retour si aucune catégorie trouvée

            Balise et style du bloc principal

            • main-tag (block) = ul: balise pour le bloc englobant tous les modules. 0 pour aucun
            • id: identifiant
            • main-style: classes et styles inline pour bloc principal
            • main-class: classe(s) pour bloc principal (obsolète)

            Balise et style d'un bloc module

            • item-tag = li: balise pour un module. 0 pour aucun
            • item-style: classes et styles inline pour bloc ligne
            • item-class: classe(s) pour bloc ligne (obsolète)

            Modèle de présentation

            • template (item-template) = \[##position##\] [b class="##state##"][/b] [b]##title##[/b] [small] (id:##id## - ##module##) ##language##[/small] ##note##: modèle de mise en page.
            • model-note = [i class="t-blue"]%s[/i]: présentation pour ##note##
            • state-list = icon-unpublish t-rouge, icon-publish t-vert, icon-trash t-gris: liste de choix : inactif, actif 🔴

            Style CSS

            • css-head (base-css): style ajouté dans le HEAD de la page
            🆙 kawa (coffee) : Sert un café virtuel DEMO
            Vos yeux après de longues heures devant votre ordi commencent à se fermer.
            Vite tapez ce shortcode :
            syntax {up kawa=long | sugar | speculoos=lotus }
            @author: LOMART @version: UP-1.3.2 @license: GNU/GPLv3 @tags: widget
            • kawa (coffee): vide = café court, long = café long
            • sucre (sugar) = 1: option sucre
            • speculoos: speculoos base ou spécifier marque (lotus)

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc
            • style: style inline pour bloc
            🆙 lang : Choix du contenu selon la langue du visiteur DEMO
            syntaxe 1 : {up lang | fr=oui | gb=yes}
            syntaxe 2 : {up lang | lang-order=en-fr} contenu anglais {====}contenu français {/up lang}
            @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Editor
            • lang: langue pour vérifer le rendu (vide en production)
            • lang-order = en,fr: ordre de saisie des langues dans contenu

            Style CSS

            • tag: balise entourant le contenu retourné
            • id: identifiant
            • class: classe(s) pour bloc
            • style: style inline pour bloc
            • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

            Divers

            • info: affiche la langue du navigateur et celle affichée
            • http: utilise l'entête HTTP au lieu de JFactory::getLanguage()
            🆙 link : Affiche un lien vers une URL, un numéro de téléphone ou un mail DEMO
            syntaxe {up link=URL | label=label | blank | class=...}
            @author: LOMART @version: UP-2.7 @license: GNU/GPLv3 @tags: editor
            • link: URL ou EMAIL pour l'attribut href
            • label: texte alternatif pour le lien
            • blank: ouvre le lien dans un nouvel onglet

            Icône

            • icon: icone affichée devant le lien : 0=pas d'icône, 1=icône par defaut, Unicode, fonticon ou image
            • icon-style: classes et styles pour l'icône
            • icon-url = Ux1F517: Icone par defaut pour les URL
            • icon-phone = Ux260E: Icone par defaut pour les téléphone - v2.9
            • icon-mail = Ux2709: Icone par defaut pour les MAIL

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc
            • style: style inline pour bloc
            • css-head (base-css): style ajouté dans le HEAD de la page

            Divers

            • font-prefix = icon-: pour icomoon ou 'fa fa-' pour font-awesome (a mettre dans pref.ini)
            • filter: conditions. Voir doc action filter (v2.9)
            🆙 listup : Personnaliser des listes simples et ordonnées DEMO
            syntaxe {up listup=style puce} list UL/OL {/up listup}
            @version: UP-2.6 @author: Lomart @license: GNU/GPLv3 @tags: editor
            • listup: style des puces (séparateur point-virgule) par niveaux (markers) (séparateur virgule)

            Valeurs par défaut

            • ul-default = square;t-c1: type liste par défaut
            • ol-default = decimal;t-c1: type liste numérotée par défaut

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc principal
            • style: class ou style inline pour bloc principal
            • style-*: class ou style pour les niveaux des puces
            • css-head (base-css): style ajouté dans le HEAD de la page

            Divers

            • start: indice pour début liste numérotée
            • valid-type = rounded-alpha,squared-alpha,circled-decimal,rounded-decimal,decimal-leading-zero,lower-alpha,upper-alpha,lower-roman,upper-roman: types de liste (numérotée) autorisés
            • fonticon = FontAwesome: police d'icônes installée sur le site
            🆙 lorem : Affiche du texte aléatoire (enrichissement possible) DEMO
            .
            Syntaxe : {up lorem=liste des arguments ci-dessous }
            - (integer) - Nombre de paragraphes (P) générés. 4 par défaut
            - short, medium, medium, verylong - La longueur moyenne d'un paragraphe.
            - decorate - ajoute bold, italic, ...
            - link - ajoute des liens.
            - ul - ajoute listes.
            - ol - ajoute listes ordonnées.
            - dl - ajoute listes description.
            - bq - ajoute bloc citation
            - code - ajoute des exemples de code.
            - headers - ajoute des titre hx.
            - allcaps - TOUT EN MAJUSCULES.
            - prude - version prude.
            - plaintext - Retourne text sans balise HTML.
            exemple appel : https://loripsum.net/api/2/code/decorate
            .
            Pour avoir un texte sans aucun tag, utilisez : {up lorem=2,plaintext | tag=0}.
            Même sans balise P, le nombre de paragraphes influe sur la longueur du texte retourné.
            @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @tags: editor
            • lorem: nombre de paragraphe et mots-clés séparés par des virgules

            Divers

            • max-char: nombre maxima de caractères
            • max-word: nombre maxima de mots

            Style CSS

            • tag = div: (v1.6) tag du bloc contenant le texte en retour ou tag=0 pour aucun.
            • id: pour forcer l'id (sans effet, si tag=0)
            • class: classe(s) pour bloc (sans effet, si tag=0)
            • style: style inline pour bloc (sans effet, si tag=0)
            🆙 lorem_flickr (lorempixel) : affiche une image aleatoire DEMO
            Syntax 1 : {up loremflickr=type | width=xx | height=xx}
            .
            Note : width & height sont les dimensions de l'image retournée par lorempixel. Pour l'afficher en remplissant le bloc parent, il faut ajouter style=width:100%
            Le site //lorempixel.com étant fermé, l'action utilise le site //loremflickr.com
            on peut appeler l'action par loremflickr ou lorempixel
            @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @tags: Editor
            • lorem_flickr (lorempixel): mot(s) clé(s) séparé par des virgules
            • height (h,hauteur) = 200: hauteur image téléchargée
            • width (l,largeur,w) = 200: largeur image téléchargée
            • color: g (gris), p (pixellisé), red, green, ou blue

            Bloc parent

            • main-tag (block) = div: balise du bloc parent à l'image si options main-class ou align
            • main-class: classe(s)
            • align: alignement horizontal : left, center, right

            Style CSS

            • id: identifiant
            • class: classe(s)
            • style: classes et styles
            🆙 lorem_placeimg : affiche une image aleatoire DEMO
            Syntaxe :
            {up lorem-placeimg=catégorie | width=xx | height=xx | grayscale | sepia }
            --> catégorie = any, animals, arch, nature, people, tech
            @author: Lomart @version: UP-1.5 @license: GNU/GPLv3 @tags: Editor
            • lorem_placeimg = any: type d'image: any, animals, arch, nature, people, tech
            • height (h,hauteur) = 200: hauteur image téléchargée
            • width (l,largeur,w) = 200: largeur image téléchargée
            • grayscale: rendu en niveau de gris
            • sepia: rendu sépia

            Style CSS

            • id: identifiant
            • class: classe(s) (obsolète)
            • style: classes et styles
            🆙 lorem_unsplash : affiche une image aleatoire DEMO
            Syntaxe : {up lorem-unsplash=#image | width=xx | height=xx }
            rechercher n° image sur https://picsum.photos/images
            @author: Lomart @version: UP-1.5 @license: GNU/GPLv3 @tags: Editor
            • lorem_unsplash: n° de l'image sur https://picsum.photos/images
            • height (h,hauteur) = 200: hauteur image téléchargée
            • width (l,largeur,w) = 200: largeur image téléchargée
            • random: force la récupération aléatoire
            • grayscale: pour rendu en niveaux de gris
            • blur: rendu flou
            • gravity: recadrage : north, east, south, west, center

            Style CSS

            • id: identifiant
            • class: classe(s) (obsolète)
            • style: classes et styles
            🆙 mapael : Affiche une carte vectorielle interactive DEMO
            syntaxe
            {up mapael=nom_carte}
            {default-area | ...}
            {default-plot | ...}
            {default-link | ...}
            {area=ID | value=X | ...}
            {plot=ID | coord=lat,lon | value=[X1,X2] | text=... | ...}
            {link=ID | between=lat1,lon1,lat2,lon2 | factor=0.5 | ...}
            {link=ID | between=plot-ID-1, plot-ID-2 | factor=0.5 | ...}
            {legend-area=TITRE | ...}
            {legend-plot=TITRE | ...}
            {legend-slice=LABEL | value=X | ...}
            {legend-slice=LABEL | min=X | max=Y | ...}
            {/up mapael}
            # Options shortcode principal :
            zoom=min,max | zoom-init=niv,lat,lon | csv-xxx | ...
            # Options communes à tous les shortcodes secondaires :
            bd-color | bd-color-hover | bd-dash | bd-width | bd-width-hover | bg-color | bg-color-hover
            class | eventHandlers | href | target | transform-hover
            text | text-attrs | text-attrs-hover | text-margin | text-position
            tooltip | tooltip-class | tooltip-offset-left | tooltip-offset-top | tooltip-overflow-right | tooltip-overflow-bottom
            options
            # Options spécifiques à defaultPlot et plot
            type | size | height | width | url | path
            saisie rapide : circle=W,color | square=W,color | image=WxH,url | svg=WxH,path
            # Options pour area
            value
            # Options pour plot
            value | coord | plotsOn
            # Options pour link
            between | factor
            # Options pour legend-area et legend-plot
            mode | exclusive | display | legend-class
            ml | mb | ml-label | ml-title |mb-title | color-title | color-label | color-label-hover
            hide-enabled | hide-opacity | hide-animation
            # Options pour legend-slice
            value | min | max
            legend-slice/label | clicked | display
            legend-font-size | legend-bd-color | legend-bd-width
            @author: LOMART @version: UP-2.3 @license: GNU/GPLv3 @credit: script mapael de neveldo @credit: script raphael @tags: widget
            • mapael: nom de la carte (fichier .js)
            • zoom: valeur mini,maxi du zoom
            • zoom-init: niveau initial et coordonnées du centre
            • options: liste des options au format mapael. ex: default-area: {attrs:{fill:"#dda0dd"},attrsHover:{fill:"#FF00FF"}}

            Gestion des fichiers CSV

            • csv-areas: fichier CSV pour définir les areas. Les sous-shortcodes 'area' sont ignores
            • csv-areas-model: modele pour construire la définition d'une zone
            • csv-plots: fichier CSV pour définir les plots. Les sous-shortcodes 'plot' sont ignores
            • csv-plots-model: modele pour construire la définition d'un point
            • csv-links: fichier CSV pour définir les links. Les sous-shortcodes 'link' sont ignores
            • csv-links-model: modèle pour construire la définition d'un lien

            Style des bulles d'aide

            • tooltip-class: Nom de classe CSS des infobulles
            • tooltip-style: Proprietes CSS pour les infobulles

            Divers

            • before-init: voir demo
            • after-init: voir demo

            Style CSS

            • make-html = 1: par défaut, les blocs pour la ou les légendes sont crees au-dessous de celui pour la carte.
            • map-class = map: Nom de classe CSS du conteneur de la carte
            • id: remplace l'id generee automatiquement par UP
            • class: classe(s) ajoutees au bloc principal
            • style: style inline ajoute au bloc principal
            • css-head (base-css): style ajoute dans le HEAD de la page
            🆙 markdown : Affiche du contenu MARKDOWN provenant d'un fichier ou saisi entre les shortcodes DEMO
            syntaxe 1: {up markdown}contenu{/up markdown}
            syntaxe 2: {up markdown=nom_fichier_md}
            Utilisation : afficher un fichier changelog.md
            @author: LOMART @version: UP-1.3 @credit: erusev/parsedown @license: GNU/GPLv3 @tags: File
            • markdown: chemin et nom du fichier markdown ou vide pour contenu
            • strip-tags = 1: 0 pour conserver les tags HTML dans le contenu saisi entre les shortcodes. Ils sont toujours conservés si la source est un fichier.

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc (obsolète)
            • style: classes et styles pour bloc
            🆙 marquee : contenu HTML défilant horizontalement ou verticalement DEMO
            {up marquee=label} texte du message défilant {/up marquee}
            @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: script JS limarquee de omcg33 @tags: layout-dynamic
            • marquee: le texte de l'etiquette
            • model = base: style CSS dans .upmq-*style*. 0=aucun
            • height (h,hauteur) = 100px: hauteur defaut pour scroll vetical

            Style CSS

            • out-class: classe(s) pour div out
            • out-style: style inline pour div out
            • msg-class: classe(s) pour div msg
            • msg-style: style inline pour div msg
            • lbl-class: classe(s) pour div label
            • lbl-style: style inline pour div label
            • lbl-pos: position label : left, right, top, bottom, none
            • lbl-nowrap: 1 = label sur une ligne

            Divers

            • id: identifiant
            • filter: conditions. Voir doc action filter (v1.8)

            Paramètres Javascript pour configuration

            • direction = left: right, up, down
            • loop = - 1: nombre d'affichage, -1 : infini
            • scrolldelay: delai en millisecondes
            • scrollamount = 50: vitesse
            • circular = 1: mode carousel. si contenu plus large que .str_wrap
            • drag = 1: deplacement msg avec souris
            • runshort = 1: scroll si texte court (visible sans scroll)
            • hoverstop = 1: pause lors survol
            • inverthover: scroll uniquement lors survol
            🆙 media_plyr (vimeo,audio,video) : affiche un lecteur video ou audio qui s'inscrit au maxima dans son bloc parent DEMO
            {up media_plyr=yt | code=bTqVqk7FSmY }
            {up media_plyr=vimeo | code=bTqVqk7FSmY }
            media_plyr : précisez yt ou youtube ou vimeo
            code : il s'agit du code figurant dans l'URL de la vidéo.
            .
            {up media_plyr=video | poster=url image | mp4 | webm | vtt | download }
            media_plyr : video pour indiquer l'URL vers la video.
            poster : nom de l'image fixe (obligatoire)
            mp4, webm, vtt, download : si URL non spécifiée, elle sera déduite de celle pour 'poster'
            .
            {up media_plyr=audio | mp3=url fichier mp3 | ogg}
            media_plyr : audio
            mp3 : url vers fichier MP3 (obligatoire)
            ogg : si URL non spécifiée, elle sera déduite de celle pour 'MP3'
            .
            @author: DANEEL & LOMART @version: UP-1.1 @license: GNU/GPLv3 @tags: Media
            • media_plyr (vimeo,audio,video): type de lecture : youtube, vimeo, video ou audio
            • code: code de la video (à la fin de l'url youtube ou vimeo)
            • poster: URL de l'image (obligatoire)
            • mp4: URL du fichier MP4. Si vide, on utilise le nom de poster
            • webm: URL du fichier WEBM. Si vide, on utilise le nom de poster
            • vtt: URL du fichier VTT pour sous-titrage. Si vide, on utilise le nom de poster
            • download: URL du fichier téléchargeable. Si vide, on utilise le nom du fichier MP4
            • mp3: URL du fichier audio mp3. (obligatoire)
            • ogg: URL du fichier audio ogg. Si vide, on utilise le nom du fichier MP3

            Style CSS

            • id: identifiant
            • class: classe(s) ajoutée(s) au bloc extérieur
            • style: style inline ajouté au bloc extérieur
            🆙 media_vimeo : affiche une video Viméo qui s'inscrit au maxima dans son bloc parent DEMO
            {up media_vimeo=ID [| autoplay | portrait |title |muted |loop | play-on-visible]}
            ID : il s'agit du code figurant à la fin de l'URL de la vidéo.
            L'autoplay sous Firefox/Chrome est interdit si la video contient du son.
            Utilisez muted pour débloquer cela.
            voir https://vimeo.zendesk.com/hc/en-us/articles/115004485728-Autoplaying-and-looping-embedded-videos
            Les options title et portrait ne fonctionne que si la video le supporte.
            @author: Pascal @version: UP-1.9.5 @license: GNU/GPLv3 @tags: Media
            • media_vimeo: code de la video (à la fin de l'url vimeo)
            • width (l,largeur,w): largeur de la video en px ou %
            • autoplay: démarrage automatique
            • title (titre): afficher le titre de la vidéo
            • portrait: afficher l'image de profil de l'auteur (portrait)
            • loop: boucle en fin de video
            • muted: coupe le son
            • play-on-visible: démarre et arrête la video selon sa visibilité sur l'ecran

            Style CSS

            • id: identifiant
            • class: classe pour bloc externe
            • style: code css libre pour bloc externe

            Divers

            • rgpd = 1: 0 pour ne pas appliquer la règle pour le RGPD
            🆙 media_youtube (youtube) : affiche une video Youtube qui s'inscrit au maxima dans son bloc parent DEMO
            {up media-youtube=ID [|autoplay|play-on-visible|muted|loop]}
            ID : il s'agit du code figurant à la fin de l'URL de la vidéo.
            @author: LOMART/ modifié par Pascal @version: UP-0.9 @license: GNU/GPLv3 @tags: Media
            • media_youtube (youtube): code de la video (à la fin de l'url youtube)
            • width (l,largeur,w): largeur de la video en px ou %
            • autoplay: demarrage automatique
            • loop: boucle sur la video
            • muted: coupe le son
            • play-on-visible: démarre et arrête la video selon sa visibilité sur l'ecran

            Style CSS

            • id: Identifiant
            • class: classe pour bloc externe
            • style: code css libre pour bloc externe

            Divers

            • rgpd = 1: 0 pour ne pas appliquer la règle pour le RGPD
            🆙 meteo_concept : Retourne les prévisions météo pour à date donnée pout une ville FRANCAISE donnée

            Cliquer pour lire la documentation

            Basée sur l'API de Météo Concept permettant aux développeurs de site internet ou d'applications d'intégrer des données météorologiques de prévisions ou d'observations pour un lieu ou une station météo souhaitée.
            Pour commencer à l'utiliser l'API, il est nécessaire de s'inscrire sur le site internet de Météo Concept. La formule gratuite permet de faire jusqu'à 500 requêtes par jour.
            Cette inscription fourni une authentification et une autorisation grâce à une clé d'API, appelé communément « token ».
            syntaxe 1
            {up meteo=Date ou dateheure de la prévision |insee=code |token=Token fourni par Météo Concept } 
            syntaxe 2
            {up meteo=Date ou dateheure de la prévision |insee=code |token=Token fourni par Météo Concept } 
            modèle de texte avec mots-clés
            {/up meteo}
            trouver un code insee : https://www.insee.fr/fr/recherche/recherche-geographique
            ---- MOTS CLES
            ##insee## Code Insee de la commune
            ##cp## Code postal de la commune
            ##name## Nom de la commune
            ##latitude## Latitude décimale de la commune
            ##longitude## Longitude décimale de la commune
            ##altitude## Altitude de la commune en mètres
            ##dirwind10m## ou ##winddirs## Direction du vent
            ##gust10m## Rafales de vent à 10 mètres en km/h
            ##gustx## Rafale de vent potentielle sous orage ou grain en km/h
            ##probafog## Probabilité de brouillard entre 0 et 100%
            ##probafrost## Probabilité de gel entre 0 et 100%
            ##rainprob## ou ##probarain## Probabilité de pluie entre 0 et 100%
            ##probawind100## Probabilité de vent >70 km/h entre 0 et 100%
            ##probawind70## Probabilité de vent >100 km/h entre 0 et 100%
            ##rainmax## ou ##rr1## Cumul de pluie maximal sur la journée en mm
            ##rain## ou ##rr10## Cumul de pluie sur la journée en mm
            ##weather-text## Resenti météo sous forme de texte
            ##weather## Resenti météo index (nombre de 0 à 235)
            ##windspeed## ou ##wind10m## Vent moyen à 10 mètres en km/h
            ---- QUART DE JOURNEE UNIQUEMENT
            ##temp## ou ##temp2m## Température à 2 mètres en °C
            ---- JOURNEE ENTIERE UNIQUEMENT
            ##temp-max## ou ##tmax## Température maximale à 2 mètres en °C
            ##temp-min## ou ##tmin## Température minimale à 2 mètres en °C
            ##sun_hours## Ensoleillement en heures
            ##etp## Cumul d'évapotranspiration en mm
            @author: Denis & lomart @version: UP-2.9 @license: GNU/GPLv3 @tags: Widget
            • meteo_concept: Date de la prévision sous la forme AAAAMMJJ (journée) ou AAAAMMJJHHMM (quart de journée début à 1,7,13 ou 19h)
            • insee: Localisation par code insee de la commune (mode prioritaire)

            Si la date n'est pas dans les 14 jours à venir

            • msg: 1 pour afficher un message si hors période de 14 jours
            • msg-before = L\'événement est terminé depuis le %s: message si date antérieure
            • msg-after = Prévisions disponibles à partir du %s: message si date postérieur

            CSS pour bloc principal

            • tag = div: balise utilisée pour le bloc principal si un style est indiqué.
            • style: classe et style pour le bloc principal.

            Paramètres webmaster

            • date-format = %A %e %B %Y: format de la date
            • cache-delay = 60: durée du cache en minutes. 0 pas de cache
            • token: Token fourni par Météo Concept
            🆙 meteo_france : affiche le widget de Météo France DEMO
            Syntaxe : {up meteo-france=ville | orientation=sens}
            le code commune de la ville à récupérer sur http://www.meteofrance.com/meteo-widget
            @author: LOMART @version: UP-1.0 @license: GNU/GPLv3 @tags: Widget
            • meteo_france: le code commune de la ville à récupérer sur http://www.meteofrance.com/meteo-widget
            • orientation = v: bloc horizontal (H) ou vertical (V)
            • block (bloc) = p: balise HTML autour du module météo

            Style CSS

            • id: Identifiant
            • class: classe(s) pour bloc parent
            • style: style inline pour bloc parent
            🆙 modal : Affiche du contenu dans une fenêtre modale (popup) DEMO
            les types autorisés sont : inline, iframe, image, video, ajax
            syntaxe 1 : {up modal=contenu popup | label=texte du lien}
            syntaxe 2 : {up modal=vide,'html','images' ou contenu | label=texte lien}contenu{/up popup}
            si vide ou 'html' : le contenu du popup est le code entre les shortcodes
            si 'img' : chaque image du code entre les shortcodes sera un popup
            sinon on analyse la valeur du paramètre pour déterminer son type
            - video vimeo, youtube ou dailymotion {up modal=//youtu.be/H9fa9aWFbLM}
            - image unique si {up modal=images/xx.jpg} ou png, ...
            - bloc inline si id de bloc {up modal=#bloc}
            - iframe si url {up modal=//lomart.fr} ou {up modal=doc/xx.pdf} ou {up modal=?index/...}
            on peut forcer le type par type=inline, iframe, image, video, ajax
            @author: LOMART @version: UP-1.4 @license: GNU/GPLv3 @credit: https://www.jqueryscript.net/lightbox/Lightbox-Popup-Plugin-Flashy.html @tags: layout-dynamic
            • modal: contenu ou type de contenu
            • type: pour forcer le type : inline, iframe, image, video, ajax
            • id: identifiant
            • class: classe(s) pour bloc label
            • style: style inline pour bloc label
            • label: texte du lien pour afficher le popup. bbcode accepté
            • close-left: croix de fermeture en haut à gauche. haut-droite par défaut
            • zoom-suffix = -mini: suffixe pour les versions vignettes des images
            • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
            • base-js-params: règles JS définies par le webmaster (ajout dans init JS)
            • filter: conditions. Voir doc action filter (v1.8)
            • overlayClose = 1: 1 pour fermer la fenêtre modale en cliquant sur la zone grisée autour du contenu
            • videoAutoPlay: 1 pour démarrer la video à l'ouverture du popup
            • gallery = 1: 0 pour traiter les images individuellement
            • title (titre) = 1: afficher le titre
            • width (l,largeur,w): largeur avec unité. Ex: 80%, 500px, ...
            • height (h,hauteur): hauteur avec unité. Ex: 80%, 500px, ...
            🆙 note : Ajouter des commentaires visibles dans un éditeur WYSIWYG et pas sur le site DEMO
            syntax 1 {up note=texte_commentaire}
            syntax 2 {up note=texte_commentaire} contenu {/up note}
            @author: LOMART @version: UP-1.9.5 @license: GNU/GPLv3 @tags: Editor
            • note = texte masqué. HTML autorisé: texte à masquer
            🆙 osmap : affiche une carte OpenStreetMap DEMO
            syntaxe 1 : {up osmap=latitude, longitude}
            La latitude/longitude peut être connue sur le site : https://www.coordonnees-gps.fr
            Les tuiles disponibles sont ici : https://wiki.openstreetmap.org/wiki/Tile_servers
            .
            syntaxe 2 : multimakers
            {up osmap=latitude, longitude}
            {marker=latitude, longitude | popup-text | popup-clic=0 | marker-image=img | marker-options=...}
            {/up osmap}
            @author: LOMART @version: UP-1.3 @license: GNU/GPLv3 @credit: script de Leaflet @tags: widget
            • osmap: latitude, longitude du centre de la carte (a récupérer sur http://getlatlon.yohman.com)
            • zoom = 13: niveau de zoom de la carte
            • height (h,hauteur) = 250: hauteur du bloc carte. La largeur est 100% du parent
            • scale = 1: affiche l'échelle. 0:sans, 1:métrique, 2:impérial, 3:métrique&impérial
            • map-options: liste des options pour la carte. ex: zoomControl:1, keyboard:0
            • tile: nom de la tuile
            • tile-options: niveau de zoom maximum, ...
            • tile-url: url de la tuile
            • marker = 1: affiche un marker au centre de la carte
            • marker-image: 0: aucun ou chemin image pin
            • marker-options: chaine des options du marqueur. voir https://leafletjs.com/reference-1.3.0.html#icon
            • popup-clic = 1: 0: permanent ou 1: sur clic (si texte)
            • popup-text: texte du popup en bbcode. Si vide, pas de popup
            • gmap (googlemap): texte du lien affiché au-dessous de la carte pour afficher la carte sous GMap
            • gmap-url: optionnel.Permet d'afficher un marqueur
            • id: id genérée automatiquement par UP
            • class: classe(s) ajoutées au bloc principal
            • style: style inline ajouté au bloc principal
            🆙 page_search : Cherche un mot dans la page courante DEMO
            syntaxe {up page-search}
            @author: LOMART @version: UP-2.7 @license: GNU/GPLv3 @credit: fork of script Fast Live Search de gurudaths @tags: Widget
            • page_search = body: sélecteur CSS du bloc où rechercher. J3=.article-details OU J4=.com-content-article__body

            Position de la zone de recherche

            • search-top = 80px: position verticale de la zone de recherche. positif: top, négatif: bottom
            • search-left = 80px: position horizontale de la zone de recherche. positif=left, négatif= right

            Icone et texte de la zone de recherche

            • search-icon = loupe-64-red.png: image pour le bouton. Si le chemin n'est pas indiqué, l'image est dans le dossier de l'action.
            • search-text = lang[en=Search;fr=Rechercher]: texte indice dans la zone de recherche (Placeholder)

            Mise en évidence du résultat

            • highlight-bg = yellow: couleur de surlignage des mots trouvés

            Style CSS

            • id: id genérée automatiquement par UP
            • class: classe(s) ajoutées au bloc principal
            • style: style inline ajouté au bloc principal
            • css-head (base-css): style ajouté dans le HEAD de la page
            🆙 pdf : Affiche un PDF dans le contenu ou génère un bouton pour l'afficher dans une fenêtre DEMO
            Le fichier PDF peut-être hébergé sur le serveur ou ailleurs (url absolue)
            syntaxe {up pdf=chemin du fichier PDF}
            integration libraire TurnJs http://turnjs.com/ depuis https://github.com/iberan/pdfjs-flipbook
            @author: LOMART @version: UP-1.4 @license: GNU/GPLv3 @credit: Mozilla PDF.js @tags: File
            • pdf: chemin du fichier pdf
            • method (methode) = PDFJS: ou Google, Embed ... ou 0
            • view = 1: 0 = masque le PDF
            • width (l,largeur,w) = 100%: largeur iframe
            • height (h,hauteur) = 500px: hauteur iframe

            Gestion du lien pour télécharger le PDF

            • download = 1: 1 pour afficher lien téléchargement
            • download-name: nom du fichier téléchargé
            • download-text = en=Download %s;fr=Telecharger %s: texte pour lien
            • download-icon: image affichée devant le lien
            • download-class: class(s) pour bouton lien seul
            • download-style: style inline pour bouton lien seul

            Gestion bouton pour afficher le PDF

            • btn (bouton): 1 pour afficher un bouton
            • btn-target = _blank: cible : _blank, _parent, popup ou _popup
            • btn-text = voir %s: texte pour bouton
            • btn-icon: image affichée devant le texte du bouton
            • btn-class = btn btn-primary: class(s) pour bouton lien seul
            • btn-style: style inline pour bouton lien seul

            Divers

            • close-left: 1=croix de fermeture en haut à gauche. 0=haut-droite par défaut
            • flip: activer le mode flipbook uniquement si PDFJS
            • background: couleur fond perdu du PDF au format #rrggbb
            • pdfjs-model = web: ou mobile (non opérationnel)

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc parent
            • style: style inline pour bloc parent
            • tag = div: balise pour bloc parent - v2.9
            • css-head (base-css): style ajouté dans le HEAD de la page
            🆙 pdf_gallery : Affiche une liste des PDF contenus dans un dossier DEMO
            syntaxe {up pdf-gallery=dossier}
            syntaxe {up pdf-gallery=dossier}template{/up pdf-gallery}
            Template pour définir le rendu
            ##name## : nom et extension du fichier sans le prefixe date
            ##full-name## : nom et extension du fichier avec le prefixe date
            ##human-name## : nom du fichier sans les tirets
            ##size## : taille du fichier
            ##date## : date du fichier ou prefixe date du nom de fichier
            ##info## : fichier .info de même nom que le PDF avec texte descriptif
            ##image## : fichier jpg ou png de même nom que le PDF
            ##image-view## : idem ##image## avec lien pour afficher PDF dans fenêtre modale
            ##btn-view## : lien pour afficher PDF dans fenêtre modale. Texte selon btn-view-text
            ##btn-download##, ##name-download## : lien pour télécharger le PDF. Texte selon btn-download-text
            ##preview## : vue du PDF avec la méthode jsviewer de l'action PDF.
            ATTENTION ##preview## charge tous les fichiers PDF lors de l'affichage de la page
            @author: LOMART @version: UP-2.8 @license: GNU/GPLv3 @credit: Mozilla PDF.js @tags: File
            • pdf_gallery: chemin du dossier contennat les PDF
            • file-mask: pour sélectionner les fichiers d'un dossier. ex: fic-*
            • sort-by = name: tri des fichiers. name ou date. Voir la demo
            • sort-order = asc: sens du tri. asc ou desc
            • msg-no-file = en=no file;fr=aucun fichier: message si aucun fichier PDF dans le dossier
            • template (item-template) = ##human-name## [small](##size## - ##date##)[/small] ##btn-view## ##btn-download##: modele pour affichage (bbcode et motcle)

            Balise pour affichage de la liste

            • main-tag (block) = ul: balise principale. 0 = aucune
            • item-tag = li: balise pour le bloc d'un fichier. 0 = aucune

            Configuration prévisualisation du PDF

            • preview-width = 100%: largeur du bloc pour preview
            • preview-height = 500px: hauteur du bloc pour preview
            • preview-background: couleur fond perdu du PDF (preview et modal) au format #rrggbb

            Configuration fenêtre modale

            • popup-width: largeur de la fenêtre popup avec unité. Ex: 90vw, 80%, ...
            • popup-height: hauteur de la fenêtre popup avec unité. Ex: 90vh, 500px, ...
            • popup-close-left: croix de fermeture en haut à gauche. haut-droite par défaut

            Bouton télécharger le PDF

            • add-sitename: texte à ajouter au début des fichiers téléchargés
            • btn-download-text = en=Download;fr=Telecharger: texte pour le bouton 'télécharger'
            • btn-download-style: classe et style inline pour le bouton 'télécharger'

            Bouton voir le PDF

            • btn-view-text = Voir: texte pour bouton 'voir'
            • btn-view-style: classe et style inline pour le bouton 'voir'

            style pour ##image##

            • image-style: classe et style pour l'image
            • info-style: classe et style pour le contenu du fichier .info. Ajoute un bloc DIV

            Format pour les mots-clés

            • format-date = lang[en=m/d/Y H:i;fr=d/m/Y H:i]: format pour la date. ex: 'd/m/Y H:i'
            • prefix-date-size: ou le nombre de caractères pour définir la date. 13 si YYYYMMDDHHMM-, 11 si YYYY-MM-DD-

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc parent
            • style: style inline pour bloc parent
            • item-style: classe et style inline pour un bloc fichier
            • css-head (base-css): règles CSS ajoutés dans le HEAD
            🆙 php : permet d'exécuter du code PHP dans un article. DEMO
            Exemples :
            date actuelle : {up php=echo date('d-m-Y H:i:s');}
            langage : {up php=echo JFactory::getLanguage()getTag(); }
            nom user : {up php= $user = JFactory::getUser(); echo ($user->guest!=1) ? $user->username : 'invité'; }
            @author: LOMART @version: UP-1.0 @license: GNU/GPLv3 @tags: Expert
            • php: le code PHP

            Style CSS

            • tag = div: balise utilisée pour les classes, styles et id si class ou style définis
            • id: identifiant
            • class: classe(s) ou style pour le bloc retour'
            • style: classe(s) ou style pour le bloc retour'

            Divers

            • filter: conditions. Voir doc action filter (v1.8)
            🆙 php_error : Active les rapports d'erreurs PHP DEMO
            syntaxe {up php_error} // dev (defaut) ou 0, min, max
            A METTRE A LA FIN DE L'ARTICLE (UP commence par la fin!)
            @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @tags: Expert
            • php_error = dev: mode rapport d'erreurs : none, 0, min, max, dev
            • id: identifiant
            🆙 popover : Affiche une grosse info-bulle lors d'un clic sur un élément. DEMO
            syntaxe {up popover=texte appel en bbcode}contenu popover{/up popover}
            @author: LOMART @version: UP-2.5 @license: GNU/GPLv3 @credit: script jquery-gpopover-plugin de markembling @tags: EDITOR
            • popover: bbcode pour élément déclencheur

            Style de la fenêtre popup

            • max-height: hauteur maxi du popover (ex: 90vh)
            • pop-bg-color: couleur de fond du popover
            • pop-class: classe du popover
            • pop-style: style inline du popover

            Style de l'élément déclencheur

            • tag = button: balise pour élément déclencheur
            • id: id genérée automatiquement par UP
            • class: classe(s) pour element déclencheur
            • style: style inline pour element déclencheur
            • css-head (base-css): style ajouté dans le HEAD de la page

            paramètres Javascript pour la configuration du popover

            • width (l,largeur,w) = 250: largeur du popover en px
            • top (t) = false: true : popover au-dessus du trigger, sinon au-dessous
            • arrow = true: affichage de la fleche
            • offset: décalage entre trigger et popover
            • viewportSideMargin = 10: Espace à laisser sur le côté lorsqu'il est contre le bord de la fenêtre (pixels)
            • fadeInDuration = 65: Durée de l'animation de fondu enchaîné popover (ms)
            • fadeOutDuration = 65: Durée de l'animation de fondu sortant du popover (ms)
            • preventHide = true: Empêcher le masquage lors d'un clic dans le popover
            • onShow: fonction à exécuter lorsque le popover est affiché. c'est l'élément déclencheur et le premier argument passé à la fonction est l'élément popover (tous deux enveloppés dans jQuery).
            • onHide: Callback à exécuter lorsque le popover est masqué. Identique à onShow.
            🆙 printer : Ajoute un bouton pour proposer l'impression d'une partie de la page DEMO
            syntaxe {up printer=texte bouton} le contenu à imprimer {/up printer}
            @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: Editor
            • printer = &#x2399; Imprimer: texte du bouton
            • selector: sélecteur CSS du bloc à imprimer

            Position du bouton

            • btn-before: le bouton est après le contenu à imprimer
            • btn-display-on-print: 0 = masque le bouton sur l'impression

            Divers

            • filename: nom du document si impression PDF
            • id: identifiant

            Style CSS du bouton

            • class: classe(s) pour bloc
            • style: style inline pour bloc
            • css-head (base-css): style ajouté dans le HEAD de la page
            🆙 qrcode : Génére des QRCodes avec Google API DEMO
            syntaxe {up qrcode=type | xxx=...}
            @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: widget
            • qrcode = text: type de QRCode : text/url/sms/email/phone/location/wifi/contact
            • size = 200: Largeur

            Les types de contenus

            • name: nom pour contact
            • text: texte libre pour text, sms, email, contact
            • phone: numéro de téléphone pour sms, tel, contact
            • url: site Internet pour url, contact
            • email: adresse email pour email, contact
            • subject: sujet pour email
            • latitude: pour geo
            • longitude: pour geo
            • address: adresse pour contact
            • ssid: identifiant point d'accés pour wifi
            • auth = WPA: WPA ou WEP pour wifi
            • password: clé wifi du point d'accés pour wifi

            Divers

            • alt: texte alternatif, si le qrcode n'est pas affiché
            • encoding = UTF-8: code pour texte

            Style CSS

            • id: identifiant
            • class: classe(s) pour bloc
            • style: style inline pour bloc
            • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
            🆙 readmore : afficher/cacher un bloc HTML à l'aide d'un bouton 'lire la suite' DEMO
            syntaxe:
            {up readmore=texte bouton | textless=replier} contenu caché {/up readmore}
            @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: script de Matt @tags: layout-dynamic
            • readmore: idem textmore

            Texte des boutons

            • textmore = lire la suite: texte bouton OUVRIR
            • textless = replier: texte bouton FERMER

            Style des boutons

            • textmore-class: classe et style pour le bouton OUVRIR
            • textless-class: classe et style pour le bouton FERMER

            Style pour le panneau contenu

            • panel-style: classes et style pour le contenu (v2.6)

            Style CSS des boutons

            • id: identifiant
            • class = uprm-btn: classe(s) pour les boutons OUVRIR et FERMER
            • style: idem
            🆙 sameheight : égalise la hauteur des enfants directs du bloc (p ou div) DEMO
            syntaxe:
            {up sameheight}
            < div>...< /div>
            < div>...< /div>
            {/up sameheight}
            note: gestion de la largeur avec l'option "css-head" qui ajoute du code css dans le head
            exemple: css-head=.sameheight[float:left;width:30%;]
            Attention: remplacer les {} par []
            @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: un vieux script de mes archives @tags: HTML
            • sameheight: inutilisé
            • id:
            • class: classe(s) pour bloc principal
            • style: style pour bloc principal
            • css-head (base-css): code css libre dans le head. attention: ] au lieu de }
            🆙 scroll_indicator : Affiche la position dans la page dans un cercle autour du curseur DEMO
            syntaxe {up scroll-indicator}
            @version: UP-2.9 @author: Lomart @license: GNU/GPLv3 @credit: script de ig_design @tags: editor
            • scroll_indicator: aucun argument
            • bg-color: couleur de base du cercle (rgba() ou #RRGGBBAA )
            • color: couleur du segment indicateur (rgba() ou #RRGGBBAA )
            • size: largeur du segment indicateur (1 à 100)

            Style CSS

            • id: Identifiant
            • css-head (base-css): style ajouté dans le HEAD de la page
            🆙 scroller : Défilement vertical d'une liste d'éléments DEMO
            syntaxe : {up scroller}suite d'éléments{/up scroller}
            Attention :
            - définir un style="height:..." aux images (pas de height="...")
            @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @credit: Responsive jQuery News Ticker de gagi270683 adapté pour UP @tags: layout-dynamic
            • scroller: nombre d'élément ou hauteur du bloc en px

            Style CSS

            • id: Identifiant
            • class: classe(s) pour la balise principale
            • style: style inline pour la balise principale
            • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

            paramètres Javascript pour configuration

            • newsPerPage = 4: nombre de blocs par page. Idem option principale
            • navigation = true: affiche la navigation haut/bas
            • autoplay = true: active la lecture automatique
            • direction = up: sens de défilement (up/down)
            • animationSpeed = normal: normal, slow ou fast
            • newsTickerInterval = 4000: autoplay interval en ms
            • pauseOnHover = true: arrêt défilement lors survol souris
            🆙 site_visit : comptabilise le nombre d'appel de cette action et affiche le nombre de visite DEMO
            syntaxe :
            {up site-visit} : incrémente le fichier log-path/alias_article.stat
            {up site-visit=nom} : incrémente le fichier log-path/nom.stat
            {up site-visit | info} : liste le contenu de tous les fichiers .stat dans log-path
            {up site-visit | info=xxx} : liste le contenu de tous les fichiers action-xxx.stat dans log-path
            Les données sauvées dans xxx.stat sont ##alias## : le nom du fichier, puis dans l'ordre :
            ##counter## : le cumul des visites
            ##lastdate## : la date dernère consultation
            ##id##, ##alias##, ##title##, ##created##, ##updated## : données de l'article
            ##catid##, ##catalias## : id et alias de la catégorie de l'article
            ##detail## : affiche le détail des visites par année, mois, langue
            @version: UP-2.9 @author: lomart @license: GNU/GPLv3 @tags: Expert

              Options principales

              • site_visit: nom du compteur, si vide = alias article (si info=0)
              • catid-include: liste des id catégories à inclure, séparateur virgule
              • catid-exclude: liste des id catégories à exclure, séparateur virgule
              • usergroup-list: liste des groupes d'utilisateurs à exclure, séparateur virgule
              • ip-list = 127.0.0.0, localhost: liste des IP à ignorer. les botnets sont ignorés, séparateur virgule
              • bots-list = bot,spider,crawler,libwww,search,archive,slurp,teoma,facebook,twitter: liste de bots exclus

              Options pour affichage résultats

              • info: masque des fichiers stat et log dont le contenu est listé. vide = article courant, * = tous ou masque fichier
              • info-template = ##counter## visites au ##lastdate##: modele d'affichage
              • info-catid-include: liste des catégories prise en compte
              • info-sort: tri de la liste. Par défaut ##alias##. Tous les mots sont utilisables
              • info-sort-order = asc: sens de tri sur l'ensemble des mots-clé de info-sort
              • detail-period-style: style ajouté pour la période de la liste détaillée
              • use-bbcode: utilise le format bbcode dans le résultat. A utiliser pour un export en CSV
              • date-format = lang[en=%B %se, %Y;fr=%e %B %Y]: format pour la date
              • no-content-html = "lang[en=No statistical data;fr=Aucune donnée statistique]": message affiché si aucun résultat pour la sélection

              Gestion style d'une ligne

              • item-tag: balise pour les lignes de la liste
              • item-class: classe pour les lignes de la liste
              • item-style: style pour les lignes de la liste

              Gestion style du bloc principal

              • main-tag (block): balise pour la liste
              • id: identifiant
              • class: classe(s) pour bloc
              • style: style inline pour bloc
              • css-head (base-css): style ajouté dans le HEAD de la page

              Pour webmaster - à ajouter dans le fichier prefs.ini

              • log = 1: argumente un fichier nom_compteur.log avec IP, langage et date
              • dir-logs = up/site-visit: dossier pour logs
              🆙 sitemap : Création d'un fichier 'sitemap.xml' en racine du site

              Cliquer pour lire la documentation

              syntaxe {up sitemap}
              @author: LOMART @version: UP-2.7 @license: GNU/GPLv3 @tags: Expert
              • sitemap: nom menutype exclus
              • cron = +1 semaine: délai entre 2 générations automatiques
              • frequency: fréquence : always, hourly, daily, weekly, monthly, yearly, never
              • priority: priority de 0.1 à 1
              • menutype-exclude: nom menutype à exclure (idem option principale)
              • info: afficher le nombre de liens et la liste des pages non indexées
              • id: identifiant
              🆙 slider_owl : bandeau défilant d'images ou de blocs HTML DEMO
              {up slider-owl |items=2}
              < div>...< /div>
              < img src="/...">
              < a href="/..">< img src="/...">< /a>
              {/up slider-owl}
              @author: LOMART @version: UP-1.0 @license: GNU/GPLv3 @credit: script OWL Carousel de OwlFonk @tags: image
              • slider_owl: aucun paramètre nécessaire

              Style CSS

              • id: id genérée automatiquement par UP
              • class: classe(s) ajoutées au bloc principal
              • style: style inline ajouté au bloc principal
              • css-head (base-css): style ajouté dans le HEAD de la page

              JS : autoplay

              • autoPlay: 0 ou durée affichage image en millisecondes
              • slideSpeed = 200: vitesse de transition en millisecondes

              JS : pagination

              • paginationSpeed: durée changement en millisecondes
              • pagination = true: affiche pagination
              • paginationNumbers: affiche numéros à l'intérieur des boutons de pagination

              JS : navigation

              • goToFirst = 1: Retour sur premier élément si lecture automatique à la fin
              • goToFirstSpeed = 1000: vitesse de l'option goToFirst en millisecondes
              • navigation = false: affichage boutons "next" et "prev"
              • navigationText = "prev,next": boutons sans texte: "navigationText: false"

              JS : nombre d'images selon largeur écran

              • responsive = true: adaptation sur petits ecrans
              • items: nombre maxi d'éléments affichés en même temps sur la plus grande largeur de navigateur
              • itemsDesktop = [1199, 4]: cela vous permet de prédéfinir le nombre de diapositives visibles avec une largeur de navigateur particulière. Le format est [x, y] où x = largeur du navigateur et y = nombre de diapositives affichées. Par exemple, [1199,4] signifie que si (window <= 1199) {affiche 4 diapositives par page} Vous pouvez également utiliser "itemsDesktop: false" pour ignorer ces paramètres. Pour bien comprendre comment cela fonctionne, consultez ma démo personnalisée
              • itemsDesktopSmall = [979, 3]: voir ci-dessus
              • itemsTablet = [768, 2]: voir ci-dessus
              • itemsMobile = [479, 1]: voir ci-dessus
              🆙 slideshow_billboard : Slideshow responsive d'images avec légendes et liens DEMO
              syntaxe 1:
              {up slideshow_billboard=chemin_sous_dossier}
              syntaxe 2:
              {up slideshow_billboard}
              < img src="/images/img.jpg" alt="légende"> // image avec légende dans alt
              < a href="#">< img src="/img.jpg">< /a> // image avec lien
              {/up slideshow_billboard}
              @author: LOMART @version: UP-1.1 @license: GNU/GPLv3 @credit: Easy jQuery Responsive Slideshow - Billboard de Spalmer @tags: layout-dynamic
              • slideshow_billboard: si indiqué, toutes les images de ce dossier (ordre alpha)
              • label = 1: affiche la légende des images (attribut alt ou nom fichier humanisé).
              • zoom-suffix: si indiqué, seules les images avec ce suffixe sont utilisées

              Style CSS

              • id: id genérée automatiquement par UP
              • class: classe(s) ajoutées au bloc principal
              • style: style inline ajouté au bloc principal
              • css-head (base-css): style ajouté dans le HEAD de la page

              paramètres Javascript pour configuration

              • ease = easeInOutExpo: mode de transition
              • speed = 1000: durée des transitions en millisecondes
              • duration = 5000: durée entre les changements d'images
              • autoplay = 1: démarrage automatique
              • loop = 1: diaporama en boucle si exécution automatique est vraie
              • transition = left: "fade", "up", "down", "left", "right"
              • navType = list: "controls", "list", "both" or "none"
              • styleNav = 1: applies default styles to nav
              • includeFooter = 1: afficher/masquer le pied de page (légende et navigation)
              • autosize = 1: hauteur diaporama fixe. calcul sur 1ère image
              • resize: tente de détecter automatiquement la taille de chaque diapositive
              • stretch = 1: étire les images pour remplir le conteneur
              🆙 snowfall : Simule des chutes de neige ou autres ... DEMO
              syntaxe
              site : {up snowfall=image}
              bloc : {up snowfall=image | selector=bloc}
              @author: LOMART @version: UP-1.5 @license: GNU/GPLv3 @credit: Script JQuery-Snowfall de loktar00 @tags: body
              • snowfall = snow-01.png: image ou dossier
              • selector = body: cible pour snowfall

              Taille, vitesse et nombre des images

              • nb = 20: nombre d'images affichées en même temps
              • size = 20/40: taille mini/maxi des images en px
              • speed = 1/5: vitesse mini/maxi des images

              Style CSS

              • id: identifiant
              • class: classe(s) pour bloc
              • style: style inline pour bloc
              • center: style et classe pour centrage vertical du contenu entre shortcodes
              • z-index = 99: z-index des images

              Divers

              • filter: conditions. Voir doc action filter
              🆙 sound_hover : Joue un son au survol d'un élément ou d'un événement JS DEMO
              syntaxe {up sound_hover=fichier_son }image{/up sound_hover}
              @author: LOMART @version: UP-1.1 @license: GNU/GPLv3 @credit: adaptation du script playSound de Alexander Manzyuk @tags: Media
              • sound_hover: fichier_son
              • evenement = onmouseenter: ou onclick, onmouseover...

              Style CSS

              • tag = div: balise pour le bloc. span pour un bloc inline
              • id: id genérée automatiquement par UP
              • class: classe(s) pour le bloc parent
              • style: style pour le bloc parent
              🆙 span : Facilite la saisie d'un bloc inline SPAN avec un éditeur wysiwyg DEMO
              syntaxe {up span=class_and_style}content{/up span}
              @author: LOMART @version: UP-2.0 @license: GNU/GPLv3 @tags: HTML
              • span: classes et style (séparateur : point-virgule)
              • id: si indiqué, l'attribut ID est ajouté à la balise SPAN
              • class: classe(s) pour bloc (méthode traditionnelle)
              • style: style inline pour bloc (méthode traditionnelle)
              • css-head (base-css): style ajouté dans le HEAD de la page
              🆙 sql : Requête SQL avec mise en forme et tri DEMO
              syntaxe {up sql=nom_table | ...}
              Terminologie:
              row : ligne de la table
              col : cellule. Colonne de la table
              tag ou motclé : ##nomcol##
              @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @credit: script Stupid Table de joequery @tags: Joomla
              • sql: nom de la table
              • select = *: listes des colonnes
              • where: commande SQL : where
              • order: commande SQL : order
              • group: commande SQL : group
              • innerjoin: commande SQL : innerjoin
              • outerjoin: commande SQL : outerjoin
              • leftjoin: commande SQL : leftjoin
              • rightjoin: commande SQL : rightjoin
              • setlimit: commande SQL : setlimit

              informations sur la base de données

              • dbinfos: vide= la liste des tables OU nom_table = la liste des colonnes

              mise en forme du résultat

              • id: identifiant
              • main-class = up: classe(s) pour bloc
              • main-style: style inline pour bloc
              • item-class: classe(s) pour ligne
              • item-style: style inline pour ligne
              • css-head (base-css): style ajouté dans le HEAD de la page
              🆙 tab : affiche du contenu dans des panneaux avec onglets en haut, à gauche ou à droite. DEMO
              Mode responsive avec gestion de l'espacement vertical
              {up tab}
              < h4>texte onglet< /h4>
              < p>texte du panneau< /p>
              < img src="/..">
              {/up tab}
              Sur mobile ou sur demande, l'affichage est en mode accordion
              script JS adapté par Lomart pour gestion répartition verticale
              @author: Lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: Script de bhaveshcmedhekar @tags: layout-dynamic
              • tab = tab: tab ou accordion
              • auto: 0 ou delai en millisecondes pour changement automatique d'onglet

              Style des titres (onglets)

              • title-tag = h4: balise utilisée pour les titres onglets
              • title-style: classe(s) et style inline onglets
              • title-class: classe(s) onglets (obsolète)

              Style des panneaux de contenu

              • content-style: classe(s) et style inline contenu
              • content-class: classe(s) contenu (obsolète)
              • espace-vertical = 1: 0, 1 ou 2 : niveau des éléments à répartir

              Style du bloc principal

              • id: identifiant
              • style: classe(s) et style(s) bloc principal
              • class: classe(s) bloc principal (obsolète)
              • css-head (base-css): règles CSS mises dans le head

              paramètres Javascript pour configuration

              • side: left ou right
              • active_tab: 1 a N
              • plugin_type: accordion (interne, ne pas modifier)
              • content_display = block: interne, ne pas modifier, défini par espace-vertical
              🆙 table_by_columns (table_par_colonnes) : tables responsives par empilement des lignes d'une colonne. DEMO
              Syntaxe {up table-par-colonnes}
              < table> ... < /table>
              {/up table-par-colonnes}
              Les lignes sont empilées par colonnes. Très pratique pour des plannings
              @author: lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: John Polacek @tags: Responsive
              • table_by_columns (table_par_colonnes): rien
              • model = up-stacktable: nom d'un fichier CSS prévu par le webmaster pour toutes les tables de la page
              • max-height: permet de limiter la place en hauteur par l'affichage d'un ascenseur
              • breakpoint = 720px: bascule en vue responsive
              • key-width = 35%: largeur de la première colonne en vue responsive
              • title-style: style pour la ligne titre en vue responsive

              Style CSS

              • id: Identifiant
              • style: style inline pour balise table
              • class: classe(s) pour balise table (obsolète)
              • css-head (base-css): permet d'ajouter des style à la table incluse
              🆙 table_by_rows (table_par_lignes) : tables responsives par empilement des colonnes par lignes. DEMO
              {up table-par-lignes}
              < table> ... < /table>
              {/up table-par-lignes}
              les colonnes sont empilées par lignes avec la possibilité de les déplacer, de les fusionner, de supprimer le titre, d'afficher seulement certaines colonnes. https://github.com/codefog/restables/blob/master/README.md
              .
              IMPERATIF : Les titres des colonnes doivent être dans une balise HEAD
              @author: lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: codefog @tags: Responsive
              • table_by_rows (table_par_lignes): rien
              • breakpoint = 720px: bascule en vue responsive
              • max-height: max-height pour la table

              Style CSS

              • id: identifiant
              • style: style inline pour balise table
              • class: classe(s) pour balise table (obsolète)
              • css-head (base-css): permet d'ajouter des style à la table incluse

              paramètres Javascript pour configuration

              • merge: fusion de colonnes. 1:[2,3],5:[6] = 2&3 avec 1 et 6 avec 5
              • move: déplacement colonne. 1:0,6:1 = 1 au debut et 6 en 2eme
              • skip: non visible. [3,5] = col 3 et 5 non visible
              • span: [2,4] = valeur sans libellé (eq: colspan)
              🆙 table_fixe : tables responsives: ligne entete reste visible DEMO
              {up table-fixe}
              < table> ... < /table>
              {/up table-fixe}
              col-left : nombre de colonnes toujours visible.
              Une barre de défilement est ajoutée pour les autres colonnes.
              @author: lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: lai32290 @tags: Responsive
              • table_fixe: aucun argument
              • col-left: nombre de colonnes fixées à gauche
              • max-height: max-height pour le bloc parent

              Style CSS

              • id: identifiant
              • style: classes et styles pour le bloc parent
              • class: classe(s) pour le bloc parent (obsolète)
              • css-head (base-css): permet d'ajouter des style à la table incluse
              🆙 table_flip (table_permute) : tables responsives par permutation lignes/colonnes DEMO
              Inversion colonnes/lignes. les titres de colonnes deviennent la 1ère colonne et reste visibles.
              Une barre de défilement est ajoutée pour les autres colonnes.
              {up table-flip}
              < table> ... < /table>
              {/up table-flip}
              @author: lomart @version: UP-1.0 @license: GNU/GPLv3 @credit: Jason Gross @tags: Responsive
              • table_flip (table_permute): aucun argument

              Style CSS

              • id: identifiant
              • style: classes et styles inline pour balise table
              • class: classe(s) pour balise table (obsolète)
              • css-head (base-css): permet d'ajouter des style à la table incluse
              🆙 table_sort : Trier, filtrer et paginer une table DEMO
              syntaxe {up table-sort}LA TABLE{up table-sort}
              @author: LOMART @version: UP-2.3 @license: GNU/GPLv3 @credit: script jQuery fancyTable de myspace-nu @tags: layout-dynamic
              • table_sort: Aucun argument
              • col-type: mode de tri des colonnes. n=numerique, a=alphanum, i=alphanum case insensitive
              • col-init: n° de la colonne triée au chargement et sens (asc, desc)

              champs pour recherche

              • placeholder = lang[en=Search;fr=Rechercher]: texte dans la zone recherche
              • globalSearch: vide= recherche sur toutes les colonnes, sinon liste des colonnes (1,2,5)

              Pagination

              • pagination: nombre de lignes par pages ou 0 pour désactiver
              • pagination-class: classe pour les boutons
              • pagination-class-active: classe pour le bouton actif

              Style CSS

              • id: id genérée automatiquement par UP
              • class: classe(s) ajoutées à la table
              • style: style inline ajouté à la table
              • css-head (base-css): style ajouté dans le HEAD de la page

              paramétres JS

              • sortable = 1: Activer le tri
              • searchable = 1: Activer la recherche
              🆙 tabslide : ajoute des onglets pour ouvrir un panneau sur les bords de la fenêtre DEMO
              syntaxe {up tabslide=btn-text | tabLocation=top}contenu{/up tabslide}
              utilisation :
              - un sommaire sur le coté du site
              - un module connexion
              @author: Lomart @version: UP-1.0 @credit: script de hawk-ip @license: GNU/GPLv3 @tags: Body

                l'onglet

                • tabslide: titre de l'onglet
                • tab-style: classes et styles inline pour onglets
                • tab-class: classe(s) pour onglet (obsolète)

                le panneau

                • id: identifiant
                • panel-style: classes et styles inline pour panneau
                • panel-class: classe(s) pour panneau (obsolète)

                Options JS disparues - conservés pour compatibilité

                • speed = 300: OBSOLETE voir bounceSpeed
                • positioning = fixed: or absolute, so tabs move when window scrolls
                • toggleButton = .tab-opener: not often used

                paramétres JS : définition de l'onglet

                • tabLocation = left: position : left, right, top ou bottom
                • onLoadSlideOut: slide out after DOM load
                • clickScreenToClose = 1: fermer l'onglet lorsque le reste de l'écran est cliqué
                • tabHandle = .handle: Sélecteur JQuery pour l'onglet, peut utiliser #
                • action = click: mode ouverture : 'hover' ou 'click'
                • hoverTimeout = 5000: sélai en ms pour garder l'onglet ouvert après la fin du survol - uniquement si action = 'hover'
                • offset = 200px: distance pour top or left (bottom or right si offsetReverse est vrai)
                • offsetReverse: true= aligné a droite ou en bas
                • otherOffset = null: si défini, la taille du panneau est définie pour maintenir cette distance à partir du bas ou de la droite (haut ou gauche si offsetReverse)
                • handleOffset = null: Si null, détecte la bordure du panneau pour bien aligner la poignée, sinon la distance en px
                • handleOffsetReverse: si vrai, poignée alignée avec la droite ou le bas du panneau

                paramétres JS : Animation

                • bounceDistance = 50px: distance autorisée pour le rebond
                • bounceTimes = 4: nombre de rebonds si 'bounce' est appelé
                • bounceSpeed = 300: vitesse d'animation des rebonds

                paramétres JS : image pour l'onglet

                • pathToTabImage = null: image facultative à afficher dans l'onglet
                • imageHeight = null: hauteur image
                • imageWidth = null: largeur image

                paramétres JS : pour expert

                • onOpen = function () {}: appelé après l'ouverture
                • onClose = function () {}: appelé après la fermeture
                • onSlide = function () {}: appelé après l'ouverture ou la fermeture
                🆙 text_fit : Ajuste un texte à son conteneur DEMO
                syntaxe {up up text-fit=option_principale}texte{/up text-fit}
                @version: UP-2.2 @author: LOMART @license: GNU/GPLv3 @credit: script Textblock de glyphic-co @tags: HTML
                • text_fit: sélecteur du bloc. ex: h1, h1.foo, #id, h2#id, ...

                Définition des valeurs minimales/maximales

                • blocsize = 320-960: largeur mini-maxi en px du bloc conteneur
                • fontsize = 1-1.8: taille mini-maxi en em de la police. Autre unité : em,rem,px,ex,%,vh,vw. ex : 16-32px
                • lineheight = 1.33-1.25: hauteur de ligne mini-maxi. facteur multiplicateur de la taille de la police
                • fontweight: graisse mini-maxi si police variable. ex: 400-900

                Divers

                • fontfile: chemin vers le fichier d'une police de caractère
                • fontclass: nom de la classe attribué à la police
                • container = parent: bloc utilisé pour calcul blocsize. parent ou self.

                Style CSS

                • tag = div: balise par defaut
                • id: identifiant
                • class: classe(s) pour bloc
                • style: style inline pour bloc
                • css-head (base-css): style ajouté dans le HEAD de la page
                🆙 text_typewriter : Afficher plusieurs phrases avec un effet machine à écrire DEMO
                syntaxe 1 : {up text-typewriter=mot1, mot2, ..., motN}
                syntaxe 2 : {up text-typewriter}alternatives dans blocs enfants {/up text-typewriter}
                @version: UP-2.4 @author: LOMART @license: GNU/GPLv3 @credit: script typed.js de mattboldt @tags: HTML
                • text_typewriter: liste de mots séparés par des virgules

                Style CSS

                • id: identifiant
                • class: classe(s) pour bloc
                • style: style inline pour bloc
                • css-head (base-css): style ajouté dans le HEAD de la page

                paramétres JS : vitesse affichage

                • typeSpeed: vitesse de frappe en ms
                • startDelay: délai en ms avant chaque série
                • backSpeed: vitesse de l'espacement arrière en millisecondes
                • backDelay = 700: délai en ms avant effacement

                paramétres JS : gestion du fondu pour transition

                • fadeOut = false: Fondu au lieu de retour en arrière
                • fadeOutClass = typed-fade-out: classe CSS pour l'animation du fondu
                • fadeOutDelay = 500: Durée du fondu en millisecondes

                paramétres JS : affichage en boucle

                • loop = false: chaînes en boucle
                • loopCount = Infinity: nombre de boucles

                paramétres JS : divers

                • smartBackspace = true: n'efface que ce qui ne correspond pas à la chaîne précédente
                • shuffle = false: mélange les phrases
                • showCursor = true: montrer le curseur
                • cursorChar = |: caractère pour le curseur
                • autoInsertCss = true: insérer le CSS pour le curseur et le fadeOut dans le HTML
                • attr = null: attribut pour la saisie. Ex: input placeholder, value, or just HTML text
                • bindInputFocusEvents = false: lier le focus et le blur si élément est une entrée de texte
                • contentType = html: 'html' ou 'null' pour texte brut
                🆙 toc : Sommaire automatique DEMO
                Création d'un sommaire à partir des titres de l'article
                syntaxe {up toc}
                @author: LOMART @version: UP-1.7 @license: GNU/GPLv3 @credit: https://www.jqueryscript.net/layout/Highly-Configurable-jQuery-Table-of-Contents-Plugin-TocJS.html @tags: Editor
                • toc: inutilisé

                Style CSS

                • id: id genérée automatiquement par UP
                • class: classe(s) ajoutées au bloc principal
                • style: style inline ajouté au bloc principal
                • css-head (base-css): style ajouté au head de la page

                JS: définir le contenu analysé

                • content = [itemprop="articleBody"]: bloc analysé pour le sommaire
                • selector = h2,h3,h4,h5,h6: liste des selecteurs utilisés pour le sommaire
                • exclude = .notoc: liste sélecteur pour exclusion du sommaire

                JS: Mise en forme du sommaire

                • indexingFormats: format des index : nombres, lettres ou
                • maxlen: longueur maxi des titres du sommaire
                • heading: Titre du sommaire

                JS: Divers pour experts

                • elementClass = uptoc: class de la div navigation
                • rootUlClass = toc-ul-root: class pour le bloc contenant la liste
                • ulClass = toc-ul: class pour la liste
                • levelPrefixClass = toc-level-: (interne) préfixe des classes
                🆙 tooltip : des info-bulles au survol d'un élément DEMO
                syntaxe {up tooltip=texte info-bulle}texte{/up tooltip}
                @author: LOMART @version: UP-1.9.5 @license: GNU/GPLv3 @credit: sur un script de stefangabos @tags: Editor
                • tooltip: texte de la bulle. bbcode permis

                style et position de la bulle

                • model: une des classes principales définies dans up-model.scss
                • position = center: left, right
                • bottom (b,bas): vrai pour afficher la bulle au-dessous
                • width (l,largeur,w) = 250: largeur maxi de l'info-bulle
                • offset: décalage vertical de info-bulle. Négatif=vers le haut
                • opacity = 95: transparence de l'info-bulle
                • open: info-bulle affichée au chargement de la page

                Style CSS pour l'élément déclencheur

                • id: identifiant
                • class: classe(s) pour bloc
                • style: style inline pour bloc
                • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
                🆙 treeview : Affiche une liste sous forme d'un arbre (treeview) DEMO
                syntaxe {up treeview} liste UL/LI {/up treeview}
                @version: UP-2.5 @author: LOMART @license: GNU/GPLv3 @credit: script TreeViewJS de samarsault @tags: layout-dynamic
                • treeview: aucun argument

                icônes et ligne

                • icon-folder = arrow: image pour les dossiers (noeuds)
                • icon-file: image pour éléments feuilles
                • custom-icon: liste des icônes personnalisées pour création CSS inline
                • line: ligne devant les items. 1 (ligne par defaut) ou attributs pour border

                Ouverture automatique et délai

                • expand-all: 1 pour ouvrir tous les noeuds
                • expand: 1 pour ouvrir les noeuds de niveau 1
                • delay: durée ouverture noeuds en msec

                Boutons ouverture et fermeture

                • btn-open-selector: sélecteur du lien 'Tout déplier'
                • btn-close-selector: sélecteur du lien 'Tout déplier'

                Style CSS

                • id: identifiant
                • class: classe(s) pour bloc
                • style: style inline pour bloc
                • css-head (base-css): style ajouté dans le HEAD de la page
                🆙 tweeter_timeline : affiche la timeline Tweeter DEMO
                {up tweeter-timeline=}
                voir : dev.twitter.com/web/embedded-timelines/parameters
                @author: PMLECONTE @version: UP-1.3 @license: GNU/GPLv3 @tags: widget
                • tweeter_timeline: tweet id

                Paramétres pour API tweeter

                • theme: light ou dark
                • link-color: couleur des liens en hexa
                • border-color: couleur des bordures en hexa
                • height (h,hauteur) = 400: hauteur
                • width (l,largeur,w): largeur
                • tweet-limit: nombre maxi de tweet, sinon indéfini
                • chrome: noheader nofooter noborders transparent noscrollbar
                • lang = fr: code langage

                Style CSS

                • id: identifiant
                • style: classes et style inline bloc parent
                • class: classe bloc parent (obsolète)
                🆙 upactionslist : Liste des UP actions avec infos et paramètres DEMO
                {up upactionslist} toutes les actions
                {up upactionslist=action1, action2} une ou plusieurs actions
                {up upactionslist | md} fichier marknote
                {up upactionslist | csv} fichier CSV
                @version: UP-1.0 @author: Lomart @update: 2019-10-25 @license: GNU/GPLv3 @tags: UP

                  Sélection des actions listées

                  • upactionslist: liste des actions à récupérer. toutes par défaut
                  • exclude-prefix = _,x_: prefix des actions non listées. Separateur = comma
                  • without-custom: affiche les infos du dossier custom de l'action. 1 pour les masquer

                  Affichage du lien vers la démo

                  • demo = 1: afficher le lien vers la demo

                  Générer les fichiers JSON synonymes des noms utilisés par UP 'dico'

                  • make-dico: consolide le fichier principal dico.json avec ceux des actions

                  Création des fichiers documentation

                  • csv: fichier doc-actions.csv avec les options des actions
                  • comment: fichier 'comment-actions.csv' avec les infos des entêtes scripts pour analyse
                  • md: enregistre la documentation au format markdown dans plugins/content/up/doc-actions.md

                  Style CSS

                  • id: identifiant
                  • style: style ou class
                  • class: idem style
                  • filter: condition pour exécuter l'action
                  🆙 upbtn_makefile : Création des fichiers HTML pour le plugin editors-xtd DEMO
                  syntaxe {up upbtn_makefile}
                  @author: LOMART @version: UP-2.1 @license: GNU/GPLv3 @tags: UP

                    Sélection des actions listées

                    • upbtn_makefile: Vide pour toutes les actions, sinon liste des actions à inclure ou exclure (list-exclude=1).
                    • list-exclude: 0:uniquement les actions indiquées, 1: toutes sauf les actions indiquées
                    • without-custom: 1 sans les infos dans prefs.ini (v2.6)

                    mode d'affichage

                    • top10: liste des actions à dupliquer dans un groupe au début de la liste
                    • by-tags = 1: si 0, les actions sont dans l'ordre alpha sans notion de groupes (sauf top10)

                    Exportation des fichiers

                    • export-folder: sous-dossier de TMP pour sauver l'arborescence. ex : up-pref-foo
                    🆙 upprefset : Affiche la liste de tous les prefsets de UP pour le site DEMO
                    syntaxe {up upPrefSet}
                    @author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: UP

                      Sélection des actions

                      • upprefset: liste des actions ou vide pour toutes
                      • action-exclude: 1: toutes les actions sauf celles du paramétre principal
                      • prefset-exclude = icons,options: sections exclues

                      Format de la mise en page

                      • action-template = [h4]##action##[/h4]: présentation pour ##action##
                      • prefset-template = [b class="t-vertFonce"]##prefset##[/b] : [small]##options##[/small]: présentation pour ##prefset##
                      • info-template = [div class="bd-grey ph1"]##info##[/div]: présentation pour ##info##
                      • prefset-separator = [br]: séparateur entre items
                      • options-separator = [b class="t-vert"] | [/b]: les underscrores sont remplacés par des espaces

                      exportation des fichiers

                      • export-prefs: ou sous-dossier de TMP pour sauver l'arborescence. ex : up-pref-foo

                      Style CSS

                      • action-class: classes et style pour le bloc d'une action
                      • id: identifiant
                      • class: classe(s) pour bloc
                      • style: style inline pour bloc
                      • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
                      🆙 upscsscompiler : Compile tous les fichiers SCSS dans les dossiers des actions DEMO
                      syntaxe:
                      {up upscsscompiler} toutes les actions
                      {up upscsscompiler=action1, action2} une ou plusieurs actions
                      note: les fichiers SCSS & CSS sont en racine des dossiers actions
                      @author: LOMART @version: UP-1.2 @license: GNU/GPLv3 @credit: https://github.com/leafo/scssphp @tags: UP

                        Sélection des actions

                        • upscsscompiler: liste des actions à recompiler. toutes par défaut. 0 pour inactiver
                        • without-custom: sans prise en compte des personnalisations. Usage interne pour créer le zip de UP
                        • force: force la compilation de tous les SCSS. Par défaut: les SCSS plus récents que leur CSS.
                        • force-filter: oblige force si la condition est remplie

                        Divers

                        • mode = Compressed: Compressed, Compact, Crunched, Expanded, Nested
                        • info: affiche rapport compilation
                        • id: identifiant
                        🆙 upsearch : Recherche une action dans le contenu des articles et/ou modules (params) DEMO
                        syntaxe {up upsearch=action1,action2 | regex=... | module}
                        Mots-clés pour template
                        ##id## ##title## ##title-link## ##cat## ##date-crea## ##date-modif##
                        ##text## : résultat recherche
                        @version: UP-2.5 @author: Lomart @license: GNU/GPLv3 @tags: UP

                          Critères de recherche

                          • upsearch: liste des actions (ou synonyme) séparées par des virgules
                          • regex: motif de recherche dans le shortcode ou dans tout le contenu si shortcode vide
                          • cat: liste id des categories d'articles, séparateur:virgule. vide = toutes
                          • module: pour recherche dans le champ 'params'. vide = tous, partie du nom du module
                          • no-published (no_published): 1 recherche dans tous les articles archivé, non publié, a la corbeille

                          Mise en forme du résultat

                          • sort-by = title: tri pour article: title, ordering, created, modified, publish_up, id, ... ou text pour contenu recherche
                          • sort-order = asc: ordre de tri : asc, desc
                          • only-one: 1 : afficher un seul resultat par article
                          • maxlen: nombre de caractères maxi pour le resultat
                          • template (item-template) = [p]##id## ; ##title-link## ; "##text##"[/p]: modèle pour retour. titre article et texte trouve pour tableau
                          • date-format = %Y-%m-%d: format pour les dates
                          • target = _blank: pour le lien sur article

                          Style CSS

                          • id: identifiant
                          • class: classe(s) pour bloc
                          • style: style inline pour bloc
                          • css-head (base-css): style ajouté dans le HEAD de la page
                          🆙 website : Affiche un screenshot d'un site avec un lien. DEMO
                          syntaxe {up website=URL}
                          par defaut, le texte affiche sous la vignette est l'URL sans http://
                          @author: LOMART @version: UP-1.4 @license: GNU/GPLv3 @tags: Widget
                          • website: URL du site

                          Affichage du site

                          • link = 1: affiche le lien au-dessous du screenshot
                          • link-text: texte affiche pour le lien et alt
                          • target = _blank: ou _self pour ouvrir le site dans le même onglet

                          Fréquence actualisation

                          • renew = 30: nombre de jours pour actualiser les vignettes. 0 = jamais (v2.2)
                          • timeout = 15: delai pour recupérer les infos du serveur Google (v2.2)

                          Style CSS

                          • id: identifiant
                          • style: classes et style inline pour bloc
                          • class: classe(s) pour bloc (obsolete)
                          • css-head (base-css): règles CSS définies par le webmaster (ajout dans le head) v1.8
                          🆙 website_preview : Affiche une prévisualisation du site au survol d'un lien DEMO
                          syntaxe {up website-preview=CSS_selecteur}
                          @author: LOMART @version: UP-2.7 @license: GNU/GPLv3 @credit: script jQuery Mini Preview de lonekorean @tags: Widget
                          • website_preview = .com-content-article__body a: sélecteur CSS des liens à afficher
                          • mode = parenthover: mode chargement preview : parenthover, none, pageload
                          • width (l,largeur,w) = 256: largeur preview (px)
                          • height (h,hauteur) = 144: hauteur preview
                          • scale = .25: Echelle entre 0.1 et 1

                          Un shortcode est composé de :

                          • {up l'identifiant du plugin pour la recherche du shortcode dans les articles et modules.
                          • une suite d'option=argument séparés par des caractères pipes (AltGr+6).
                          • la première option est le nom de l'action
                          • une option sans argument est considérée comme égal à vrai ou 1. (0=faux)
                          • le shortcode peut être sur plusieurs lignes pour faciliter la lecture
                          • on peut saisir le nom des options sans se soucier de la case, ils sont évalués en minuscules.
                            De même les tirets du 6 seront remplacés par les underscores du 8
                          • le programmeur de l'action peut définir des alternatives pour le nom de l'action et des options.
                            Par exemple: saisir table-par-lignes renvoie vers le nom 'technique': table_by_rows
                          • } pour indiquer la fin du shortcode.

                          Le shortcode peut être en 2 parties entourant un contenu.

                          Exemple {up table-par-lignes} <table> ...</table> {/up table-par-lignes}

                          Il peut y avoir des shortcodes à l'intérieur du contenu pour indiquer des alternatives.

                          {if filter | admin} je suis un admin {=====} je ne suis pas un admin {/if filter}

                          Cela permet une saisie entièrement en wysiwyg

                          Vous pouvez aussi consulter l'articles : les options courantes

                          Les copier-coller des exemples de shortcodes sur ce site peuvent ne pas fonctionner. Dans ce cas, copier uniquement le contenu sans les accolades {}.