Announcement

Collapse
No announcement yet.

How to get thumbnails to size to 175 and not 170 on homepage and category pages?

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

  • How to get thumbnails to size to 175 and not 170 on homepage and category pages?

    Here I am working on Thanksgiving before I have to start cooking LOL. So Happy Thanksgiving to you!

    Hoping someone can help me out. I used to have smaller thumbnails at a max of 150 pixels that were not square or uniform height and width so it looks rather unprofessional. Most of the new websites have larger ones that are always uniform. So I have been manually re-doing my thumbnails to be 175x175 square which I thought should still fit the template. The thumbnails show up fine at 175x175 in the left column for new products etc. but for the homepage and category pages they are stuck displaying at 170x170 for some reason. This makes them slightly blurry. I set the thumbnails size in admin to 175x175 but that did not make a difference. I've tried searching the HTML and CSS for the code capping them at 170 and I cannot find it. Anyone know how I can allow 175x175 thumbnail max size? I am using Shaun's responsive layout mod so I am unsure if that has anything to do with it?

    Thank you,
    Dana

  • #2
    go to your css and adjust this rule:

    .product-item .img {
    max-width: 100%;
    min-height: 170px;
    position: relative;
    margin-bottom: 10px;
    text-align: center;
    }


    The max-height of this block is what is restricting the size
    TheCartDesigner.com
    Not 3dcart Owned or Operated
    100% Independent 3dcart Expert


    Follow Us on Twitter

    Comment


    • #3
      Thanks Shaun! Happy Thanksgiving!

      I think I am having the layout.css file refuses to update problem. I changed that line from 170 to 175 in layout.css in admin, cleared cache and it refuses to update. It shows as 175 in admin but its still 170 on the server and when you pull it up in the browser. I tried cheating and editing it in filezilla and that was not allowed either. I am guessing I need to add this to the default modified CSS somewhere to get it to stick? I tried adding it to the bottom and that didn't work so I just reverted back to the last edit you made. =)

      Comment


      • #4
        Danab You cannot modify layout.css. You can only override styles of layout.css in your active stylesheet. after adding the styles to default modified, make sure to clear browsers cache to see the changes. If you don't see the changes after clearing cache, try to add (!important) to min-height just like this.

        .product-item .img {
        min-height: 170px !important;
        }

        Happy Thanksgiving.
        tangopixel.com
        Website Design and Development

        Comment


        • #5
          Danab

          It is correct that you need to add the rule to your active css file. However there is 0 reason why you would ever need to add "!important" to the rule since default_modified.css rules overwrite common css files including layout.css

          If you can email me an updated login I will hop in and get you fixed up, if you are concerned about adding it.
          TheCartDesigner.com
          Not 3dcart Owned or Operated
          100% Independent 3dcart Expert


          Follow Us on Twitter

          Comment


          • #6
            well, there could be plenty of reasons to add important to a rule when they already mentioned that they added styles to the bottom of their active CSS and it did not work. If it's not cached, then you need important to override any inline styles or styles targeted by their parent element in the CSS file. you can either fix them in your active CSS or override using important if you adding a new rule. If I have the link to the website, I can exactly tell what to add, where to add and if they need important or not but in this case clearing cache and if not important will work.
            tangopixel.com
            Website Design and Development

            Comment


            • #7
              Shaun,

              I sent you the password reset request. I tried putting it at the bottom again this morning and I guess I don't have the magic touch LOL. I don't want to screw up the responsive layout by mucking around too much after you got it perfect. I think the extra 5 pixels should fit vertically without having to adjust anything else but I haven't gotten the change to stick to check.

              Thanks so much!
              Dana

              Comment


              • #8
                Danab

                Hey Dana, Got it, I will be in there shortly.

                cartexpert

                Atif, Since I know the css file that is active on the store I can guarantee you that there is 0 reason to use important which should only be used only if absolutely necessary and not just so you can find away around something that you can't get work, I thought 3dcart's Developers knew that... But maybe I am wrong. Any which way it does need to be addressed properly.
                Last edited by thecartdesigner; 11-24-2017, 02:14 PM.
                TheCartDesigner.com
                Not 3dcart Owned or Operated
                100% Independent 3dcart Expert


                Follow Us on Twitter

                Comment


                • #9
                  Shaun you are awesome! I really appreciate the help. Hubby would probably leave for the weekend if I had to redo all those photos to 170 LOL. Thank you so much for the help. I sent a little something to you. /cheers =)

                  Dana

                  Comment


                  • #10
                    Hi Dana,

                    You are very welcome and I appreciate it. Back to thanksgiving leftovers I go...lol
                    TheCartDesigner.com
                    Not 3dcart Owned or Operated
                    100% Independent 3dcart Expert


                    Follow Us on Twitter

                    Comment


                    • #11
                      thecartdesigner If you check my comments, you will realize that I have mentioned when to use important. But I guess the issue is not when to use important, Issue is why I said that lol.
                      By the way, it's not Atif here. I don't think he has time to discuss CSS rules but I will give him your message for sure. Happy Thanksgiving from me and him :)
                      tangopixel.com
                      Website Design and Development

                      Comment


                      • #12
                        Unfortunately I have a difference of opinion of your explained usage, however my comment was based on your initial posted suggestion. No need to comment further, thanks
                        TheCartDesigner.com
                        Not 3dcart Owned or Operated
                        100% Independent 3dcart Expert


                        Follow Us on Twitter

                        Comment

                        Working...
                        X