Filterable Portfolio

299 Posts

jisaac Reply #11, 12 years ago

For the sorter/filer, I need to place my tags inside of the getResources template. I tried [[+tag]] and [[+group_name]] as well as [[+tv.tag]] and [[+tv.group_name]]. How do we display the tags (or in my case place them within the class) inside of the getResources output template?

discuss.answer

299 Posts

jisaac Reply #12, 12 years ago

Okay, finally got this working though I am not sure it is the best method:

getResources Call:

[[!getResources?
&parents=`120,164,405,97,436`
&tpl=`productGrid`
&depth=`2`
&showHidden=`0`
&limit=`48`
&includeTVs=`1`
&processTVs=`1`
&includeContent=`1`
&sortby=`RAND()`
&where=`[[!TaggerGetResourcesWhere? &where=`{"isfolder": 1}` ]]`
]]

getResources Template:

<div class="col-lg-4 col-sm-4 col-md-4 col-xs-12 [b][[!TaggerGetTags? &resources=`[[+id]]` &rowTpl=`tagList` ]][/b]">
					<div class="portfolio_item">
                        <div class="entry">
                            <img src="[[+tv.pageImage]]" alt="" class="img-responsive">
                            <div class="magnifier">
                                <div class="buttons">
                                    <a class="st btn btn-default" rel="bookmark" href="[[~[[+id]]]]">View</a>
                                    <a href="[[~[[+id]]]]"><h3>[[+pagetitle]] [[+tv.tagsz]]</h3></a>
                                </div><!-- end buttons -->
                            </div><!-- end magnifier -->
                        </div><!-- end entry -->
<a href="[[~[[+id]]]]"><h3 style="text-align:center">[[+pagetitle]]</h3></a>
                    </div><!-- end portfolio_item -->
                </div><!-- end col-lg-4 -->

I wish I could find out how to place the Tagger Tag or specifically the Alias here rather than using another db call. But it works. If you have a suggestion or idea, I would greatly appreciate it.

416 Posts

Terry Reply #13, 12 years ago

Here's what I did.

List of tags / filters at top of page:

<ul id="filters" class="option-set clearfix" data-option-key="filter">
    <li><a class="selected" href="#filter" data-option-value="*" >All</a></li>
    [[!tagLister? &tv=`tag` &tvDelimiter=` ` &tpl=`taglisttpl-isotope` ]]
</ul>

GetResources call on the page to display all filterable items:

[[!getResources? &parents=`38` &tpl=`project-summaryitemtpl-hover-grid-isotope` &includeTVs=`1` &processTVs=`1` &sortbyTV=`featuredimage` &sortdirTV=`DESC` &includeContent=`1` &limit=`99` &hideContainers =`1` ]]

Tpl for each item:

[[+tv.squareimage:notempty=`

<div class="box project-item [[+tv.tag]]" data-category="[[+tv.tag]]">

  <div class="project-summaryitem boxgrid slidedown clearfix" >
    [[+tv.squareimage]]
    <div class="cover clearfix">
      <div class="cover-inner-background"></div>
      <div class="cover-inner-content">
        <a href="[[~[[+id]]]]" title="[[+pagetitle]]">
        <h3>[[+pagetitle]]</h3>
        <p class="location">[[+tv.location]]</p>
        <p>[[+introtext]]</p>
        </a> 
        <p class="readmore"><a href="[[~[[+id]]]]"><span>Read More</span></a></p>
      </div>
    </div>
  </div>
  <div class="shadow"></div>
</div>

`]]

Answered Filterable Portfolio