Announcement

Collapse
No announcement yet.

Mobile Category Image Size

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

    Mobile Category Image Size

    Can someone point me to what I need to change to change the size of my images on my mobile site? The images are really small and could easily be double or more bigger, which would make my mobile site a lot more friendly, IMHO. I have attached a screenshot.

    My site is: http://www.widgetsupply.com/

    tempFileForShare.jpg
    Thank you,
    John

    #2
    Re: Mobile Category Image Size

    In your mobile css file, look for ul#category-listing li img and change the max-width and max-height settings.

    Comment


      #3
      Re: Mobile Category Image Size

      You could enlarge your images and scarify the number of items per page. In case you are using imagemachine it shouldn't be too hard to do. Also vertical centering would help so the images aren't glued to the top.

      You can also look into an alternative method - going responsive without redoing your site. We apply this to your live site without taking it down - magic! Yep, this paragraph is actually an advertisement for our service :) Take a look at www.beltbuckleshop.com or www.mapsofthepast.com. Use a smart phone or tablet and then compare to desktop.
      Last edited by PCINET - Andreas; 10-24-14, 06:19 AM.
      Andreas Toman
      PCINET, LLC

      Miva Merchant Design, Development, Integration & Support
      We built over 200 Miva Merchant stores!
      Miva shopping cart design & integration service and see our Portfolio!


      e-mail: [email protected]
      web: www.pcinet.com
      LinkedIn: Andreas Toman
      phone: (786) 250-2056 (Miami, FL)

      Comment


        #4
        Re: Mobile Category Image Size

        Originally posted by Leanne View Post
        In your mobile css file, look for ul#category-listing li img and change the max-width and max-height settings.
        tempFileForShare.jpg
        I really appreciate it.

        I do have one more question that hopefully has an easy answer. I changed my max width to 100px. However, some products are taller than wide, so this makes the image column uneven. Is there an easy way to make all of the image spaces be 100px wide and horizontally centered. I have attached an image to show what I am talking about.
        Thank you,
        John

        Comment


          #5
          Re: Mobile Category Image Size

          Oops. I know I probably need to edit this:

          ul#category-listing li img{
          display:block;
          margin:0 auto;
          max-width:100px;
          max-height:125px;
          padding:0 5px 0 0;
          }
          Thank you,
          John

          Comment


            #6
            Re: Mobile Category Image Size

            use also a min-width for the container holding the img tag. This way you achieve a even layout.
            Andreas Toman
            PCINET, LLC

            Miva Merchant Design, Development, Integration & Support
            We built over 200 Miva Merchant stores!
            Miva shopping cart design & integration service and see our Portfolio!


            e-mail: [email protected]
            web: www.pcinet.com
            LinkedIn: Andreas Toman
            phone: (786) 250-2056 (Miami, FL)

            Comment


              #7
              Re: Mobile Category Image Size

              If you're using the stock mobile, there is no container around just the image. You can add one if you look for the image thumbnail within the product foreach loop on MBL-CATTREE (two places) and then style it with a min-width (and you'll probably have to float your container left also).

              Comment

              Working...
              X