Annonce

[UP upactionslist]
make-dico : consolidation effectuée

UP Universal Plugin

UP le plugin Universel pour Joomla swiss knife

UP permet de réaliser de nombreuses actions dans les articles et modules personnalisés.

UP permet d'insérer des éléments comme une vidéo ou des prévisions météo, de modifier le comportement d'une table pour la rendre responsive, d'ajouter du code CSS/JS sans risque de suppression par les éditeurs wysiwyg.

A l'image du couteau suisse, UP très discret si on n'a pas besoin de lui (zéro octet sur la page), servira de chef d'orchestre pour lancer l'action demandée.
Seuls les fichiers nécessaires à cette action seront chargés par le navigateur client.

Universal Plugin permet de :

comparer deux images

des effets sur des images

Effet n° 82

aller sur la page d'accueil de perlimpinpin.fr

voir les détails d'une image

afficher le temps restant avant l'an 2030

jouer de l'accordéon

question n°1

texte pour la question n°1

question n°2

texte lorem pour la question n°2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vobis voluptatum perceptarum recordatio vitam beatam facit, et quidem corpore perceptarum. Non ego tecum iam ita iocabor, ut isdem his de rebus, cum L. Sit enim idem caecus, debilis. Facillimum id quidem est, inquam. Nec vero alia sunt quaerenda contra Carneadeam illam sententiam.

Et ais, si una littera commota sit, fore tota ut labet disciplina. Duo Reges: constructio interrete. Etenim semper illud extra est, quod arte comprehenditur. Ergo, si semel tristior effectus est, hilara vita amissa est? Primum in nostrane potestate est, quid meminerimus? Ergo illi intellegunt quid Epicurus dicat, ego non intellego? Graccho, eius fere, aequalí? Utilitatis causa amicitia est quaesita. Si verbum sequimur, primum longius verbum praepositum quam bonum. Quid autem habent admirationis, cum prope accesseris?

Ex eorum enim scriptis et institutis cum omnis doctrina liberalis, omnis historia. Nam diligi et carum esse iucundum est propterea, quia tutiorem vitam et voluptatem pleniorem efficit. Sed ea mala virtuti magnitudine obruebantur. Qua tu etiam inprudens utebare non numquam. -delector enim, quamquam te non possum, ut ais, corrumpere, delector, inquam, et familia vestra et nomine. Ergo, inquit, tibi Q. Sed non sunt in eo genere tantae commoditates corporis tamque productae temporibus tamque multae. Illi enim inter se dissentiunt. Tum ille: Ain tandem? Quis istud possit, inquit, negare?

Item de contrariis, a quibus ad genera formasque generum venerunt. Atqui pugnantibus et contrariis studiis consiliisque semper utens nihil quieti videre, nihil tranquilli potest. Quae cum essent dicta, finem fecimus et ambulandi et disputandi. Sed quid ages tandem, si utilitas ab amicitia, ut fit saepe, defecerit? Nam ante Aristippus, et ille melius. Ergo, si semel tristior effectus est, hilara vita amissa est?

question n°3

texte pour la question n°3

afficher et/ou télécharger un fichier

Ouvrir une photo dans une nouvelle fenêtre

Télécharger une photo

afficher selon conditions

Vive le weekend

du texte défilant

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quasi vero, inquit, perpetua oratio rhetorum solum, non etiam philosophorum sit. Facit enim ille duo seiuncta ultima bonorum, quae ut essent vera, coniungi debuerunt;

Similiter sensus, cum accessit ad naturam, tuetur illam quidem, sed etiam se tuetur; Sit, inquam, tam facilis, quam vultis, comparatio voluptatis, quid de dolore dicemus? Nam memini etiam quae nolo, oblivisci non possum quae volo. Uterque enim summo bono fruitur, id est voluptate. Quis enim potest ea, quae probabilia videantur ei, non probare? Post enim Chrysippum eum non sane est disputatum. Eadem fortitudinis ratio reperietur. Cuius similitudine perspecta in formarum specie ac dignitate transitum est ad honestatem dictorum atque factorum.

Num quid tale Democritus? Igitur neque stultorum quisquam beatus neque sapientium non beatus. Si stante, hoc natura videlicet vult, salvam esse se, quod concedimus; Consequens enim est et post oritur, ut dixi. Piso igitur hoc modo, vir optimus tuique, ut scis, amantissimus. Immo alio genere;

Hoc simile tandem est? Quod si ita se habeat, non possit beatam praestare vitam sapientia. Duo Reges: constructio interrete. Nondum autem explanatum satis, erat, quid maxime natura vellet. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Ergo adhuc, quantum equidem intellego, causa non videtur fuisse mutandi nominis.

afficher une carte OpenStreetMp

exécuter du code php

Bonjour, nous sommes le : 31-05-2020 07:40:50

Dans 3 mois, nous serons le : 31/08/2020

afficher du contenu masqué

... le contenu masqué ...

Cliquer pour voir les explications c'est bon, j'ai compris

un diaporama d'images

des onglets

question n°1
question n°2
question n°3

texte pour la question n°1

texte pour la question n°2 mais un peu plus long

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Haec dicuntur inconstantissime. Et nunc quidem quod eam tuetur, ut de vite potissimum loquar, est id extrinsecus; Luxuriam non reprehendit, modo sit vacua infinita cupiditate et timore. Apud imperitos tum illa dicta sunt, aliquid etiam coronae datum; Cum autem in quo sapienter dicimus, id a primo rectissime dicitur. Duo Reges: constructio interrete. Equidem, sed audistine modo de Carneade? Atqui reperies, inquit, in hoc quidem pertinacem; An hoc usque quaque, aliter in vita?

Non enim, si omnia non sequebatur, idcirco non erat ortus illinc. Mihi, inquam, qui te id ipsum rogavi? Re mihi non aeque satisfacit, et quidem locis pluribus. Ratio quidem vestra sic cogit.

Beatus sibi videtur esse moriens. Vos autem cum perspicuis dubia debeatis illustrare, dubiis perspicua conamini tollere. Ita nemo beato beatior. Habent enim et bene longam et satis litigiosam disputationem.

Animi enim quoque dolores percipiet omnibus partibus maiores quam corporis. Cur deinde Metrodori liberos commendas? Bona autem corporis huic sunt, quod posterius posui, similiora. Praeteritis, inquit, gaudeo. Inquit, dasne adolescenti veniam? Progredientibus autem aetatibus sensim tardeve potius quasi nosmet ipsos cognoscimus.

3 :

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Idem etiam dolorem saepe perpetiuntur, ne, si id non faciant, incidant in maiorem. Cur igitur easdem res, inquam, Peripateticis dicentibus verbum nullum est, quod non intellegatur? Sed quid ages tandem, si utilitas ab amicitia, ut fit saepe, defecerit? Sin te auctoritas commovebat, nobisne omnibus et Platoni ipsi nescio quem illum anteponebas? Quod cum accidisset ut alter alterum necopinato videremus, surrexit statim. Sin aliud quid voles, postea. At, si voluptas esset bonum, desideraret.

Quorum sine causa fieri nihil putandum est. Non igitur potestis voluptate omnia dirigentes aut tueri aut retinere virtutem. Hinc ceteri particulas arripere conati suam quisque videro voluit afferre sententiam. Si verbum sequimur, primum longius verbum praepositum quam bonum.

Duo Reges: constructio interrete. Odium autem et invidiam facile vitabis. Atqui reperies, inquit, in hoc quidem pertinacem; Aliud igitur esse censet gaudere, aliud non dolere.

une vidéo locale

et beaucoup d'autres choses, bidules, trucs ....

➠ 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
v1.8 : ajout option filter
v1.9.5 : si parent & selector=body, on crée une référence à l'emplacement du shortcode
author LOMART version 1.0 license GNU/GPLv3
addclass: nom de la classe ajoutée à la balise
filter: conditions. Voir doc action filter (v1.8)
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, ...
css-head (base-css): code CSS pour head. Attention utiliser [] au lieu de {}

➠ 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}
author LOMART version 1.0 license GNU/GPLv3
addcodehead: code à ajouter dans le head ou balise
xxx = yyy: couple attribut-valeur. ex: title=le titre, href=//google.fr
filter: conditions. Voir doc action filter (v1.8)

➠ 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=chemin_fichier_css}
Utilisation : charger un fichier CSS spécifique à une page
author LOMART version 1.0 license GNU/GPLv3
addcsshead: code CSS. ATTENTION [ ] à la place des {}
filter: conditions. Voir doc action filter (v1.8)

➠ addscript : ajoute du code ou un fichier JS ou JQuery ➠ DEMO

Par défaut, le code est ajouté dans le head.
Si le paramètrre 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 1.0 license GNU/GPLv3
addscript = head: ou body pour insérer le code à la position du shortcode
jquery = 0: 1: entoure avec appel jquery (sauf fichier)
filter: conditions. Voir doc action filter (v1.8)

➠ 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}
animation :
fade-up, fade-down, fade-right, fade-left, fade-up-right, fade-up-left, fade-down-right, fade-down-left,
flip-left, flip-right, flip-up, flip-down,
zoom-in, zoom-in-up, zoom-in-down, zoom-in-left, zoom-in-right, zoom-out, zoom-out-up, zoom-out-down, zoom-out-right, zoom-out-left
easing :
linear, ease, ease-in, ease-out, ease-in-out, ease-in-back, ease-out-back, ease-in-out-back, ease-in-sine,
ease-out-sine, ease-in-out-sine, ease-in-quad, ease-out-quad, ease-in-out-quad, ease-in-cubic, ease-out-cubic,
ease-in-out-cubic, ease-in-quart, ease-out-quart, ease-in-out-quart
anchor-placement:
top-bottom, center-bottom, bottom-bottom, top-center, bottom-center, center-center, top-top, bottom-top
author Conseilgouz version v1.2 - 11/2019 license GNU/GPLv3 credit Script de michalsnik
anim_aos = zoom-in-right: nom de l'animation
delay: delai 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
style: style inline appliqué au bloc
class: classe(s) appliquée(s) au bloc
css-before: style de l'élément avant l'animation
css-after: style de l'élément après l'animation

➠ article_category : liste des articles d'une ou plusieurs catégories ➠ DEMO

syntaxe : {up article_category=id_catégorie(s)}
Une action très pratique pour lister les articles de la catégorie en cours, il suffit de taper {up article-category}
author LOMART version 1.0 license GNU/GPLv3
article_category: ID catégorie(s) (séparateur virgule) ou vide pour celle de l'article actuel
maxi: Nombre maxi d'article dans la liste
no_published = 1: Liste aussi les articles non publiés
sort_by = title: tri: title, ordering, created, modified, publish_up, id, hits
sort_order = asc: ordre de tri : asc, desc
author: filtre sur auteur: liste des id ou article, current
style: classes et styles inline pour bloc principal
title (titre): titre HTML si article trouvé.
title-tag = h3: niveau du titre
title-style: classes et styles inline pour le titre
list-style: classes et styles inline pour la liste
class: classe(s) pour bloc principal
title-class: classe(s) pour le titre
list-class: classe(s) pour la liste

➠ barcode : Genere des codes a barres ➠ DEMO

syntaxe {up barcode= | format=... [|format= html/svg/png]}
type : 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, PHARMA2T
format : format de sortie html/svg/png
remarque : png ne fonctionne que si GD ou IMAGICK actif.
De plus, la couleur est au format RGB, par exemple 0,0,0 = noir
https://tcpdf.org/
author ConseilGouz version 1.3 license GNU/GPLv3
barcode = text: valeur alphanumérique
type = EAN13: type de code a barres
format = html: format de sortie
height (h,hauteur) = 30: hauteur du code barre
width (l,largeur,w) = 1: espacement du code barre
color = #000000: couleur impérativement sous la forme '#rrggbb'
align = center: alignement code barres et texte (left, center, right)
showtext = 1: montrer le texte ayant permis de generer le code barres
class: classe(s) pour bloc
style: style inline pour bloc
css-head (base-css): regles CSS definies par le webmaster (ajout dans le 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 1.8 (15/03/2020) license GNU/GPLv3
bbcode:
tags: balises à traiter. vide: par défaut, liste (a,b,p) ou balise en plus de defaut (+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 1.0 license GNU/GPLv3 credit Vegas de jaysalvat
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
bg-selector = body: sélecteur du bloc pour image(s) de fond
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é en overlay
page-selector: si block 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
center: centrage vertical du contenu entre shortcodes
filter: conditions. Voir doc action filter (v1.8)
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 1.0 license GNU/GPLv3 credit Vegas de jaysalvat
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
bg-selector = body: bloc portant le slideshow
bg-overlay: calque superposé à l'image de fond (png, opacité, RGBA, CSS)
bg-color: couleur sous image
page-selector: bloc sur contenu
page-overlay: background de page-selector (png, opacité, RGBA, CSS)
center = 1: centrage vertical du contenu entre shortcodes
filter: conditions. Voir doc action filter (v1.8)
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
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}
fond autre bloc : {up bg-video=fichier video | bg-selector=#foo}content{/up bg-video}
author LOMART version 1.0 license GNU/GPLv3 credit Script videoBackground de lemehovskiy
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é
bg-selector = body: bloc portant le slideshow
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
page-selector: bloc sur contenu
page-overlay: background de page-selector (png, opacité, RGBA, CSS)
center: style et classe pour centrage vertical du contenu entre shortcodes
filter: conditions. Voir doc action filter (v1.8)
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)

➠ box : affiche une boite avec un tite, sous-titre, image, contenu et action ➠ DEMO

syntaxe: {up box=model | title=title}contenu HTML{/up box}
author LOMART update 2020-05-15 version v2.0 license GNU/GPLv3
box: model [danger, info] ou prefset
template = ##head## ##title-link## ##subtitle## ##image## ##/head## ##content## ##action-link##:
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
class: classe(s) pour la box
style: style inline pour la box
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: 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. 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: 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: lien. . Si vide et demandé : on prend le premier lien sur title ou image
link-target: _blank pour nouvelle fenetre
head-class: class pour le bloc entete. en général title, subtitle, image
head-style: style pour le bloc entete
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
css-head (base-css): style CSS inséré dans le HEAD
align-vertical = fg-vspace-between-1: type de repartition verticale en multibox

➠ 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
demo up.lomart.fr author Lomart version 1.0 - 08/2017 license GNU/GPLv3
cell = 12: nombre de colonnes
mobile: nombre de colonnes sur petit écran
tablet: nombre de colonnes sur moyen écran
filter: conditions. Voir doc action filter (v1.8)
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

➠ 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 1.0 license GNU/GPLv3
center: classe(s) et style(s) pour le bloc interne (celui qui est centré)
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)

➠ chart : Graphiques statistiques avec GoogleChart ➠ DEMO

syntaxe {up chart=type_chart}... data ...{/up chart}
author LOMART version 1.0 license GNU/GPLv3 credit https://developers.google.com/chart/interactive/docs
chart: type de chart : area, bar,bubble,column,combo,line,pie,scatter,SteppedArea
typeChart: option de substitution si saisie prefset
separator:
vertical = 0: horizontal par défaut ou vertical
area: valeur en % dans l'ordre : left, top, width, height. EX: 10,25,90,75
maximized = 0: affichage remplit le bloc
colors: liste des couleurs
title (titre):
title-position: in, out, none (defaut)
title-style: color: 'blue', fontsize: '14px', bold:true (attention à la syntaxe)
legend-position: in, none (defaut), top, bottom
legend-style: ex: color:'blue',fontSize:14,bold:true
bar-width: largeur des barres en %
3D = 0: camembert en relief
donut = 0: part du trou central. ex: 0.5 pour la moitié
isstacked: 0, true (absolute) ou relative
height (h,hauteur): min-height bloc parent
options: chaine JSON des options (remplacer {} par [])
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 1.0 license GNU/GPLv3 credit script jClocksGMT de mcmastermind
clocks_gmt: Nom de la ville (pour légende)
class: classe(s) ajoutées au bloc principal
style: style inline ajouté au bloc principal
label-style: style pour le nom ville
digital-style: style horloge digitale
date-style: style date
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)
offset = 0: GMT offset
title (titre) = Greenwich, England: titre
skin = 1: indice images
dst = 1: gestion heure d'été
analog = 1: afficher horloge analogique
digital = 1: afficher horloge digitale
timeformat = HH:mm:
date = 0: afficher la date
dateformat = MM/DD/YYYY:
imgpath: chemin vers les images

➠ 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 1.0 license GNU/GPLv3
corner: texte affiché dans le coin ou ruban
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
filter: chaine de conditions. Voir documentation filter
shadow = 0: ajoute une ombre 'orientée' au corner. La valeur indiquée est la force de l'ombre
color = white: couleur du texte
bgcolor = red: couleur de fond du coin
class: classes pour le coin
style: style CSS pour le coin
url: lien
target = _blank: ou _self pour ouvrir le site dans le même onglet
bloc-class: classe(s) pour bloc
bloc-style: style inline pour bloc
css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

➠ 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 v1.0 - 20/07/2017 license GNU/GPLv3 credit Lexxus - jq-timeTo
countdown: date, nombre de secondes ou vide pour horloge
align: left, center ou right
class: classe
style: style inline
callback: Fonction appellée à la fin du compte à rebours
captionSize = 0: fontsize legendes
countdown = true: false = horloge, true = countdown
countdownAlertLimit = 10: alerte en seconde avant fin countdown
displayCaptions = false: true = légendes affichées
displayDays = 0: 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 = 0: Temps initial en secondes pour le compte à rebours
start = true: démarrer automatiquement la minuterie
theme = white: black ou blue
timeTo: date, nb secondes ou vide pour horloge

➠ counter : Ajoute un compteur avec prefix et suffix ➠ DEMO

Syntaxe : {up counter=0,100}
author LOMART version 1.0 license GNU/GPLv3 inspired jquery-simple-counter de marcovincit
counter: min,max : valeurs de départ et de fin
filter: conditions. Voir doc action filter (v1.8)
class: classe(s) pour bloc
style: style inline pour bloc
width (l,largeur,w) = 0: largeur minimal (par défaut en pixels)
mono = 1: force la police en monospace
css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
start = 0: 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. HTML autorisé
suffix: texte après compteur. HTML 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 1.0 license GNU/GPLv3
csv2def: chemin vers fichier à afficher
separator = ;: separateur des colonnes (fichier uniquement)
HTML = 0: pour fichier (contenu CSV): 0=affiche le rendu, 1=affiche le code ou liste des tags conserves (strip_tags)
model = stack: empile par defaut, sinon nom de la classe principale : flex. Voir csv2def.css
class: classe(s) pour la balise DL
style: style inline pour la balise DL
term-class: classe(s) pour le bloc des termes
term-style: style pour le bloc des termes
term-style-separator: style pour separer les differents termes
def-class: classe(s) pour le bloc des definitions
def-style: style pour le bloc des definitions
def-style-separator: style pour separer les differentes definitions
css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)
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

➠ 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 1.0 license GNU/GPLv3
csv2list: chemin vers fichier à afficher
separator = ;: separateur 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 modele dans le fichier csv2list.css
leaders = 0: points de conduite
leaders-color: couleur points de conduite
class: classe(s) pour la balise UL
style: style inline pour la balise UL
col-style-*: style inline pour les nièmes balise SPAN
list-style: code hexadecimal et couleur du caractère (bb,red ou 26BD,#F00)
bgcolor: couleur de fond. #FFF par defaut
header = 0: 0: pas de titre, 1: premiere ligne contenu, titre colonne
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
footer = 0: 0: pas de pied, 1: derniere ligne contenu, pied colonne
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
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 1.0 license GNU/GPLv3
csv2table: URL ou chemin et nom d'un fichier local
separator = ;: separateur des colonnes
HTML = 0: 0= aucun traitement, 1=affiche le code, ou liste des tags a garder (strip_tags)
model: nom de la classe modele dans le fichier csv2table.css
class: classe(s) pour la table
style: style inline pour la table
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
color-contrast: couleur des lignes impaires. la couleur des lignes paires est à définir dans class ou style
header = 0: 0: pas de titre, 1: premiere ligne contenu, titre colonne
header-class: classe(s) pour la balise thead
header-style: style pour la balise thead
footer = 0: 0: pas de pied, 1: derniere ligne contenu, pied colonne
footer-class: classe(s) pour la balise tfoot
footer-style: style pour la balise tfoot
css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

➠ facebook_timeline : affiche la timeline Facebook ➠ DEMO

{up facebook=facebook id}
voir https://developers.facebook.com/docs/plugins/page-plugin
author PMLECONTE version v1.1 du 28/05/2018 license GNU/GPLv3
facebook_timeline: ID facebook. Voir https://findmyfbid.com
class: classe bloc parent
style: style inline bloc parent
tabs = timeline: Onglets à afficher, par exemple : timeline, events, messages
adaptwidth = 1: Essayer d’adapter la largeur au conteneur.
facepile = 1: Affiche les photos de profils quand des amis aiment le contenu.
hidecover = 0: Masque la photo de couverture dans l’en-tête
smallheader = 0: Utiliser un en-tête réduit
width (l,largeur,w) = 500: La largeur du plugin en pixels. Valeur mini = 180, maxi = 500
height (h,hauteur) = 500: La hauteur du plugin en pixels. valeur mini = 70.

➠ faq : accordion très simple ➠ DEMO

syntaxe : une alternance de titres pour les onglet en H4 et de contenu HTML
{up faq}
-- titre en H4
-- contenu HTML
{/up faq}
author lomart version v1.0 - 15/07/2017 license GNU/GPLv3 credit ryans temkoski
faq: rien
title-tag = h4: pour utiliser une autre balise pour les titres
title-class: classe pour le titre (onglet)
title-style: style inline pour le titre
title-icon: TODO
content-class: classe pour le contenu
content-style: style inline pour le contenu

➠ 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 date 2017-12-04 version 1.0 license GNU/GPLv3
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, ...
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 1.0 license GNU/GPLv3
file_download: fichier ou dossier
extensions = zip, pdf,txt,md,png,jpg,gif,svg,doc,docx,xls,xlsx,odt,ods: extensions autorisées
sort-by = name: TODO ou date-desc
template = ##icon## ##filename-link## (##size## - ##date##) [small]##hit## ##lastdownload##[/small] [br]##info##: modèle de mise en page. keywords + bbcode
main-tag = 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
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'icone devant le lien ou taille de l'icone selon extension du fichier (16 ou 32)
password: mot de passe pour télécharger le fichier
format-date = lang[en=m/d/Y H:i;fr=d/m/Y H:i]: 'd/m/Y H:i'
model-hit = téléchargé %s fois:
model-lastdownload = dernier téléchargement le %s:
model-info = %s:
class: classe(s) pour bloc
style: style inline pour bloc
filter:
css-head (base-css): règles CSS définies par le webmaster (ajout dans le head)

➠ 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 1.0 license GNU/GPLv3
file_view: chemin et nom du fichier
HTML = 0: 0= aucun traitement, 1=affiche le code, ou liste des tags a garder (ex: img,a)
EOL = 0: forcer un retour à la ligne
block (bloc) = 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)

➠ filter : affiche du contenu si toutes les conditions sont remplies ➠ DEMO

Reprise du plugin LM-Filter de Lomart
{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)
{up filter | admin} contenu si vrai {====} contenu si faux {/up filter}
--> affiche si admin connecté. admin=0 affiche si admin NON connecté
author Lomart version 1.0 license GNU/GPL
filter: aucun argument prévu
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 langages autorisé. 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

➠ flexauto : une grille responsive sur plusieurs colonnes ➠ DEMO

syntaxe :
{up flexauto=x}contenu{/up flexauto}
x=1 à 12 est le nombre de colonnes sur grand écran.
author Lomart version 1.0 - juillet 2017 license GNU/GPLv3
flexauto = 3: nombre de colonnes sur grand écran
tablet = 2: nombre de colonnes sur moyen écran
mobile = 1: nombre de colonnes sur petit écran
class: classe(s) ajoutée(s) au bloc parent
style: style inline ajouté au bloc parent
bloc-style: style inline ajoutée(s) au bloc enfant
css-head (base-css):

➠ 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 : col=4-8 ou col=33-66 pour 2 colonnes (équivalent: span4 et span8)
demo up.lomart.fr/css author Lomart version 1.0 - 08/2017 license GNU/GPLv3
flexbox: nombre de colonnes ou prefset
mobile: nombre de colonnes sur petit écran
tablet: nombre de colonnes sur moyen écran
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: style inline ajoutée(s) au bloc enfant
css-head (base-css):

➠ 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 1.0 license GNU/GPLv3
form_select = url: mot-clé (url, url-blank) ou argument pour onchange ou prefset
file: fichier CSV pour contenu
separator = ;: separateur des colonnes
no-content-html = en=content not found : %s;fr=contenu non trouvé : %s: message erreur. %s:nom fichier
style: classes et styles
css-head (base-css):

➠ 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 1.0 - Juillet 2017 license GNU/GPLv3
gmap (googlemap): adresse postale
width (l,largeur,w) = 100%: largeur de la carte
height (h,hauteur) = 300px: hauteur de la carte
class: classe
style: style-inline

➠ 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}
...
author LOMART version 1.0 (17/08/17) license GNU/GPLv3
googlefont: nom police
size: ajout font-size et line-height
family: famille de substitution (cursive, fantasy)
tag = span: balise HTML pour entourer le contenu
className: nom de la classe pour utiliser la police
css-head (base-css): complément de css: color, font-size, ....

➠ 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 v1.0 license GNU/GPLv3
hr: nom icone, code unicode, chemin image ou nom dans prefs.ini + color, size
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
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 = #fff: 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 = 0: 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
icon-class' : classe pour l'icône ou le texte IMPOSSIBLE 'fontname = icomoon: pour icomoon ou FontAwesome ou autres (a mettre dans pref.ini)

➠ html : permet de créer une entité HTML (balise) avec classe(s), style et attribut sans passer en mode code ➠ DEMO

exemples :
{up html=div | class=foo | id=x123}contenu{/up html}
--> < div id="x123" class="foo">contenu< /div>
{up html=img | class=foo | src=images/img.jpg}
--> < img class="foo" src="/images/img.jpg" >
note: toutes les options sont considérées comme des attributs de la balise
author LOMART 2017-08 license GNU/GPLv3
html = div: balise html
class: classe(s)
style: style inline
xxx = yyy: couple attribut-valeur. ex: title=le titre, href=//google.fr

➠ icon : uniformise l'appel des icons. Evite de passer en mode code pour la saisie ➠ DEMO

syntaxe : {up icon=nom_icone}
Important : indiquer dans prefs.ini le préfixe pour la police d'icones installée sur le site
author Lomart version v1.0 license GNU/GPLv3
icon: jeu d'options ou src color size
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)
src: nom icone, code unicode, chemin image (indispensable si prefset)
size: taille icone en px, em (px par defaut) - coté du carré dans lequel est inscrit l'image
color: couleur
color-hover: couleur lors survol icone (sauf image et unicode coloré)
style: style inline
class: classe
selector: retour sous forme propriétés CSS pour ce selecteur
info = 0: 1 affiche la liste des icons définies dans prefs.ini comme un message debug, 2 la retourne pour affichage à la place du shortcode

➠ iframe : introduire un iFrame responsive dans un article ➠ DEMO

syntaxe {up iframe=URL}
author LOMART version 1.0 license GNU/GPLv3 credit css : https://css-tricks.com/snippets/sass/maintain-aspect-ratio-mixin/
iframe: URL site distant
allowfullscreen = allowfullscreen: autorise le plein ecran
scrolling = no: affiche les ascenceurs 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)
preview: image affichée avant chargement de l'iframe
class: classe(s) pour bloc externe
style: style inline pour bloc externe
iframe-class: classe(s) pour bloc - utilisation interne
iframe-style: style inline pour bloc - utilisation interne
css-head (base-css): style ajouté dans le HEAD de la page

➠ 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 1.0 - Juillet 2017 license GNU/GPLv3 credit script de Sylvain Combes
image_compare:
class: classe bloc
style: style inline bloc
initVisibleRatio = 0.2: position initiale
interactionMode = drag: mode: drag, mousemove, click
addSeparator = true: ajoute séparateur (ligne verticale)
addDragHandle = true: ajoute poignee sur séparateur
animationDuration = 450: Duree animation en ms
animationEasing = linear: animation: linear, swing
precision = 2: Precision rapport, nb decimales

➠ image_gallery : Affiche une ou plusieurs images dans une lightbox ➠ DEMO

avec adaptation de la taille image au device et legendes
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}
syntaxe 4 {up image-gallery=chemin_dossier | dir }
author LOMART version 1.0 license GNU/GPLv3 credit jqPhotoSwipe de Ergec - photoswipe.com - Masonry - Shuffle.js
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 = 0: nombre de vignette 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
legend: label pour image unique
legend-type = 2: 0:aucune, 1:hover-top, 2:hover-bottom, 3:sous l'image
class: classe(s) pour bloc principal
style: style inline pour bloc principal
img-class: classe(s) pour bloc figure avec image et legende
img-style: style inline pour bloc avec image et legende
legend-class: classe(s) pour la légende vignette
legend-style: style pour la légende vignette
img-sizes: largeur image en pourcentage de wmax-page en mode desktop, tablette et mobile. 100,100,100 par defaut
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 desactiver. Multiplié par pixel-ratio
pixel-ratio = 0: 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 inferieure a 80%, la plus petite n'est pas cree
bp-tablet = 768: point de rupture tablette
bp-mobile = 480: point de rupture smartphone
random: affichage random en mode shuffle
search: shuffle search
shuffle-reverse: shuffle : ordre inverse des boutons
css-head (base-css): style CSS inséré dans le HEAD

➠ image_hover : affiche une image avec un contenu HTML avec effets lors du survol ➠ DEMO

{up imagehover=images/image.jpg | effect=xx}
-- contenu HTML affiché au survol
{/up imagehover}
Voir la démo pour les numéros des effets
author Lomart version 1.0 - juillet 2017 license GNU/GPLv3 credit Sanjay Jadon
image_hover: nom de l'image
effect = 11: nom de l'effet à trouver sur le site démo
class: classe pour bloc externe (deprecated)
style: style inline pour bloc externe
img-class: classe pour image (deprecated)
img-style: style inline pour image
text-class: classe pour bloc texte lors survol (deprecated)
text-style: style inline pour bloc texte lors survol
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 1.0 license GNU/GPLv3
image_logo: prefset,image_logo ou texte
pos = right,bottom: position horizontale, verticale
width (l,largeur,w): largeur logo. % si pas d'unité
class: classe(s) pour bloc
style: style inline pour bloc
main-class: classe(s) pour le bloc du contenu
main-style: style inline pour le bloc du contenu
css-head (base-css): style ajouté dans le HEAD de la page

➠ image_magnify : affiche un effet de loupe sur une image ➠ DEMO

syntaxe {up image-magnify=image | imgzoom=image-pour-zoom}
author LOMART version 1.0 license GNU/GPLv3 credit thdoan
image_magnify: fichier image normale
imgzoom: fichier image utilisé pour le zoom. si vide: image principale
size: diametre de la loupe en pixel
radius: diametre de la loupe en pixel
border: modele de bordure pour la loupe
class: classe(s) ajoutées au bloc principal
style: style inline ajouté au bloc principal

➠ image_pannellum : Affiche un panorama 3D à partir d'une image equirectangular ➠ DEMO

syntaxe {up image_pannellum=chemin_image_equirectangular}
author LOMART version 1.0 license GNU/GPLv3 credit script pannellum de Matthew Petroff.
image_pannellum: chemin de l'image
height (h,hauteur) = 400px: hauteur en px ou vh
width (l,largeur,w) = 100%: largeur en px ou %
options: liste des options supplémentaires . ex: showZoomCtrl:true,compass:true - Attention au min/maj. voir cette page
language: liste motclé (bylineLabel,loadButtonLabel,loadingLabel) + traduction. Exemple:bylineLabel:lang[en=by %s;fr:par %s], loadingLabel:Loading...
fullscreen = 0: 1 pour autoriser la vue plein écran
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)
panorama: chemin image (il est rempli automatiquement)
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 = false: chargement auto de l'image
autoRotate = 0: rotation nombre de degres 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 ecran
hotSpotDebug = false: 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: {up image-random=folder}
author LOMART version 1.0 license GNU/GPLv3
image_random: dossier des images ou vide
target = _blank: ouverture des liens sauf pour blocs HTML
class: classe(s) pour l'image ou le bloc HTML
style: style inline pour l'image ou le bloc HTML
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 1.0 license GNU/GPLv3
image_rollover: image repos
hover: image au survol
click: image lors clic
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 1.0 (10-03-2020) license GNU/GPLv3
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 bande
alt: texte alternatif pour image
quality = 80:
reset = 0: force la génération des images strip
delete-source = 0: supprime l'image source après génération des strips
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="">;
< 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 1.0 du 10-12-17 license GNU/GPLv3 credit script RWD Image Maps de stowball
imagemap: le chemin et nom de l'image
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 1.0 license GNU/GPLv3
jcat_image: dossier/chemin/url vers une image si la catégorie n'en possède pas
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## ##intro-text## ##intro-text,100## ##content##
##image## ##image-link## ##image-src## ##image-alt##
##date-crea## ##date-modif## ##new## ##count## ##hits## ##tags-list##
author LOMART version 1.0 license GNU/GPLv3
jcategories_by_tags: ID ou nom du tag
maxi: Nombre maxi d'article dans la liste
no-published (no_published) = 0: 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
template: modèle de mise en page. Si vide le modèle est le contenu
main-tag = 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)
item-tag = div: balise pour le bloc englobant tous les articles. 0 pour aucun
item-style: classes et styles inline pour bloc principal
item-class: classe(s) pour bloc principal (obsoléte)
image-src: lorempixel.com/150/150', // image par défaut
image-alt = news: image, texte alternatif par défaut
date-format = %e %B %Y: format pour les dates
date-locale: format 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
no-content-html = [p]aucune catégorie pour ce mot-clé[/p]: retour si aucune catégorie trouvée
css-head (base-css):

➠ 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##
https://docs.joomla.org/Categories_and_CategoryNodes_API_Guide
author LOMART version 1.0 license GNU/GPLv3
jcategories_list: id catégorie ou vide pour toutes
component = Content: nom extension
level: nombre de niveaux. O = tous
main-tag = ul:
item-tag = li:
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]:
style: classes et styles
css-head (base-css):

➠ jcontent_by_categories (jnews) : liste des articles d'une catégorie ➠ DEMO

syntaxe : {up jcontent-by-categories=id-catégorie(s)}
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## ##new## ##featured## ##hits## ##tags-list##
author LOMART version 1.0 license GNU/GPLv3
jcontent_by_categories (jnews): ID(s) catégorie(s) séparé avec virgule, vide pour celle de l'article actuel ou 0 pour toutes
maxi: Nombre maxi d'article dans la liste. Vide = tous
exclude: liste des id des catégories non reprises si option principale=0
current = 0: 1 pour inclure l'article en cours
no-published (no_published) = 1: Liste aussi les articles non publiés
sort-by = publish_up: tri: title, ordering, created, modified, publish_up, id, hits
sort-order = desc: ordre de tri : asc, desc
author: filtre sur auteur: liste des id ou article, current
template: modèle de mise en page. Si vide le modèle est le contenu
main-tag = 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)
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)
date-format = %e %B %Y: format pour les dates
date-locale: format 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
no-content-html = Pas de nouvelles, bonnes nouvelles ...[br]No news, good news ...: texte si aucune correspondance. 0=aucun texte
image-src: lorempixel.com/300/300', // image par défaut
image-alt = news: image, texte alternatif par défaut
tags-list-prefix: texte avant les autres eventuels 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
css-head (base-css): code CSS dans le head

➠ jcontent_by_tags : liste des catégories d'un mot-clé (tag) ➠ DEMO

syntaxe : {up jcategories-by-tags=id-ou-nom-tag}
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##
author LOMART version 1.0 license GNU/GPLv3
jcontent_by_tags: ID ou nom du tag
maxi: Nombre maxi d'articles dans la liste
no-published (no_published) = 0: 1 pour obtenir les catégories non publiées
sort-by = title: tri: title, rgt, created, modified, id, hits
sort-order = asc: ordre de tri : asc, desc
template: modèle de mise en page. Si vide le modèle est le contenu
main-tag = 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)
item-tag = div: balise pour le bloc englobant tous les articles. 0 pour aucun
item-style: classes et styles inline pour bloc principal
item-class: classe(s) pour bloc principal (obsoléte)
image-src: lorempixel.com/150/150', // image par défaut
image-alt = news: image, texte alternatif par défaut
date-format = %e %B %Y: format pour les dates
date-locale: format 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
no-content-html = aucune catégorie pour ce mot-clé: retour si aucune catégorie trouvée
css-head (base-css):

➠ 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 1.0 license GNU/GPLv3
jcontent_in_content: ID de l'article
no-published (no_published) = 1: Liste aussi les articles non publiés
template = ##content##: modèle de mise en page. Si vide le modèle est le contenu. BBCode accepté
main-tag = div: balise pour le bloc d'un article. 0 pour aucun
main-style: classes et styles inline pour un article
main-class: classe(s) pour un article (obsoléte)
date-format = %e %B %Y: format pour les dates
date-locale: format pour les dates. Par défaut, celle du navigateur client.
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 article-category}
author LOMART version 1.0 license GNU/GPLv3
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
sort-by = title: tri: title, ordering, created, modified, publish_up, id, hits
sort-order = asc: ordre de tri : asc, desc
author: filtre sur auteur: liste des id ou article, current
main-style: classes et styles inline pour bloc principal
style: idem main-style
main-class: classe(s) pour bloc principal (obsoléte)
class: idem main-class
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)
list-style: classes et styles inline pour la liste
list-class: classe(s) pour la liste (obsoléte)
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## ##folder## ##state##
author LOMART version 1.0 license GNU/GPLv3
jextensions_list = component,module,plugin: prefset ou type(s)
type-exclude = 0: 1= tous les types sauf ceux passés en paramétre principal
client = 0: 0=site, 1=admin, 2=tous
minimal-id = 10000: pour exclure les composants du core Joomla
actif-only = 0: 1 pour lister les extensions dépubliées
sort = type,folder,name: tri
main-tag = ul:
item-tag = li:
template = ##state####name##[small] ##client## ##type####folder## ##version## (id:##id##) ##author## [/small] ##note##: modèle de mise en page. keywords+bbcode
model-folder = %s:
model-version = vers:%s:
model-note = [i class="t-blue"]%s[/i]:
state-list = t-red: liste de choix : inactif, actif 🔴
style: classes et styles
css-head (base-css):

➠ 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 1.0 license GNU/GPLv3
jmenus_list: prefset, nom menutype ou vide pour tous
menuid: ID menu parent pour limiter à cette branche
main-tag = ul: balise pour la liste des fichiers
template-menutype = [h5]##title## (id:##id##)[/h5] ##description## / ##menutype##: modèle de mise en page ou 0 pour aucun. keywords + bbcode
template-menu = ##title-link##[small] (id:##id##) ##access## - ##component## ##language##[/small] ##note##: modèle de mise en page. keywords + bbcode
model-note = [i class="t-blue"] %s[/i]: keywords + bbcode
style: classes et styles
css-head (base-css):

➠ 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 1.0 license GNU/GPLv3
jmodules_list: prefset ou position(s). vide=tous les modules site
position-exclude = 0: 1= toutes les positions sauf celles passées en paramétre principal
client = 0: 0=site, 1=admin, 2=tous
module: nom du module. ex: LM-Custom-SITE
module-exclude = 0: 1= tous les modules sauf ceux passés au paramètre module
actif-only = 0: 1 pour lister les extensions dépubliées
order = position, ordering, title: tri
main-tag = ul: balise pour le bloc englobant tous les modules. 0 pour aucun
main-style: classes et styles inline pour bloc principal
main-class: classe(s) pour bloc principal (obsolète)
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)
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]:
no-content-html = [p]aucun module a cette position[/p]: retour si aucune catégorie trouvée
state-list = icon-unpublish t-rouge, icon-publish t-vert, icon-trash t-gris: liste de choix : inactif, actif 🔴
css-head (base-css):

➠ kawa (coffee) : Sert un café virtuel ➠ DEMO

syntaxe {up kawa=long | sucre | speculoos=lotus }
author LOMART version 1.0 license GNU/GPLv3
kawa (coffee): vide = café court, long = café long
sucre (sugar) = 1: option sucre
speculoos: speculoos base ou spécifier marque (lotus)
class: classe(s) pour bloc
style: style inline pour bloc

➠ lang : Choix de contenu selon langue 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 1.0 license GNU/GPLv3
lang: langue pour vérifer le rendu (vide en production)
lang-order = en,fr: ordre de saisie des langue dans contenu
tag: balise entourant le contenu retourné
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)

➠ lorem : Affiche du texte aléatoire (enrichissement possible) ➠ DEMO

.
Syntaxe : {up lorem=liste des arguments ci-dessous }
- (integer) - Nombre de paragraphe (P) généré. 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é.
v1.9.5 : strip_tags si max-char ou max-word
author Lomart version 1.0 - 07/2017 license GNU/GPLv3
lorem: nombre de paragraphe
class: classe(s) pour bloc (sans effet, si tag=0)
style: style inline pour bloc (sans effet, si tag=0)
tag = div: (v1.6) tag du bloc contenant le texte en retour ou tag=0 pour aucun.
max-char: nombre maxima de caractères
max-word: nombre maxima de mots

➠ 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 09/2018 license GNU/GPLv3
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 = 0: rendu en niveau de gris
sepia = 0: rendu e sépia
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 07/2017 license GNU/GPLv3
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
class: classe(s) (obsolète)
style: classes et styles

➠ lorempixel : affiche une image aleatoire ➠ DEMO

Syntaxe : {up lorempixel=type | width=xx | height=xx }
--> type = abstract, animals, business, cats, city, food, nightlife, fashion, people nature, sports, technics, transport
.
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%
author Lomart version 07/2017 license GNU/GPLv3
lorempixel = cats: type d'image: abstract, animals, business, cats, city, food, nightlife, fashion, people nature, sports, technics, transport
align: alignement horizontal : left, center, right
height (h,hauteur) = 200: hauteur image téléchargée
width (l,largeur,w) = 200: largeur image téléchargée
class: classe(s) obsolète
style: classes et styles

➠ 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 1.0 crédit erusev/parsedown license GNU/GPLv3
markdown: chemin et nom du fichier markdown ou vide pour contenu
strip-tags = true: 0 pour conserver les tags HTML dans le contenu saisi entre les shortcodes. Ils sont toujours conservés si la source est un fichier.
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 1.0 - 28/7/2017 license GNU/GPLv3 credit script JS limarquee de omcg33
marquee: le texte de l'etiquette
filter: conditions. Voir doc action filter (v1.8)
height (h,hauteur) = 100px: hauteur defaut pour scroll vetical
model = base: style CSS dans .upmq-*style*. aucun=none
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 = false: true = label sur une ligne
direction = left: right, up, down
loop = -1: nombre d'affichage, -1 : infini
scrolldelay = 0: delai en millisecondes
scrollamount = 50: vitesse
circular = true: mode carousel. si contenu plus large que .str_wrap
drag = true: deplacement msg avec souris
runshort = true: scroll si texte court (visible sans scroll)
hoverstop = true: pause lors survol
inverthover = false: 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 : precisez 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
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 v1.0 du 30-09-2017 license GNU/GPLv3
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
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 debloquer 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 v1.0 license GNU/GPLv3
media_vimeo: code de la video (à la fin de l'url vimeo)
width (l,largeur,w): largeur de la video en px ou %
class: classe pour bloc externe
style: code css libre pour bloc externe
autoplay: demarrage 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

➠ 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 v1.1 du 21-05-2020 license GNU/GPLv3
media_youtube (youtube): code de la video (à la fin de l'url youtube)
width (l,largeur,w): largeur de la video en px ou %
class: classe pour bloc externe
style: code css libre pour bloc externe
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

➠ meteo_france : affiche le widget de Météo France ➠ DEMO

Syntaxe : {up meteo-france=ville | orientation=sens}
https://public.opendatasoft.com/explore/dataset/correspondance-code-insee-code-postal/api/?flg=fr&q=75001
https://api.gouv.fr/api/api-geo.html#!/Communes/get_communes
author LOMART update 2017-07-01 version v1.0 du 01-07-2017 license GNU/GPLv3
meteo_france: le code commune de la ville à récupérer sur https://www.meteofrance.com/meteo-widget
orientation = v: bloc horizontal (H) ou vertical (V)
block (bloc) = p: balise HTML autour du module météo
class: classe(s) pour bloc parent
style: style inline pour bloc parent

➠ modal : Affiche du contenu dans une fenetre modale (popup) ➠ DEMO

les types autorises 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 determiner son type
- video vimeo, youtube ou dailymotion {up popup=//youtu.be/H9fa9aWFbLM}
- image unique si {up popup=images/xx.jpg} ou png, ...
- bloc inline si id de bloc {up popup=#bloc}
- iframe si url {up popup=//lomart.fr} ou {up popup=doc/xx.pdf} ou {up popup=?index/...}
on peut forcer le type par type=inline, iframe, image, video, ajax
author LOMART version 1.0 license GNU/GPLv3 credit https://www.jqueryscript.net/lightbox/Lightbox-Popup-Plugin-Flashy.html
modal: contenu ou type de contenu
type: pour forcer le type : inline, iframe, image, video, ajax
class: classe(s) pour bloc label
style: style inline pour bloc label
label: texte du lien pour afficher le popup. bbcode accepté
close-left = 0: 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 definies par le webmaster (ajout dans le head)
base-js-params: règles JS definies 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 = 0: 1 pour demarrer la video a l'ouverture du popup
gallery = 1: 0 pour traiter les images individuellement
title (titre) = 1: afficher le titre
width (l,largeur,w): largeur avec unite. Ex: 80%, 500px, ...
height (h,hauteur): hauteur avec unite. 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 1.0 license GNU/GPLv3

➠ 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 1.0 license GNU/GPLv3 credit script de Leaflet
osmap: latitude, longitude du centre de la carte (a récupérer sur https://getlatlon.yohman.com)
class: classe(s) ajoutées au bloc principal
style: style inline ajouté au bloc principal
zoom = 13: niveau de zoom de la carte
height (h,hauteur) = 250: hauteur du bloc carte. La largeur est 100% du parent
tile: nom de la tuile
tile-options: niveau de zoom maximum, ...
tile-url: url de la tuile
map-options: liste des options pour la carte. ex: zoomControl:1, keyboard:0
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
scale = 1: affiche l'échelle. 0:sans, 1:métrique, 2:impérial, 3:métrique&impérial
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

➠ 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}
voir : https://rootslabs.net/blog/538-embarquer-pdf-page-web-pdf-js
integration libraire TurnJs https://turnjs.com/ depuis https://github.com/iberan/pdfjs-flipbook
author LOMART version 1.1 license GNU/GPLv3 credit Mozilla PDF.js
pdf: chemin du fichier pdf
method (methode) = PDFJS: ou Google, Embed ... ou 0
view = 1: ou Google, Embed ... ou 0
pdfjs-model = web: ou mobile (non opérationnel)
width (l,largeur,w) = 100%: largeur iframe
height (h,hauteur) = 500px:
class: classe(s) pour bloc parent
style: style inline pour bloc parent
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
btn (bouton) = 0: 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
close-left = 0: croix de fermeture en haut à gauche. haut-droite par défaut
flip = 0: activer le mode flipbook uniquement si pdfJs

➠ 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 1.0 license GNU/GPLv3
php: le code PHP
filter: conditions. Voir doc action filter (v1.8)
class:
style:

➠ 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 1.0 license GNU/GPLv3
php_error = dev: mode rapport d'erreurs : none, 0, min, max, dev

➠ 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
printer = ⎙ Imprimer: texte du bouton
selector: sélecteur CSS du bloc à imprimer
filename: nom du document si impression PDF
btn-before = 0: le bouton est après le contenu à imprimer
btn-display-on-print = 0: 0 = masque le bouton sur l'impression
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 1.0 license GNU/GPLv3
qrcode = text: type de QRCode : text/url/sms/email/phone/location/wifi/contact
size = 200:
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
alt: texte alternatif, si le qrcode n'est pas affiché
encoding = UTF-8:
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 1.0 - 07/2017 license GNU/GPLv3 credit script de Matt
readmore: idem textmore
textmore = lire la suite: texte bouton
textless = replier: texte bouton
class = uprm-btn: classe(s) pour les boutons. remplace la classe par défaut.
style: style inline pour les boutons

➠ 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 1.0 - 07/2017 license GNU/GPLv3 credit un vieux script de mes archives
sameheight: inutilisé
class:
style:
css-head (base-css): code css libre dans le head. attention: ] au lieu de }

➠ scroller : Défilement vertical d'une liste d'éléments ➠ DEMO

syntaxe : {up scroller}suite d'éléments{/up scroller}
author LOMART version 1.0 license GNU/GPLv3 credit Super Treadmill de nishadmenezes adapté pour UP
scroller = 3: nombre d'élément ou hauteur du bloc en px
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)
runAfterPageLoad = false:
direction = up: sens du défilement (up/down)
speed = medium: slow (5000), medium (3000), fast (1200) ou durée en millisecondes
viewable = 3: nombre d'élément ou hauteur du bloc en px (idem scroller)
pause = true: stop on hover

➠ 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 1.0 license GNU/GPLv3 credit script OWL Carousel de OwlFonk
slider_owl: aucun paramétre nécessaire
class: classe(s) ajoutées au bloc principal
style: style inline ajouté au bloc principal
autoPlay = 0:
slideSpeed = 200: Vitesse en millisecondes
paginationSpeed = 0: Pagination en millisecondes
pagination = true: Affiche pagination
paginationNumbers = 0: Affiche numéros à l'intérieur des boutons de pagination
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"
responsive = true:
items = 1: Nombre maxi d'éléments affichés en meme 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 1.0 license GNU/GPLv3 credit Easy jQuery Responsive Slideshow - Billboard de Spalmer
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
class: classe(s) ajoutées au bloc principal
style: style inline ajouté au bloc principal
css-head (base-css):
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 = 0: 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 1.0 license GNU/GPLv3 credit Script JQuery-Snowfall de loktar00
snowfall = snow-01.png: image ou dossier
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
selector = body: cible pour snowfall
center: style et classe pour centrage vertical du contenu entre shortcodes
z-index = 99: z-index des images
class: classe(s) pour bloc
style: style inline pour bloc
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 }
author LOMART version 1.0 license GNU/GPLv3 credit script xxx de xxx
sound_hover: fichier_son
class: classe(s) pour le bloc parent
style: style pour le bloc parent
evenement = onmouseenter: ou onclick, onmouseover...
tag = div: balise pour le bloc. span pour un bloc inline

➠ 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 1.0 license GNU/GPLv3 credit script Stupid Table de joequery
sql: nom de la table
select = *: listes des colonnes
where:
order:
group:
innerjoin:
outerjoin:
leftjoin:
rightjoin:
setlimit:
presentation = table: présentation du résultat : list,table,div ou 0
header: 1 ou vide pour utiliser les mots-clés, sinon titres séparés par point-virgules
sort: type de tri par colonne sous la forme: i,3-f-s. i:int, s:string, f:float. ,3 indique un tri secondaire sur la 3e colonne
sort-first: nom ou position de la colonne triée en premier
model: nom de la classe modele dans le fichier csv2table.css
col: alignement et largeur des colonnes sous la forme x-D-C5-100 pour rien-droite-centre 5%-100% (voir doc)
template: modèle mise en page
no-content-html = aucun résultat:
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
dbinfos: vide= liste des tables, nom_table=liste des colonnes

➠ 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 v1.0 - 07/2017 license GNU/GPLv3 credit Script de bhaveshcmedhekar
tab = tab: tab ou accordion
title-tag = h4: balise utilisée pour les titres onglets
style: classe(s) et style(s) bloc principal
title-style: classe(s) et style inline onglets
content-style: classe(s) et style inline contenu
class: classe(s) bloc principal (obsolète)
title-class: classe(s) onglets (obsolète)
content-class: classe(s) contenu (obsolète)
auto: delai en millisecondes pour changement automatique d'onglet
espace-vertical = 1: 0, 1 ou 2 : niveau des éléments à répartir
css-head (base-css): règles CSS mises dans le head
plugin_type: accordion
side: left ou right
active_tab: 1 a N
content_display = block: interne, 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 license GNU/GPLv3 credit John Polacek
table_by_columns (table_par_colonnes): rien
breakpoint = 720px: bascule en vue responsive
model = up-stacktable: nom d'un fichier CSS prévu par le webmaster pour toutes les tables de la page
style: style inline pour balise table
class: classe(s) pour balise table (obsolète)
max-height: max-height pour la table
key-width = 35%: pour bloquer le header en haut
title-style: style pour la ligne titre en vue responsive

➠ 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és 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 1.0 - 07/2017 license GNU/GPLv3 credit codefog
table_by_rows (table_par_lignes): rien
breakpoint = 720px: bascule en vue responsive
style: style inline pour balise table
class: classe(s) pour balise table (obsolète)
max-height: max-height pour la table
merge: fusion de colonnes. 1:[2,3],5:[6] = 2&3 avec 1 et 6 avec 5
move: deplacement 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 1.0beta - 07/2017 license GNU/GPLv3 credit lai32290
table_fixe: aucun argument
col-left = 0: nombre de colonnes fixées à gauche
max-height: max-height pour le bloc parent
style: classes et styles pour le bloc parent
class: classe(s) pour le bloc parent (obsolète)

➠ 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 1.0beta - 07/2017 license GNU/GPLv3 credit Jason Gross
table_flip (table_permute): aucun argument
style: classes et styles inline pour balise table
class: classe(s) pour balise table (obsolète)

➠ tabslide : ajoute des onglets pour ouvrir un panneau sur les bords de la fenetre ➠ 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 1.1 - 05/2020 credit script de hawk-ip license GNU/GPLv3
tabslide: titre de l'onglet
tab-style: classes et styles inline pour onglet
panel-style: classes et styles inline pour panneau
tab-class: classe(s) pour onglet (obsolète)
panel-class: classe(s) pour panneau (obsolète)
tabLocation = left: left, right, top or bottom
tabHandle = .handle: JQuery selector for the tab, can use #
speed = 300: time to animate
action = click: action open, 'hover' or 'click'
offset = 200px: distance pour top or left (bottom or right if offsetReverse is true)
offsetReverse = false: true= aligné a droite ou en bas
otherOffset = null: if set, panel size is set to maintain this dist from bottom or right (top or left if offsetReverse)
handleOffset = null: e.g. '10px'. If null, detects panel border to align handle nicely
handleOffsetReverse = false: if true, handle aligned with right or bottom of panel
bounceDistance = 50px: how far bounce event will move everything
bounceTimes = 4: how many bounces when 'bounce' is called
positioning = fixed: or absolute, so tabs move when window scrolls
pathToTabImage = null: optional image to show in the tab
imageHeight = null:
imageWidth = null:
onLoadSlideOut = false: slide out after DOM load
clickScreenToClose = true: close tab when rest of screen clicked
toggleButton = .tab-opener: not often used
onOpen = function() {:
onClose = function() {:

➠ toc : Sommaire automatique ➠ DEMO

Création d'un sommaire à partir des titres de l'article
syntaxe {up toc}
author LOMART version 1.0 license GNU/GPLv3 credit https://www.jqueryscript.net/layout/Highly-Configurable-jQuery-Table-of-Contents-Plugin-TocJS.html
toc: inutilisé
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
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
indexingFormats: format des index : nombres, lettres ou
maxlen: longueur maxi des titres du sommaire
elementClass = uptoc: class de la div navigation
rootUlClass = toc-ul-root:
ulClass = toc-ul:
levelPrefixClass = toc-level-: (interne) préfixe des classes
heading:

➠ tooltip : des info-bulles au survol d'un élément ➠ DEMO

syntaxe {up tooltip=texte info-bulle}texte{/up tooltip}
author LOMART version 1.0 license GNU/GPLv3 credit sur un script de stefangabos
tooltip: texte de la bulle. bbcode permis
model: une des classes principales définies dans up-model.scss
position = center: left, right
bottom (b,bas) = 0: vrai pour afficher la bulle au-dessous
width (l,largeur,w) = 250: largeur maxi de l'info-bulle
offset = 0: décalage verticcal de info-bulle. Négatif=vers le haut
opacity = 95: transparence de l'info-bulle
open = 0: info-bulle affichée au chargement de la page
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)

➠ tweeter_timeline : affiche la timeline Tweeter ➠ DEMO

{up tweeter-timeline=}
voir : dev.twitter.com/web/embedded-timelines/parameters
author PMLECONTE version v1.1 du 22/05/2018 license GNU/GPLv3
tweeter_timeline: nom.
style: classes et style inline bloc parent
class: classe bloc parent (obsolète)
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

➠ upactionslist : INTERNE - 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
author Lomart - https://lomart.fr update 2019-10-25 license GNU/GPLv3
upactionslist: liste des actions à récupérer. toutes par défaut
style:
class: (obsolète)
demo = 1: afficher le lien vers la demo
filter: condition d'exécution
make-dico = 0: consolide le fichier principal dico.json avec ceux des actions
csv = 0: enregistre un tableau CSV des actions et options dans plugins/content/up/doc-actions.csv
md = 0: enregistre la documentation au format markdown dans plugins/content/up/doc-actions.md

➠ upprefset : Affiche la liste de tous les prefsets de UP pour le site ➠ DEMO

syntaxe {up upPrefSet}
author LOMART version 1.0 license GNU/GPLv3
upprefset: liste des actions ou vide pour toutes
action-exclude = 0: 1: toutes les actions sauf celles du paramétre principal
action-template = [h4]##action##[/h4]:
prefset-template = [b]##prefset##[/b] : [small]##options##[/small]:
info-template = [div class="bd-grey ph1"]##info##[/div]:
prefset-separator = [br]:
options-separator = [b class="t-vert"] | [/b]: les underscrores sont remplacés par des espaces
prefset-exclude = icons,options: sections exclues
export-prefs: ou sous-dossier de TMP pour sauver l'arborescence. ex : up-pref-foo
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 : INTERNE - Compile tous les fichiers SCSS dans les dossiers des actions

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 1.0 license GNU/GPLv3 credit https://github.com/leafo/scssphp
upscsscompiler: liste des actions à recompiler. toutes par défaut
mode = Compressed: Compressed, Compact, Crunched, Expanded, Nested
force: force la compilation de tous les SCSS. Par défaut: les SCSS plus récents que leur CSS.
info = 0: affiche rapport compilation
force-filter: oblige force si la condition est remplie

➠ website : Affiche un screenshot d'un site avec un lien. ➠ DEMO

syntaxe {up website=URL}
par défaut, le texte affiché sous la vignette est l'URL sans https://
author LOMART version 1.0 license GNU/GPLv3
website: URL du site
link = 1: affiche le lien au-dessous du screenshot
link-text: texte affiché pour le lien et alt
target = _blank: ou _self pour ouvrir le site dans le même onglet
style: classes et style inline pour bloc
class: classe(s) pour bloc (obsolète)
css-head (base-css): règles CSS définies par le webmaster (ajout dans le head) v1.8

découverte

	accueil
	contacter perlimpinpin
	liens
	mentions légales
	météo à Neffiès
	plan

Annonce

UP Universal Plugin

Effet n° 82

Fil d'Ariane

rechercher

identification