Displaying Subpages - Developer Example

TODO-UC: Explain how to render out the subpages (sub groups)

 

##
## UltraCart - Mr Teas Template
## http://www.ultracart.com/
##
## Copyright (c) 2015 BPS Info Solutions Inc.
## License located here:
## http://www.ultracart.com/storefront/license/
##
## Designed by Level 2 Design, LLC http://www.level2d.com/
##

## uc:child-page-multimedia-default-used="true"

<div class="product-list-images small four-up" data-equalizer>
  <ul>
    #set($subgroups = $group.getChildren())
    ## $formatHelper.sortByAttribute($subgroups, "sort_order", false)
    ## $formatHelper.removeItemsWithoutCost($subgroups)
    ## $formatHelper.removeOutOfStockItems($subgroups)

    ## Below manually sets the url segment that is used to construct the item path

    ## #set($subgroups = $formatHelper.getItemsForPage($subgroups, $page, 2))

    #foreach($group in $subgroups)

      <li class="group-children">
        #if($group.getDefaultMultimedia('Image') && $group.getDefaultMultimedia('Image').getThumbnail(220, 220, true, false))
          <a href="${baseUrl}${group.getPath()}" title="$group.getTitle()" class="product-photo">
            <strong>${group.getTitle()}</strong>
            <span class="link">View Category</span>

            <img src="${baseThumbnailUrl}${group.getDefaultMultimedia('Image').getThumbnail(220, 220, true, false)}" width="220" height="220" alt="$group.getTitle()" />
          </a>

        #else

        <a href="${baseUrl}${group.getPath()}" title="$group.getTitle()" class="product-photo">
          <strong>${group.getTitle()}</strong>
          <span class="link">View Category</span>

         <img src="$baseThemeUrl$theme.attr('Item No Image Available Image URL')" width="220" height="220" alt="$group.getTitle()" />
        </a>

        #end

        <div data-equalizer-watch class="panel product-info js-link-anchor-parent">
          <a href="${baseUrl}${group.getPath()}" title="" class="product-title">$group.getTitle()</a>
        </div>
      </li>
    #end

  </ul>
</div>