premiere partie de la page d'accueil
This commit is contained in:
parent
2079cdcf3c
commit
0da71a4e7d
13 changed files with 189 additions and 121 deletions
|
|
@ -7,9 +7,11 @@
|
|||
|
||||
[(#REM)<INCLURE{fond=inclure/zone_tags,env}>]
|
||||
|
||||
[(#REM)
|
||||
<div class="breadcrumb inner">
|
||||
<INCLURE{fond=breadcrumb/#ENV{type-page},env,ajax=article} />
|
||||
</div>
|
||||
]
|
||||
|
||||
<div class="content" id="content">
|
||||
<INCLURE{fond=content/#ENV{type-page},env} />
|
||||
|
|
|
|||
|
|
@ -1,46 +1,60 @@
|
|||
<div class="la_une">
|
||||
<BOUCLE_presentation(ARTICLES){grigri=presentation}{0,1}{! par date}>
|
||||
<div id="presentation" class="w66">
|
||||
<h3 class="#EDIT{titre}">#TITRE</h3>
|
||||
<div class="#EDIT{texte}">#TEXTE</div>
|
||||
<section id="presentation-accueil">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<BOUCLE_presentation(ARTICLES){grigri=presentation_accueil}{0,1}{! par date}>
|
||||
<div id="images-presentation" class="col-md">
|
||||
[(#LOGO_SITE_SPIP|image_reduire{510,0})]
|
||||
<BOUCLE_image_pres(DOCUMENTS){id_article}{0,1}>
|
||||
<div class="image-encadree">
|
||||
[(#FICHIER|image_recadre{380:362,-,focus}|image_reduire{380,362})]
|
||||
</div>
|
||||
</BOUCLE_image_pres>
|
||||
</div>
|
||||
<div id="texte-presentation" class="col-md #EDIT{texte}">
|
||||
<div class="contenu text-dark">
|
||||
#TEXTE
|
||||
</div>
|
||||
</div>
|
||||
</BOUCLE_presentation>
|
||||
<BOUCLE_actualites(ARTICLES){grigri=actualites}{0,1}{! par date}>
|
||||
<div id="actualites" class="encadre">
|
||||
<h3 class="#EDIT{titre}">#TITRE</h3>
|
||||
<div class="#EDIT{texte}">#TEXTE</div>
|
||||
</div>
|
||||
</BOUCLE_actualites>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<h3 class="la_une">À la une</h3>
|
||||
<div class="liste_des_rubriques">
|
||||
<BOUCLE_art(ARTICLES){branche}{id_secteur = #CONFIG{balint/id_bien}}>
|
||||
<INCLURE{fond=inclure/bloc_une, env, id_article,statut=publie}>
|
||||
</BOUCLE_art>
|
||||
</div>
|
||||
<section id="mis-en-avant">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-9">
|
||||
<INCLURE{fond=inclure/diaporama_accueil}/>
|
||||
</div>
|
||||
<div class="col-lg-3">
|
||||
<div id="agenda">
|
||||
<h3>Agenda</h3>
|
||||
<BOUCLE_agenda(ARTICLES){titre_mot=agenda}>
|
||||
<div class="agenda-evenement">
|
||||
<h4>
|
||||
<a href="#URL_ARTICLE">
|
||||
#TITRE
|
||||
</a>
|
||||
</h4>
|
||||
#DATE_AGENDA
|
||||
</div>
|
||||
</BOUCLE_agenda>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 class="la_une">Les rubriques du journal</h3>
|
||||
<div class="liste_des_rubriques">
|
||||
<BOUCLE_sect(RUBRIQUES){id_rubrique = #CONFIG{balint/id_bien}}>
|
||||
<BOUCLE_rub(RUBRIQUES){id_parent}{par num titre}>
|
||||
<INCLURE{fond=inclure/bloc_rub, env, id_rubrique}>
|
||||
</BOUCLE_rub>
|
||||
#SET{nb_rubs, #TOTAL_BOUCLE}
|
||||
</B_rub>
|
||||
</BOUCLE_sect>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
[(#REM)
|
||||
<div class="container_carte">
|
||||
<h3>Situation des biens</h3>
|
||||
[(#INCLURE{fond=modeles/carte_gis,
|
||||
autocenterandzoom=oui,
|
||||
objets=articles,
|
||||
id_mot=#ENV{id_mot},
|
||||
zoom_wheel=non,
|
||||
height=500px,
|
||||
})]
|
||||
</div>
|
||||
]
|
||||
<section id="a-la-une">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<BOUCLE_a_la_une(ARTICLES){titre_mot=a_la_une}>
|
||||
<div class="col-md-3">
|
||||
<INCLURE{fond=inclure/bloc_article}/>
|
||||
</div>
|
||||
</BOUCLE_a_la_une>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -3,17 +3,6 @@
|
|||
[(#CHEMIN{img/sprite_symbol_pictos.svg}|afficher_svg)]
|
||||
</div>
|
||||
|
||||
<header class="flex-container">
|
||||
[(#SI_PAGE{sommaire}|non)<a class="lien_accueil" rel="start home" href="#URL_SITE_SPIP/" title="<:accueil_site:>">]
|
||||
[(#LOGO_SITE_SPIP|image_reduire{0,100})]
|
||||
[(#SI_PAGE{sommaire}|non)</a>]
|
||||
<div id="header-droite" class="flex-container--column">
|
||||
[(#SI_PAGE{sommaire}|non)<a class="lien_accueil" rel="start home" href="#URL_SITE_SPIP/" title="<:accueil_site:>">]
|
||||
<h1 id="titre_site_spip">#NOM_SITE_SPIP</h1>
|
||||
<h2 class="h3-like #EDIT{meta-slogan_site}" id="sous-titre_site">[(#SLOGAN_SITE_SPIP)]</h2>
|
||||
[(#SI_PAGE{sommaire}|non)</a>]
|
||||
</div>
|
||||
<header >
|
||||
<INCLURE{fond=inclure/menu_principal,env}>
|
||||
</header>
|
||||
<nav id="barnav" role="navigation">
|
||||
<INCLURE{fond=inclure/nav_principale,env}>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
[(#REM) On charge le sprite svg des pictos]
|
||||
<div class="hidden">
|
||||
[(#CHEMIN{img/sprite_symbol_pictos.svg}|afficher_svg)]
|
||||
</div>
|
||||
|
||||
<div class="flex-container " id="page-top">
|
||||
<header class="accueil">
|
||||
[(#SI_PAGE{sommaire}|non)<a class="lien_accueil" rel="start home" href="#URL_SITE_SPIP/" title="<:accueil_site:>">]
|
||||
[(#LOGO_SITE_SPIP|image_reduire{0,100}) ]<h1 id="logo_site_spip">#NOM_SITE_SPIP</h1>
|
||||
[(#SI_PAGE{sommaire}|non)</a>]
|
||||
</header>
|
||||
<nav id="barnav" role="navigation">
|
||||
<INCLURE{fond=inclure/nav_principale,env}>
|
||||
</nav>
|
||||
</div>
|
||||
BIN
images/bg-encadre-blanc3.jpg
Normal file
BIN
images/bg-encadre-blanc3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
images/bg-rouge-fonce-3.jpg
Normal file
BIN
images/bg-rouge-fonce-3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
BIN
images/delaunay_brut.jpg
Normal file
BIN
images/delaunay_brut.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 100 KiB |
BIN
images/fond-une-jaune.jpg
Normal file
BIN
images/fond-une-jaune.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
30
inclure/diaporama_accueil.html
Normal file
30
inclure/diaporama_accueil.html
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
<div id="diaporama_accueil" class="carousel slide" data-ride="carousel">
|
||||
<ol class="carousel-indicators">
|
||||
<BOUCLE_compteur(ARTICLES){titre_mot=diaporama}{tout}>
|
||||
<li data-target="#diaporama_accueil" data-slide-to="[(#COMPTEUR_BOUCLE|moins{1})]" [(#COMPTEUR_BOUCLE|=={1}|oui) class="active"]></li>
|
||||
</BOUCLE_compteur>
|
||||
</ol>
|
||||
<div class="carousel-inner">
|
||||
<BOUCLE_diapo(ARTICLES){titre_mot=diaporama}{tout}>
|
||||
<div class="carousel-item [(#COMPTEUR_BOUCLE|=={1}|oui) active]">
|
||||
<div class="carousel-caption text-light">
|
||||
<a href="#URL_SITE" class="diapo-texte text-light">
|
||||
<h2>#TITRE</h2>
|
||||
#TEXTE
|
||||
</a>
|
||||
<a href="#URL_SITE" class="diapo-bouton text-light">
|
||||
#NOM_SITE
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</BOUCLE_diapo>
|
||||
</div>
|
||||
<a class="carousel-control-prev" href="#diaporama_accueil" role="button" data-slide="prev">
|
||||
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||
<span class="sr-only">Précédent</span>
|
||||
</a>
|
||||
<a class="carousel-control-next" href="#diaporama_accueil" role="button" data-slide="next">
|
||||
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||
<span class="sr-only">Suivant</span>
|
||||
</a>
|
||||
</div>
|
||||
29
inclure/menu_principal.html
Normal file
29
inclure/menu_principal.html
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
<nav id="menu-principal" class="navbar navbar-expand-lg navbar-dark fixed-top ">
|
||||
|
||||
<a class="navbar-brand" href="[(#URL_PAGE{sommaire})]">[(#LOGO_SITE_SPIP|image_reduire{200,0})]</a>
|
||||
<button class="navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#liste-deroulante" aria-controls="liste-deroulante" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<i class="fa fa-bars" aria-hidden="true"></i>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="liste-deroulante">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="nav-item [(#SI_PAGE{sommaire}|oui) active]">
|
||||
<a class="nav-link" href="[(#URL_PAGE{sommaire})]">Accueil</a>
|
||||
</li>
|
||||
<li class="nav-item [(#SI_PAGE{association}|oui) active]">
|
||||
<a class="nav-link" href="[(#URL_PAGE{association})]">L'association</a>
|
||||
</li>
|
||||
<li class="nav-item [(#SI_PAGE{methode}|oui) active]">
|
||||
<a class="nav-link" href="[(#URL_PAGE{methode})]">La méthode</a>
|
||||
</li>
|
||||
<li class="nav-item [(#SI_PAGE{groupes}|oui) active]">
|
||||
<a class="nav-link" href="[(#URL_PAGE{groupes})]">Les groupes</a>
|
||||
</li>
|
||||
<li class="nav-item [(#SI_PAGE{mediatheque}|oui) active]">
|
||||
<a class="nav-link" href="[(#URL_PAGE{mediatheque})]">Médiathèque</a>
|
||||
</li>
|
||||
<li class="nav-item [(#SI_PAGE{forum}|oui) active]">
|
||||
<a class="nav-link" href="[(#URL_PAGE{forum})]">Forum</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
[(#REM)
|
||||
les 3 blocs deroulants de la barre nav
|
||||
]
|
||||
<nav class="navbar is-hidden">
|
||||
<div class="pardessus">
|
||||
<BOUCLE_edito(ARTICLES){id_secteur != #CONFIG{balint/id_bien}}{grigri != presentation}>
|
||||
<div id="id_article_#ID_ARTICLE" class="articles">
|
||||
<a href="#URL_ARTICLE" class="nom_groupe" title="[(#TITRE|attribut_html)]">
|
||||
[(#TITRE|couper{45})]
|
||||
</a>
|
||||
</div>
|
||||
</BOUCLE_edito>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<B_tags>
|
||||
<nav class="tagbar is-hidden">
|
||||
<div class="pardessus">
|
||||
<BOUCLE_tags(GROUPES_MOTS){grigri = tags}>
|
||||
<div id="id_groupe_#ID_GROUPE" class="groupe_mots">
|
||||
[(#MODELE{nuage_popularite}{id_groupe})]
|
||||
</div>
|
||||
</BOUCLE_tags>
|
||||
</div>
|
||||
</nav>
|
||||
</B_tags>
|
||||
<B_mots_fermes>
|
||||
<nav class="mcbar is-hidden">
|
||||
<div class="pardessus">
|
||||
<BOUCLE_mots_fermes(GROUPES_MOTS){grigri != tags}>
|
||||
<div id="id_groupe_#ID_GROUPE" class="groupe_mots">
|
||||
<div class="nom_groupe deplier_groupe_mots" data-id_groupe="#ID_GROUPE">
|
||||
#TITRE <i class="icon-arrow--down"></i>
|
||||
</div>
|
||||
<B_mot>
|
||||
<ul class="id_groupe_#ID_GROUPE js-hidden mots_groupe">
|
||||
<BOUCLE_mot(MOTS){id_groupe}>
|
||||
<li class="btn un_mot" data-id_mot="#ID_MOT" data-mot="#TITRE**">#TITRE</li>
|
||||
</BOUCLE_mot>
|
||||
</ul>
|
||||
</B_mot>
|
||||
</div>
|
||||
</BOUCLE_mots_fermes>
|
||||
</div>
|
||||
</nav>
|
||||
</B_mots_fermes>
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
<button class="burgermenu nav-button" type="button" role="button" aria-label="open/close navigation">
|
||||
<i></i>
|
||||
</button>
|
||||
|
||||
[(#INCLURE{fond=inclure/menu, env, identifiant=barrenav})]
|
||||
70
modeles/slider_home.html
Normal file
70
modeles/slider_home.html
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
[(#REM)
|
||||
fork du modèle d'owl carousel pour le slider de la home EPISUR
|
||||
dots = true
|
||||
affiche des flêches pour suivant / précédents
|
||||
autoplay = true
|
||||
largeur = 750px
|
||||
caption = oui
|
||||
autoplayHoverPause = true
|
||||
lazyLoad = true
|
||||
id-carousel = slider_home
|
||||
|
||||
@param : id_article
|
||||
@param : id-carousel : id unique du carousel
|
||||
@param : caption : oui : Affiche la description de l'image.
|
||||
@param : docs : 1,2,3 : selectionne individuellement les documents
|
||||
@param : dots : true par defaut : affiche les points de navigation
|
||||
@param : navigation : true par defaut : affiche les boutons précédents suivants
|
||||
@param : caption_css : ajouter des css sur la description (par exemple : invisible).
|
||||
@param : autoplay : true (false par défaut) : le carousel démarre automatiquement.
|
||||
@param : autoplayHoverPause : true (false par défaut) : pause sur le rollHover en mode autoplay
|
||||
@param : lazyLoad : true (false par défaut) : ne charge que les images visibles pour optimiser le chargement.
|
||||
]
|
||||
<div id="slider_home" class="owl-carousel owl-theme">
|
||||
<BOUCLE_listDocs(DOCUMENTS){id_article?}{id_rubrique?}{extension==jpg|png}{tout}{par rang_lien}{largeur >= 800}{hauteur >= 430}>
|
||||
[(#SET{couleur_text,#COULEUR_TEXT|sinon{#ffffff}})]
|
||||
<div class="owl-slide">
|
||||
<div class="caption"[ style="background-color:(#COULEUR_FOND);"]>[
|
||||
[(#URL_TITRE|?{<a href="#URL_TITRE" class="message">,<div class="message" style="color:#GET{couleur_text}!important;">})]
|
||||
(#DESCRIPTIF)
|
||||
[(#URL_TITRE|?{</a>,</div>})]][
|
||||
<div class="credits">[<a href="(#CREDITS*)" title="<:epb:voir_source_credits:>" style=" color:#GET{couleur_text}!important;">](#TITRE)[(#CREDITS|oui)<i class="fa fa-external-link"></i></a>]</div>]
|
||||
</div>
|
||||
[<a href="(#URL_TITRE)" class="" rel="diaporamaslider_home" style="color:#GET{couleur_text}!important;">]
|
||||
<img class="[(#ENV{lazyLoad,true}|=={true}|oui) owl-lazy" data-]src="[(#FICHIER|image_recadre{1700:430,-,focus}|adaptive_images{1200}|extraire_attribut{src})]" alt="[(#TITRE|textebrut)]">
|
||||
[(#URL_TITRE|oui)</a>]
|
||||
</div>
|
||||
</BOUCLE_listDocs>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(function($){
|
||||
$("#slider_home").owlCarousel({
|
||||
loop:true,
|
||||
lazyLoad: true,
|
||||
caption: 'oui',
|
||||
dots: true,
|
||||
nav: true,
|
||||
autoplay: false,
|
||||
autoplayHoverPause: true,
|
||||
largeur: 750,
|
||||
items: 1,
|
||||
autoHeight: true,
|
||||
// URLhashListener: false,
|
||||
// startPosition: 'URLHash',
|
||||
navText : ['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'],
|
||||
// navText : ["<:owlcarousel:prec:>","<:owlcarousel:suiv:>"],
|
||||
responsive:{
|
||||
0:{
|
||||
items:1
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Gallerie Colorbox
|
||||
$("a.js-colorbox").colorbox({
|
||||
rel:'diaporamaslider_home',
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</B_listDocs>
|
||||
Loading…
Add table
Reference in a new issue