THELIA Forum

Welcome to the THELIA support and discusssion forum

Announcement

Rejoignez la communauté sur le Discord Thelia : https://discord.gg/YgwpYEE3y3

Offline


Utilisation slider flexslider, thelia ver 1.5.0
Les images font parties de la gestion Contenu et représentent la LISTE DES DOSSIERS DE CONTENU
Les images s'affichent très bien, par contre elles ont un titre, chapo et/ou description.
Je voudrais savoir quelle boucle ou filtre me permettrait d'afficher les infos associées

H2 #CHAPO, H1 #TITRE, H3 #DESCRIPTION

		<THELIA_CONTENU type="DOSSIER" rubrique="#RUBRIQUE_ID" classement="manuel">
 <ul class="slides">
<THELIA_IMAGE type="IMAGE" dossier="#ID" num="1" aleatoire="1"/>	
	<li class="free_slider">
		<div class="slider_full">				
			<img src="#IMAGE"  alt="#TITRE" title="#DESCRIPTION"/>			
		</div>
		   <div class="free_content">
                        <div class="container">
                               <div class="sixcol-four">
   									<h2 style="text-align: center;">
									<span style="color: #606060;">#CHAPO
									<br />
									</span>
									</h2>
									<h1 style="text-align: center;">
									<span style="color: #fff;">#TITRE</span>
									<br>
									</span>
									</h1>
									<h3 style="text-align: center;">
										<span style="color: #909090;">#DESCRIPTION</span>
									</h3>
									<p style="text-align: center;"></p>
                              </div>
                     </div>
             </div>
	<div style="clear: both;"></div>			
	</li>
</ul>
				</THELIA_IMAGE>
<ol class="flex-control-nav flex-control-paging">
	<li>
		<a class="flex-active">1</a>
	</li>
	<li>
		<a class="">2</a>
	</li>
</ol>
<ul class="flex-direction-nav">
	<li>
		<a class="flex-prev" href="#">Previous</a>
	</li>
	<li>
		<a class="flex-next" href="#">Next</a>
	</li>
</ul>
 </THELIA_CONTENU>

Merci d'avoir eu pris le temps de lire et éventuellement de répondre
Si je trouve en cours de route, je mettrai l'info
A+ Steph

Last edited by stephst84 (08-12-2013 13:17:54)

Offline

Offline


Merci pour l'info,

Last edited by stephst84 (08-12-2013 20:40:25)

Offline


donc voici la soluce, le code qui entoure le Slider

        <div class="mainflex flexslider" >
 <ul class="slides">		<THELIA_MENU_CONTENU type="DOSSIER" dossier="#ID" id="6,7,8,9,10" classement="manuel">
	<li class="free_slider flex-active-slide" >	
					<THELIA_IMAGE type="IMAGE" dossier="#ID" />
		<div class="slider_full">
			<img src="#IMAGE"  alt="#TITRE" title="#DESCRIPTION"/>			
		</div>
	<div class="free_content">
				<div class="container">
					<div class="sixcol-four">            			
   						<h2 style="text-align: center;">
						<span style="color: #606060;">#CHAPO
						<br />
						</span>
						</h2>
						<h1 style="text-align: center;">
						<span style="color: #fff;">#TITRE</span>
						<br>
						</span>
						</h1>
						<h3 style="text-align: center;">
						<span style="color: #909090;">#DESCRIPTION</span>
						</h3>
						<p style="text-align: center;"></p>			
					</div>
				</div>
	</div>	
	<div style="clear: both;"></div>
						</THELIA_IMAGE>	
				</li>
					</THELIA_MENU_CONTENU>
				</ul>

les scripts à insérer en bas de page avant le body final

	<script type="text/javascript" charset="utf-8">
  $(window).load(function() {
    $('.slides').flexslider();
  });
</script> 
<script type="text/javascript" charset="utf-8">
  $(window).load(function() {
/*global jQuery:false */
"use strict";
jQuery('.mainflex,.slides').flexslider({
//animation: "fade",
slideshow: true, //Boolean: Animate slider automatically
slideshowSpeed: 7000, //Integer: Set the speed of the slideshow cycling, in milliseconds
//animationDuration: 600,
//smoothHeight: true
});
});
</script>
<script type="text/javascript">
jQuery(window).load(function() {
/*global jQuery:false */
"use strict";
jQuery('.mainflex,.singleslider').flexslider({
animation: "fade",
slideshow: true, //Boolean: Animate slider automatically
slideshowSpeed: 7000, //Integer: Set the speed of the slideshow cycling, in milliseconds
animationDuration: 600,
smoothHeight: true
});
});
</script>
<script type="text/javascript">
jQuery(window).load(function() {
/*global jQuery:false */
"use strict";
jQuery('.featuredflex').flexslider({
animation: "fade",
slideshow: true, //Boolean: Animate slider automatically
slideshowSpeed: 7000, //Integer: Set the speed of the slideshow cycling, in milliseconds
animationDuration: 600
});
});
</script>

et pensez à INCLURE dans votre meta le js jquery.flexslider et désactiver le js jquery principal fourni par Thelia
        <script type="text/javascript" src="template/js/jquery3109.js"></script>

    <script src="template/js/jquery.flexslider-min.js" type="text/javascript"></script>
    <script src="template/js/jquery.flexslider.start.featured.js" type="text/javascript"></script>
    <script src="template/js/jquery.flexslider.start.main.js" type="text/javascript"></script>

Offline


Pour vous donner une idée slider en haut de page

 http://www.creactivit.com/ 

Bonne journée et bonne année à Tous.
A+ Steph Web Graph

Last edited by stephst84 (06-01-2014 10:01:47)