Slightly annoying little bug I found using BigCommerce's Stencil Framework. When you have multiple Marketing banners set to the same location in your theme, the standard way to display them all is just {{{banners.bottom}}} (the newest version of Cornerstone uses {{{limit banners.bottom 1}}} to display one of the banners). The dumb bug is that this outputs all the different Banner HTML as a comma seperated list.
The Issue
if you have three banners set to show in the bottom location of a specific page (in my case, the home page), {{{banners.bottom}}} outputs as:
<<BANNER CONTENT>>
,
<<BANNER CONTENT>>
,
<<BANNER CONTENT>>
The Fix
Instead of just outputting the banners with {{{banners.bottom}}} we're going to iterate through them and output them on their own. Check it out:
{{#each banners.bottom}}
<div class="banner--bottom">
{{{this}}}
</div>
{{/each}}
which would output as:
<div class="banner--bottom">
<<BANNER CONTENT>>
</div>
<div class="banner--bottom">
<<BANNER CONTENT>>
</div>
<div class="banner--bottom">
<<BANNER CONTENT>>
</div>
Ta-Daaa! Clean, comma-free banners. Let me know if this helped you at all.
