This is specifically where I don’t want the image features/previews

Hi Ismael!

Finally returning back to this thread (it’s been a crazy couple of months!).

I’ve tried a couple of different plugins, including “Display Kitchen Sink” and the Advanced Editor Tools one you referenced. Nothing is helping get that darn kitchen sink back! :(

This is actually a problem on three of my websites but one is a very fresh, new site and has the issue, so I’ve provided that login in the private content below. Appreciate your attention to this!

Just wanted to say thank you! This works :)

Hi! Just checking in.

That worked in Quick CSS – only problem is now there’s just a LOT of space in between those sections. Essentially did the same thing I was thinking of doing by adding padding/whitespace, but doesn’t exactly solve the problem.

I am not sure if it applies but I do have a minimum height for that grid row set to 550px.

Perhaps there’s another Layout Element I can consider using instead of the Grid Layout? Although I do want that full width effect rather than the container effect. What about having two different versions – one grid row that I have set for desktop, one for mobile? I see there are pre-existing options to show/hide on Mobile, but if I were to recreate a Grid Element that only shows for desktop, would there be a way to do that on a custom element sort of way?

Thanks!

Hi Victoria,

I disabled Autoptimize and cleared my server cache, checked Enfold settings for any other settings as well but the issue still remains.

I’ve added access information to the private data in case you need to take a look!

That’s SO much better- thank you so much! The first code worked perfectly.

Price looks better! I’ll play around with it a little bit.

For the Product Widget thumbnail, I added that filter code you provided to the functions.php file – is that where I was supposed to add it? Either way – it didn’t work. That code ended up making ALL product thumbnails that size – and that doesn’t work for the rest of the website that displays the shop (for instance, the home page product feed and the shop page). I just need to fix the problem with the footer widget displaying products – if you look at any of the pages of the website you’ll see they are REALLY fuzzy.

When I inspect that element I still see coding forcing a 36px wide thumbnail – screenshot link in private notes. Not sure if that helps narrow it down.

Thanks!

This is great! I just have a couple of followup issues I was hoping you could help with:

1) When viewing on my computer/desktop, there is quite a lot of space between the Product Name and the Price. I think the price is lined up with the bottom of the thumbnail image, causing that to float down and look a little detached from the Product Name. It looks great on mobile, however!

2) I have three products displaying in my footer (link in Private Content), the first image for Canary Gold is showing up just fine – nice and clear. The next two are quite fuzzy and I can’t figure out why! This may not be related to the new code you provided – I think it’s been happening for a while (we just didn’t notice since the images were so small!). I regenerated thumbnails but that didn’t have an effect on anything. The images load up just fine on mobile and look great, so I’m baffled!

I’ve including login info just in case you need to poke around the back-end.

Thanks so much!

Link in the private content! Note that the only item affected so far is the single item under Breakfast Menu.

Thanks!

And, gosh, sorry one more thing. How do I make it so the bullet points appear on the List Item Description in the Catalogue?

Thanks again!

Update! Despite my cache clearing and multiple refreshing, the code I had for centering the Copyright line and social icons did end up working! Here’s what I used (in case anyone needs it for reference):

@media only screen and (max-width: 550px) {
  #top #footer .widget_nav_menu li {
    display: block;
  }

  #top #socket .container {
    text-align: center !important;
  }

  #top #socket .social_bookmarks, #socket .copyright {
    float: none;
    display: block;
    margin: 0 auto;
  }

  #top #socket .social_bookmarks {
    text-align: center !important;
  }

  #top #socket .social_bookmarks li {
    float: none;
    display: inline-block;
  }
}

However the centering is just a little off, it looks like maybe the socket Menu links aren’t quite centering and I’m wondering if there’s some adjusting I can do so it all evenly centers?

The other two questions remain as well. Thanks!

Hmm give it another go with the same user/password?

Yeah it’s weird – I can’t seem to get it to work even with the !important addition. I’ve included a link to the screenshot of the mouseover effect just to make sure we’re talking about the same thing! I don’t mind the actual mouseover effect, it’s that the thumbnail/featured image is slightly opaque before mousing over.

Thanks again!