Slider for multiple pages

[MediaJuice]

Hi there,

I'm looking for a module to make (a lot) of sliders, everyone with different images and they must be placed on different pages.

I found Showtime Diashow, but this module is outdated and doesn't work properly.

Does anyone know/ have an addon for cmsms that can do this in a good way? I googled it, searched the forum and the modules but I can't find anything.

Thanks in advance.

[staartmees]

Why is Showtime outdated? version 3.4 dates from March 2014. It works fine with the latest version of cmsms and it's responsive.

[MediaJuice]

It doesn't work well with Foundation somehow... I understand almost everybody seems to be enjoying Showtime, but for me it just doesn't work.

Do you no another alternative? I'm trying the Gallery module now, but also some issues...

Thanks for your reaction!

[Dr.CSS]

Have you tried Album..?

[psy]

Gallery works perfectly well with Foundation Zurb. The key is to remove all Gallery CSS and Javascript and let Zurb do the work.

Code: Select all

{strip}
<div class="gallery">
{if !empty($module_message)}<h4>{$module_message|escape}</h4>{/if}
{if !empty($gallerytitle)}<h3>{$gallerytitle}</h3>{/if}
{if !empty($gallerycomment)}<div class="gallerycomment">{$gallerycomment}</div>{/if}
<p>{$imagecount}</p>


<div class="parentlink">
    <p class="text-center"><a href="{cms_selflink href=$page_alias}" class="button yellow tiny radius"><i class="fi-arrow-left"> Back to Gallery</i></a></p>
</div>

{if $pages > 1}
{* get the starting page number from the url *}
{assign var=tmp value="/"|explode:$cgsimple->self_url()}<br />
{$tmp=array_reverse($tmp)}
{assign var=tmp2 value="-"|explode:$tmp.0}
{assign var=startnum value=$tmp2.0}


	<div class="pagination-centered">
		<ul class="pagination">
			{section name=foo start=$startnum loop=$number step=1}
				{if $smarty.section.foo.first} 
				<li><a href="{root_url}/{$gallerydir}/1-{$number}-{$page_id}.html">&laquo;</a></li>
				<li><a href="{root_url}/{$gallerydir}/1-{$number}-{$page_id}.html">1</a></li>
				{else}
				{math equation="x*y" x=$smarty.section.foo.index y=$startnum assign=picnum1}
				{math equation="x+y" x=$picnum1 y=$startnum assign=picnum2}
				<li {if $smarty.section.foo.index eq $currentpage}class="current"{/if}><a href="{root_url}/{$gallerydir}/{$picnum1}-{$picnum2}-{$page_id}.html">{$smarty.section.foo.index}</a></li> 
				{/if}
			{/section}
			<li><a href="{root_url}/{$gallerydir}/{$picnum}-{$number}-{$page_id}.html">&raquo;</a></li>
		</ul>
	</div>
{/if}


	<ul class="clearing-thumbs" data-clearing>
{foreach from=$images item=image}
	<li class="th">
	  	<a href="{$image->file}">
	  		<img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" data-caption="{$image->titlename|cms_escape}{if !empty($image->comment)}<br />{eval|cms_escape var=$image->comment}{/if}" alt="{$image->titlename}" >
		</a>
	</li>
{/foreach}
</ul>
<div class="parentlink">
    <p class="text-center"><a href="{cms_selflink href=$page_alias}" class="button yellow tiny radius"><i class="fi-arrow-left"> Back to Gallery</i></a></p>
</div>
</div>
{/strip}

Please note the above uses CGSimplySmarty to give page numbers rather than just arrows. Remove it if you like.

Below is a version of the Gallery Tree template that works with Zurb.

Code: Select all

{strip}
    {if count($images) > 0}
        <ul class="galtree no-bullet small-block-grid-2 medium-block-grid-3 large-block-grid-4">
        {assign var='g_prevdepth' value=1}
        {foreach from=$images item=image name=img}
        
        {if $image->depth > $g_prevdepth}
        {repeat string='<ul class="galtree no-bullet small-block-grid-2 medium-block-grid-3 large-block-grid-4">' times=$image->depth-$g_prevdepth}
        {elseif $image->depth < $g_prevdepth}
        {repeat string="</li></ul>" times=$g_prevdepth-$image->depth}
       {* </li> *}
        {elseif $smarty.foreach.img.index > 0}</li>
        {/if}
        
            {if $image->depth == 1}
                {if $smarty.foreach.img.index == 0}        
                    </ul>
                {/if}

                <h2 class="subheader"><small>{$image->titlename}</small></h2>
            {else}
                    <li><a href="{$image->file}" title="{$image->titlename}"><img class="th" src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a><span>{$image->titlename}</span>
            {/if}
        {assign var='g_prevdepth' value=$image->depth}
        {/foreach}
        {repeat string="</li></ul>" times=$image->depth-1}
      {*  </ul> *}
    {/if}
{/strip}