Announcement

Collapse
No announcement yet.

Displaying assigned category cattree images

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

  • Displaying assigned category cattree images

    I would like to convert this code to display the Category Tree images instead of the Category title images. I'm thinking it can't be that hard. Maybe change the g.Module_Root to /modules/component/cmp-cssui-cattree.mvc but then what is the value? Or is that even how to do it? It used to be so easy with the Toolkit.


    Code:
        <section class="t-expanded-block">
        <div class="t-storefront-featured-products t-defer-object" data-defer>
    
        <mvt:assign name="g.category_code" value="'my_category_code'" />
     <mvt:do name="l.result" file="g.Module_Library_DB" value="Category_Load_Code( g.Category_Code, l.settings:current_category )" />
    
     <mvt:do name="l.result" file="g.Module_Library_DB" value="CategoryList_Load_Parent( l.settings:current_category:id, l.settings:sub_categories )" />
        <div class="x-product-list x-product-list--slicked t-storefront-featured-product-list" data-hook="featured-products">
    
     <mvt:foreach iterator="subcat" array="sub_categories">
         <mvt:do file="g.Module_Root $ '/modules/component/cmp-cssui-cattitle.mvc'" name="l.success" value="CSSUI_CatTitle_Load(l.settings:subcat:id, l.settings:subcat:title_image)" />
    
    <div class="u-text-center x-product-list__item">
    
                    <a class="u-block u-color-black x-product-list__link" href="/&mvt:subcat:code;.html">
                        <figure class="x-product-list__figure">
                                <picture class="x-product-list__picture">
        <img class="x-product-list__image" data-lazy="&mvt:subcat:title_image:image;" src="" alt="&mvt:subcat:name;">    
    &mvt:subcat:image;                            
                                </picture>        
       <figcaption class="x-product-list__figure-caption">
                                <span class="x-product-list__name">&mvt:subcat:name;</span>
           </figcaption>
                            </figure>
                        </a>
        </div>
    </mvt:foreach>
            </div>
        </div>
            </section>
    Leslie Kirk
    Miva Certified Developer
    Miva Merchant Specialist since 1997
    Previously of Webs Your Way
    (aka Leslie Nord leslienord)

    Email me: [email protected]
    www.lesliekirk.com

    Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

  • Hi Leslie,

    You could adapt the code used on the category page to display the subcategories as it pulls in the category tree image.
    Matt Zimmermann
    Director of UI/UX
    / Miva, Inc.

    Comment


    • Originally posted by Matt Zimmermann View Post
      Hi Leslie,

      You could adapt the code used on the category page to display the subcategories as it pulls in the category tree image.
      Sigh...I'm trying to learn how to continue converting simple easy to understand Toolkit coding to all of this "do" stuff.

      So there is no "easy" way to pull in the sub cattree image instead of the subcat title image for a specific parent category?

      I was really hoping there was some equivalent for just this line

      Code:
      <mvt:do file="g.Module_Root $ '/modules/component/cmp-cssui-cattitle.mvc'" name="l.success" value="CSSUI_CatTitle_Load(l.settings:subcat:id, l.settings:subcat:title_image)" />
      So, are you referring to this code?

      Code:
          <mvt:assign name="l.settings:subcategory_count" value="miva_array_elements(l.settings:subcategories)" />
      
                  <mvt:foreach iterator="subcategory" array="subcategories">
                      <div class="u-text-center t-subcategory-navigation__item">
                          <a class="u-block u-color-black t-subcategory-navigation__link" href="&mvte:subcategory:link;">
                              <figure class="t-subcategory-navigation__figure">
                                  <mvt:if expr="l.settings:subcategory:image">
                                      <!-- Image: 240x315 -->
                                      <picture class="t-subcategory-navigation__picture">
                                          <img class="t-subcategory-navigation__image" data-lazy="&mvte:subcategory:image;" src="" alt="&mvte:subcategory:name;">
                                      </picture>
                                  </mvt:if>
                                  <figcaption class="t-subcategory-navigation__figure-caption">
                                      <span class="t-subcategory-navigation__name">&mvte:subcategory:name;</span>
                                  </figcaption>
                              </figure>
                          </a>
                      </div>
                  </mvt:foreach>


      Leslie Kirk
      Miva Certified Developer
      Miva Merchant Specialist since 1997
      Previously of Webs Your Way
      (aka Leslie Nord leslienord)

      Email me: [email protected]
      www.lesliekirk.com

      Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

      Comment


      • Hi Leslie,

        I am not aware of a function like that, but there may be something in the LSK I've missed...it's quite a beast to search through.
        Matt Zimmermann
        Director of UI/UX
        / Miva, Inc.

        Comment


        • Originally posted by Matt Zimmermann View Post
          Hi Leslie,

          I am not aware of a function like that, but there may be something in the LSK I've missed...it's quite a beast to search through.
          Yeah - I've tried to search through the stuff posted in the developer docs. That's why I am stuck. I could easily do this with Toolkit code but...
          Leslie Kirk
          Miva Certified Developer
          Miva Merchant Specialist since 1997
          Previously of Webs Your Way
          (aka Leslie Nord leslienord)

          Email me: [email protected]
          www.lesliekirk.com

          Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

          Comment


          • I got it!


            Code:
            <section class="t-expanded-block">
                <div class="t-storefront-featured-products t-defer-object" data-defer>
            
                <mvt:assign name="g.category_code" value="'my_category_code'" />
             <mvt:do name="l.result" file="g.Module_Library_DB" value="Category_Load_Code( g.Category_Code, l.settings:current_category )" />
            
             <mvt:do name="l.result" file="g.Module_Library_DB" value="CategoryList_Load_Parent( l.settings:current_category:id, l.settings:sub_categories )" />
                <div class="x-product-list x-product-list--slicked t-storefront-featured-product-list" data-hook="featured-products">
            
             <mvt:foreach iterator="subcat" array="sub_categories">
                 <mvt:do file="g.Module_Root $ '/modules/component/cmp-cssui-cattree.mvc'" name="l.success" value="CSSUI_CatTree_Load(l.settings:subcat:id, l.settings:subcat:tree_image)" />
            
            <div class="u-text-center x-product-list__item">
            
                            <a class="u-block u-color-black x-product-list__link" href="/&mvt:subcat:code;.html">
                                <figure class="x-product-list__figure">
                                        <picture class="x-product-list__picture">
                <img class="x-product-list__image" data-lazy="&mvt:subcat:tree_image:image;" src="" alt="&mvt:subcat:name; ">                           
                                        </picture>        
               <figcaption class="x-product-list__figure-caption">
                                        <span class="x-product-list__name">&mvt:subcat:name;</span>
                   </figcaption>
                                    </figure>
                                </a>
                </div>
            </mvt:foreach>
                    </div>
                </div>
                    </section>
            Leslie Kirk
            Miva Certified Developer
            Miva Merchant Specialist since 1997
            Previously of Webs Your Way
            (aka Leslie Nord leslienord)

            Email me: [email protected]
            www.lesliekirk.com

            Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

            Comment

            Working...
            X

            This website uses cookies to identify visitors, track visitors to our website, store login session information and to remember your user preferences. By continuing to use this site you agree to our use of cookies. Learn More.

            This website uses cookies. By continuing to use this site you agree to our use of cookies. Learn More.

            Accept