Page 1 of 1

Slider for multiple pages

Posted: Wed Aug 06, 2014 12:03 pm
by 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.

Re: Slider for multiple pages

Posted: Wed Aug 06, 2014 1:27 pm
by 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.

Re: Slider for multiple pages

Posted: Wed Aug 06, 2014 1:51 pm
by 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!

Re: Slider for multiple pages

Posted: Wed Aug 06, 2014 4:28 pm
by Dr.CSS
Have you tried Album..?

Re: Slider for multiple pages

Posted: Thu Aug 07, 2014 12:56 am
by 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}