Squelette élégant pour vos photos
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

118 lines
3.9 KiB

[(#REM)
article avec portfolio
ATTENTION: si modification
modifier aussi inc/rubrique_portfolio
param:
- id_article
]<BOUCLE_art(ARTICLES){id_article}>
<!-- content -->
<div class="content">
<div class="container container-aoto">
<!--- gondole -->
[(#REM) texte de gondole: logo sinon on prend 1er image ]
<div class="gondole gondole-play-wrapper-js">
[(#SET{l,#ENV{l}|sinon{2000}})]
[(#SET{h,#ENV{h}|sinon{600}})]
[(#SET{fond,#ENV{f}|sinon{'#727272'}})]
[<div class="gondole-item wow fadeIn">(#LOGO_ARTICLE|image_proportions{#GET{l},#GET{h},focus}
|image_reduire{#GET{l},#GET{h},center center}
|image_recadre{#GET{l},#GET{h},center,#GET{fond}}
|inserer_attribut{alt,#ENV{titre}|textebrut})</div>]
<BOUCLE_img_gondole(DOCUMENTS){id_article}
{extension IN jpg,png,gif}
{par rang_lien, id_document}
{0,1}
{si #LOGO_ARTICLE|non}>
[<div class="gondole-item wow fadeIn">(#FICHIER|image_proportions{#GET{l},#GET{h},focus}
|image_reduire{#GET{l},#GET{h},center center}
|image_recadre{#GET{l},#GET{h},center,#GET{fond}}
|inserer_attribut{alt,#ENV{titre}|textebrut})</div>]
</BOUCLE_img_gondole>
<div class="gondole-fiche">
<div class="gondole-fiche-inner">
[<h1 class="gondole-titre #EDIT{titre}">(#TITRE)</h1>]
[<div class="gondole-texte #EDIT{texte}">(#TEXTE)</div>]
</div>
</div>
<div class="gondole-play">
<svg fill="currentColor" viewBox="0 0 30 30" id="sm-icon-def-large-Play"><path d="M21 15L9 23V7l12 8" fill-rule="evenodd"></path></svg>
</div>
</div>
<!--- #gondole -->
<!--- planche -->
[(#REM) planche contact en 3 colonnes responsives ]
<div class="planche">
[(#REM) compteur photo]
#SET{c,1}
<B_img1>
<div class="planche-col planche-col-1">
<BOUCLE_img1(DOCUMENTS){id_article}
{extension IN jpg,png,gif}
{par rang_lien, id_document}
{1/3}>
[<figure class="planche-item wow fadeIn">
<a href="#URL_DOCUMENT" data-fancybox="images" class="planche-item-lien planche-item-lien-#GET{c}">(#FICHIER|image_reduire{1000,0})</a>
[(#TITRE|sinon{#DESCRIPTIF}|oui)<figcaption>]
[<h6 class="planche-item-titre">(#TITRE)</h6>]
[<div class="planche-item-desc">(#DESCRIPTIF)</div>]
[(#TITRE|sinon{#DESCRIPTIF}|oui)</figcaption>]
</figure>]
[(#SET{c,#GET{c}|plus{1}})]
</BOUCLE_img1>
</div>
</B_img1>
<B_img2>
<div class="planche-col planche-col-2">
<BOUCLE_img2(DOCUMENTS){id_article}
{extension IN jpg,png,gif}
{par rang_lien, id_document}
{2/3}>
[<figure class="planche-item wow fadeIn">
<a href="#URL_DOCUMENT" data-fancybox="images" class="planche-item-lien planche-item-lien-#GET{c}">(#FICHIER|image_reduire{1000,0})</a>
[(#TITRE|sinon{#DESCRIPTIF}|oui)<figcaption>]
[<h6 class="planche-item-titre">(#TITRE)</h6>]
[<div class="planche-item-desc">(#DESCRIPTIF)</div>]
[(#TITRE|sinon{#DESCRIPTIF}|oui)</figcaption>]
</figure>]
[(#SET{c,#GET{c}|plus{1}})]
</BOUCLE_img2>
</div>
</B_img2>
<B_img3>
<div class="planche-col planche-col-3">
<BOUCLE_img3(DOCUMENTS){id_article}
{extension IN jpg,png,gif}
{par rang_lien, num titre, titre}
{3/3}>
[<figure class="planche-item wow fadeIn">
<a href="#URL_DOCUMENT" data-fancybox="images" class="planche-item-lien planche-item-lien-#GET{c}">(#FICHIER|image_reduire{1000,0})</a>
[(#TITRE|sinon{#DESCRIPTIF}|oui)<figcaption>]
[<h6 class="planche-item-titre">(#TITRE)</h6>]
[<div class="planche-item-desc">(#DESCRIPTIF)</div>]
[(#TITRE|sinon{#DESCRIPTIF}|oui)</figcaption>]
</figure>]
[(#SET{c,#GET{c}|plus{1}})]
</BOUCLE_img3>
</div>
</B_img3>
</div>
<!--- planche -->
</div>
</div>
<!-- #content -->
</BOUCLE_art>
#FILTRE{trim}