Hi Everyone,
I am trying to use the Jquery Serial Scroll plug in by Ariel Fleshier to scroll recent article listings on my agency’s (emergebrands) website and cannot find a way to slide groups of three articles at a time.
What I started out was with this as a basic slider...
Template Code:
<div id="screen">
<img class="prev" src="
http://www.emergebrands.com/images/backarrow.png" alt="prev" width="46" height="261" />
<div id="sections">
<ul>
[*content*]
<ul>
</div>
<img class="next" src="
http://www.emergebrands.com/images/forwardarrow.png" alt="next" width="46" height="261" />
</div>
Ditto Call (Content of whatever page)
[!Ditto? &startID=`NUMBERS HERE` &sortBy=`createdon` &display=`10` &tpl=`recentArticlesTPL`!]
Chunk Code:
<li class="sub" id="[+alias+]">
<div class="summary" style="width: 960px; height: 640px; background: url(
http://www.emergebrands.com/[+articlePhoto+]) no-repeat;">
<div class="summaryBlock">
<h2>[+pagetitle+]</h2>
<p>[+introtext+]</p>
<p><a href="[~[+id+]~]" class="readMore">Read More >></a></p>
</div>
</div>
</li>
(In my articles template I created a TV for a thumbnail and large background photo. That’s why you’ll see a place holder for that up there.) The summary block contains intro text and the link to each individual article.
This works well for sliding one thing at a time. What I want to do is take it one step further and use the same concept to scroll all articles under a category or the whole site in groups of 3’s. So I created the below chunk but my problem is that I have no clue how to call three items at once since I can only call one chunk as the TPL, and I cannot duplicate placeholders in the chunk since it will just show the same content 3 times.
<li class="sub">
<div class="photoContainer">
<p><img src="
http://www.emergebrands.com/[+articleThumbnail+]" height="95" width="95" />
</div>
<h4><a href="[~[+id+]~]">[+pagetitle+]</a></h4>
<p>[+introtext+]</p>
<p>by:[+author+] on [+date+] </p>
<br class="clearfix" />
</li>
The only viable solution that I found was to call the above chunk via ditto, display three, and paginate them. That worked but the entire page has to reload and that goes against the logic for the concept to begin with.
Does anyone have any ideas?
