Search code examples
liquidbusiness-catalyst

Web Apps to display only certain web app items


Imagine we have a Web App that has a dropdown field called Location with the options Melbourne, Adelaide, Sydney etc.

It is possible to create a new Page with the Web App module on the page to display only the items that have the web app items that have the option "Melbourne" selected?

As in I only want to output only the web app items that have the Melbourne option selected onto the page. All of the other items (ones with Adelaide selected, Sydney selected etc.) to not display on the page? It should not even be in the source code either.

Is something like this possible with Liquid? I wished I knew more Liquid!

Because at the moment all I am doing is just:

{module_webapps id="123456" filter="all"}

And then just display:none; on the items I don't want to appear on the page, but this is not really ideal because even though you can't see it on the page, it can still be read in the source code.

I know this is possible using Classifications and then displaying the module with the classification but I do not want to use this method.


Solution

  • I've answered this on the Adobe BC Forums but for others who may find this via Google, here is the answer:

    You can do something like that with if statements in Liquid.

    This is the concept:

    <!-- Web App code, change to fit your needs (such as sortType, number per page, etc.) -->
    
    {module_webapps id="123456" filter="all" resultsPerPage="500" sortType="date" collection="location" template=""}
    
    <!-- FOR LOOP TO LOOP OVER THE COLLECTION -->
    
    {% for i in location.items -%}
    
      {% if i.['Location'] == 'Melbourne' -%}
    
          <!-- Now only web app items with the Location set to Melbourne will show below. -->
    
          <!-- Code for your web app item, for example:-->
    
          {{i.name}} - {{i.['Location']}}
    
      {% endif -%}
    
    {% endfor -%}
    

    Of course, you do not have to use a collection, you could put the if statement in any layout and it would work.