Announcement

Collapse
No announcement yet.

Achieving CATTREE Functionality with Toolkit

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Achieving CATTREE Functionality with Toolkit

    I've been at this all day and have tried everything I can think of or have dug up on the forums. For whatever reason, probably my lack of understanding, I just can't get the category tree to behave the way I need it to. Similar to CATTREE, I need it to display the parent categories on any page I have it and then only the subcategories for whatever parent is selected as you move down the tree. The catch that won't allow CATTREE to work is that I've set up a "Shop by Category" and "Shop by Brand" since I'll be using two category trees as illustrted below...

    Shop by Category

    Category One
    -Subcat One
    --Subsubcat One
    Category Two

    Shop by Brand

    Brand One
    Brand Two
    Brand Three

    I've managed to get it to function as desired down through 'Subcat One' but as soon as a 'Subsubcat' is selected the tree defaults back to showing only the top level categories (Category One, Category Two, etc.). I can see why it is doing it in the code but I can't figure out a way around it. Below is my starting point, or at least what I revert to when attempting the next change.

    Code:
    <mvt:item name="toolkit" param="sassign|onecat|shop-categories" />
    <mvt:item name="toolkit" param="subcat|ccount|g.onecat" />
    <mvt:foreach iterator="sub_category" array="sub_categories">
    <strong>&mvt:sub_category:name;</strong><br />
        <mvt:if expr="g.Category_Code EQ l.settings:sub_category:code">
            <mvt:item name="toolkit" param="subcat2|ccount2|l.all_settings:sub_category:code" />
            <mvt:if expr="ccount2 GT 0">
                <mvt:foreach iterator="sub_category2" array="sub_categories2">
                - &mvt:sub_category2:name;<br />
                    <mvt:if expr="g.Category_Code EQ l.settings:sub_category2:code">
                        <mvt:item name="toolkit" param="subcat3|ccount3|l.all_settings:sub_category2:code" />
                        <mvt:if expr="ccount3 GT 0">
                            <mvt:foreach iterator="sub_category3" array="sub_categories3">
                                - - &mvt:sub_category3:name;<br />
                            </mvt:foreach>
                        </mvt:if>
                    </mvt:if>
                </mvt:foreach>
            </mvt:if>
        </mvt:if>
    </mvt:foreach>
    I'm really hoping someone can steer me in the right direction. I did think up a solution using CATTREE but it is ugly
    and prone to major problems later on if categories are changed, which they most certainly will be.

    Thanks,
    Tim

    #2
    Re: Achieving CATTREE Functionality with Toolkit

    Update: I never did get this to work with toolkit as I had hoped but I was able to work out a compromise using CATTREE. It's probably not the most elegant solution but it works exactly as desired across all pages.

    It uses a combination of static Level 2 lists and page/category checking to determine what to display. If it's not a category page or is in a certain part of the CATTREE it will display each list accordingly. The two Level 1 links that will continue to show by default are just removed with CSS.

    Below is the code I ended up with. Hopefully it will help someone in the same situation get started down the path to their solution.

    Code:
    <div id="categories">
        <div class="inner">
            <mvt:if expr="g.Screen NE 'CTGY' OR l.settings:category:id EQ 17 OR l.settings:category:cattree_parent_id EQ 17">
                <a class="level-2" href="http://www.domain.com/ctgy/level2-prodcat.html">Level 2 Product Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-prodcat.html">Level 2 Product Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-prodcat.html">Level 2 Product Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-prodcat.html">Level 2 Product Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-prodcat.html">Level 2 Product Category</a>
            <mvt:else>
                <mvt:foreach array="cattree_categories" iterator="cattree_category">
                    <mvt:if expr="l.settings:category:id EQ 23 OR l.settings:category:cattree_parent_id EQ 23 OR l.settings:cattree_categories[2]:parent_id EQ 23">
                        <mvt:if expr="NOT ISNULL l.settings:category:id AND l.settings:category:id EQ l.settings:cattree_category:id">
                        <a href="&mvte:cattree_category:link;" class="level-&mvte:cattree_category:level;">&mvte:cattree_category:name;</a>
                        <mvt:elseif expr="NOT ISNULL g.Category_Code AND ISNULL l.settings:category:id AND l.settings:cattree_category:code EQ g.Category_Code">
                        <a href="&mvte:cattree_category:link;" class="level-&mvte:cattree_category:level;">&mvte:cattree_category:name;</a>
                        <mvt:else>
                        <a href="&mvte:cattree_category:link;" class="level-&mvte:cattree_category:level;">&mvte:cattree_category:name;</a>
                        </mvt:if>
                    </mvt:if>
                </mvt:foreach>
            </mvt:if>
        </div>
    </div>
    <div id="brands">
        <div class="inner">
            <mvt:if expr="g.Screen NE 'CTGY' OR l.settings:category:id EQ 23 OR l.settings:category:cattree_parent_id EQ 23 OR l.settings:cattree_categories[2]:parent_id EQ 23">
                <a class="level-2" href="http://www.domain.com/ctgy/level2-brandcat.html">Level 2 Brand Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-brandcat.html">Level 2 Brand Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-brandcat.html">Level 2 Brand Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-brandcat.html">Level 2 Brand Category</a>
                <a class="level-2" href="http://www.domain.com/ctgy/level2-brandcat.html">Level 2 Brand Category</a>
            <mvt:else>
                <mvt:foreach array="cattree_categories" iterator="cattree_category">
                    <mvt:if expr="l.settings:category:id EQ 17 OR l.settings:category:cattree_parent_id EQ 17">
                        <mvt:if expr="NOT ISNULL l.settings:category:id AND l.settings:category:id EQ l.settings:cattree_category:id">
                        <a href="&mvte:cattree_category:link;" class="level-&mvte:cattree_category:level;">&mvte:cattree_category:name;</a>
                        <mvt:elseif expr="NOT ISNULL g.Category_Code AND ISNULL l.settings:category:id AND l.settings:cattree_category:code EQ g.Category_Code">
                        <a href="&mvte:cattree_category:link;" class="level-&mvte:cattree_category:level;">&mvte:cattree_category:name;</a>
                        <mvt:else>
                        <a href="&mvte:cattree_category:link;" class="level-&mvte:cattree_category:level;">&mvte:cattree_category:name;</a>
                        </mvt:if>
                    </mvt:if>
                </mvt:foreach>
            </mvt:if>
        </div>
    </div>
    Feel free to chime in and add to it if you know of a better or cleaner way to achieve the same result.

    Thanks,
    Tim

    Comment


      #3
      Re: Achieving CATTREE Functionality with Toolkit

      I had a similar dilemma but took a slightly different route.


      <table width="240" border="0" cellpadding="0" cellspacing="0">
      <mvt:foreach array="cattree_categories" iterator="cattree_category">
      <tr><td>
      <mvt:if expr="l.settings:cattree_category:code EQ g.Category_Code">
      <mvt:if expr="(l.settings:cattree_category:code EQ 'products') OR (l.settings:cattree_category:code EQ 'brands') OR (l.settings:cattree_category:code EQ 'services')">
      <div style="padding-left:2px; padding-top:12px; border-bottom:1px dashed grey;">
      <mvt:else>
      <div class="level-&mvte:cattree_category:level;-active">
      </mvt:if>
      <mvt:else>
      <mvt:if expr="(l.settings:cattree_category:code EQ 'products') OR (l.settings:cattree_category:code EQ 'brands') OR (l.settings:cattree_category:code EQ 'services')">
      <div style="padding-left:2px; padding-top:12px; border-bottom:1px dashed grey; text-align:left;">
      <mvt:else>
      <div class="level-&mvte:cattree_category:level;">
      </mvt:if>
      </mvt:if>
      <mvt:if expr="(l.settings:cattree_category:code EQ 'products') OR (l.settings:cattree_category:code EQ 'brands') OR (l.settings:cattree_category:code EQ 'services')">
      <a href="&mvte:cattree_category:link;" style="text-decoration:none;"><font color="white" size="+2"><b>&mvte:cattree_category:name;</b></font></a>
      <mvt:else>
      <a href="&mvte:cattree_category:link;"><mvt:if expr="l.settings:cattree_category:code EQ g.Category_Code">
      <img src="graphics/00000001/greenarrow.jpg" align="absmiddle">
      </mvt:if>&mvte:cattree_category:name;</a>
      </mvt:if>
      </div>
      </td></tr>
      </mvt:foreach>
      </table>

      All of the categories that look like level 2 categories are actually level 1 categories and i apply different styling to the one that I want to be my section headers.

      I could have done all the styling with css but was lazy.
      Last edited by jbart; 02-14-14, 12:29 PM.

      Comment

      Working...
      X