Announcement

Collapse
No announcement yet.

How To Tell Customers There Are Multiple Colors Available On Category Page

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

    How To Tell Customers There Are Multiple Colors Available On Category Page

    Hi everyone:

    On the category page, I would like to tell our customer that a product is available in multiple colors (not JUST the color shown as the thumbnail on the category page).

    Is there an easy way to do this more or less automatically?

    My thumbnail images on my category pages are relatively small (only 158 X 202 px), so if I write on the thumbnail image itself "More colors available" there really won't be much of the image visible underneath the text.

    Thanks in advance for sharing your ideas and solutions.
    Mark Romero
    ~~~~~~~~

    #2
    Re: How To Tell Customers There Are Multiple Colors Available On Category Page

    Create an "icon" you can put on the thumbnail. We do it for pens with blue ink. Our products are small enough we can usually show most of what's available. The thumbs are 150 x 225.

    http://promotional-pens.pensrus.com/BIC-PENS.html

    Comment


      #3
      Re: How To Tell Customers There Are Multiple Colors Available On Category Page

      Originally posted by Siamese-Dream.Com View Post
      Hi everyone:

      On the category page, I would like to tell our customer that a product is available in multiple colors (not JUST the color shown as the thumbnail on the category page).

      Is there an easy way to do this more or less automatically?

      My thumbnail images on my category pages are relatively small (only 158 X 202 px), so if I write on the thumbnail image itself "More colors available" there really won't be much of the image visible underneath the text.

      Thanks in advance for sharing your ideas and solutions.
      If you are using the attribute machine with swatch select you can display them on the category page.
      http://www.vermontgear.com/womens-sh...irts-tops.html
      Mark Hood
      Vermont Gear

      Comment


        #4
        Re: How To Tell Customers There Are Multiple Colors Available On Category Page

        Did not even know that the attribute machine was available for the category page... Does it work on both CSSUi AND MMUI stores?
        Mark Romero
        ~~~~~~~~

        Comment


          #5
          Re: How To Tell Customers There Are Multiple Colors Available On Category Page

          Originally posted by Siamese-Dream.Com View Post
          Did not even know that the attribute machine was available for the category page... Does it work on both CSSUi AND MMUI stores?
          I seem to remember having it work with MMUI as well but I'm not 100%

          It's really just different page template item names I believe. basic beginining is assigning attribute machine and including <mvt:item name="attributemachine" param="head" /> in the ctgy head template. and I have this <mvt:item name="attributemachine" param="body" /> before the global header

          On the attribute machine tab make sure ctgyswatches_%product_id% is in the swatch element spot.

          add the product attribute item and wrap it with css that hides it. <p class="hidden"> </p>


          this is part of my ctgy product list layout
          Code:
          <div class="category-item"><div class="item-image">
          <a href="&mvte:product:link;"><img id="main_image_&mvte:product:id;" class="img-responsive" src="http://www.yourdomain.com/&mvt:product:image;" alt="&mvt:product:name;" /></a>
          <div id="ctgyswatches_&mvte:product:id;" class="ctgyswatches"></div>
          <mvt:item name="category_listing_imagemachine" param="body:product:id" />
          <form>
          <input type="hidden" name="Action" value="ADPR">
          <input type="hidden" name="Screen" value="BASK">
          <input type="hidden" name="Store_Code" value="&mvte:store:code;">
          <input type="hidden" name="Product_Code" value="&mvte:product:code;">
          <input type="hidden" name="Category_Code" value="&mvte:global:category_code;">
          <mvt:item name="product_attributes" param="product:id" />
          </form>
          <mvt:item name="attributemachine" param="body" />
          </div>
          sorry for the bad directions but it should be a start
          Mark Hood
          Vermont Gear

          Comment


            #6
            Re: How To Tell Customers There Are Multiple Colors Available On Category Page

            css for the ctgyswatches
            Code:
            .ctgyswatches li span{display:block;
            
            }
            .ctgyswatches li img{
            max-height:20px;
            max-width:20px;
            margin:0;
            padding:0;
            }
            
            .ctgyswatches li{
            display:inline-block;
            
            width:22px;
            height:22px;
            list-style:none;
            margin:0;
            padding:0;
            border:1px solid #eeeeee;
            cursor:pointer; }
            Mark Hood
            Vermont Gear

            Comment


              #7
              Re: How To Tell Customers There Are Multiple Colors Available On Category Page

              Thanks so much for the code samples, mark;

              been so busy here trying to multitask that I really don't know if I am coming or going. Your code samples are going to be a big help.
              Mark Romero
              ~~~~~~~~

              Comment


                #8
                Re: How To Tell Customers There Are Multiple Colors Available On Category Page

                Originally posted by Siamese-Dream.Com View Post
                Thanks so much for the code samples, mark;

                been so busy here trying to multitask that I really don't know if I am coming or going. Your code samples are going to be a big help.
                happy to help if you get stuck but i just realized I messed this up on you

                "It's really just different page template item names I believe. basic beginining is assigning attribute machine and including <mvt:item name="attributemachine" param="head" /> in the ctgy head template. and I have this <mvt:item name="attributemachine" param="body" /> before the global header"

                This
                <mvt:item name="attributemachine" param="body" /> goes before the footer on the ctgy page template
                Mark Hood
                Vermont Gear

                Comment


                  #9
                  Re: How To Tell Customers There Are Multiple Colors Available On Category Page

                  Just a side note if you haven't seen it yet... coming in version 9 is some awesome ability to deal with multiple color product attributes as far as uploading the image once to all the sizes right from the attribute adding page.
                  Mark Hood
                  Vermont Gear

                  Comment


                    #10
                    Re: How To Tell Customers There Are Multiple Colors Available On Category Page

                    The Lasker's did a nifty code for us, in a "quick view", that displays a little icon if color attribute = COLORNAME, then color swatch with that html color code... so a bunch of little squares for each color available.

                    Comment

                    Working...
                    X