How do I change the thumbnails back to the way they were?

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket

Author

Posts
May 14, 2019 at 1:49 am #486254

tinamama
Expired Member

Post count: 317

I recently started working with the Supreme Directory theme after being away for some months…it’s since updated to V2, I see…and now I don’t like the way the thumbnails on the homepage look. I prefer the way they looked before. The way they look now there’s now a bar across them that takes up so much of the space, you can barely see the image! Before there was no bar. How do I change them back? I’ve attached before and after screenshots. I found the before shot on a demo page of the theme. I want them to look like that again…how do I do that?

May 14, 2019 at 2:22 am #486260

tinamama
Expired Member

Post count: 317

Ok, I figured out that this is the popular categories icon. Just found info here on how to adjust some of the features: https://wpgeodirectory.com/docs-v2/themes/supreme/#popular
But the bar doesn’t appear to be something I can change.

ALSO, I just discovered that I can use fontawesome icons or if I use my own, it’s tiny. I prefer to use my own.. so how do I adjust the size? The images I uploaded for the map icons are much bigger than is showing on the homepage popular categories. So how do I adjust what is showing? I think I could live with the bar if I could just adjust the icons size…and in at least one case, the icon is too low and hitting below the bar. Perhaps making it bigger would fix this.

May 14, 2019 at 2:55 pm #486406

Alex Rollin
Moderator

Post count: 27815

You can use custom CSS to change most display features.

Please post the page url in a private reply and we will share an example.

May 15, 2019 at 7:52 pm #486729

tinamama
Expired Member

Post count: 317

This reply has been marked as private.

May 26, 2019 at 11:26 pm #489095

tinamama
Expired Member

Post count: 317

How do I edit the word stripe? It’s covering the icon. I’m not good with CSS.

May 27, 2019 at 9:03 am #489146

Alex Rollin
Moderator

Post count: 27815

I don’t see the word on that page. Help?

May 27, 2019 at 5:22 pm #489300

tinamama
Expired Member

Post count: 317

The black stripe behind the words on the category icons on the homepage. It wasn’t there before…a recent update added it, apparently… If you scroll up to my before and after pics you can see how they used to look, with no stripe. I would still prefer no stripe. But if I cannot get rid of it I’d prefer to make it shorter. It’s covering part of the icons.

I finally figured out, through fiddling with F12, how to tweak the CSS to make the icons bigger and higher up to make it cover less of them…but it’s still not acceptable to me.

I did also figure out how to change the color of that stripe, and through maybe I could just make it transparent…but I cannot seem to make that happen either…any ideas??

I cannot figure out why this stripe was added? It’s really ugly!

May 27, 2019 at 5:41 pm #489313

tinamama
Expired Member

Post count: 317

Woops, just discovered that the CSS I was fiddling with that I thought changed the color of that grey stripe doesn’t change the whole stripe properly…it makes square corners instead of rounded…so clearly that’s not the right code exactly. But if I could just get rid of that code that makes it grey in the first place…override it… But I am not seeing it ANYWHERE using F12!! (Admittedly, I am not great with this coding stuff, nor with F12 feature…)

The website is https://homeschoolrealm.com/wordpress (tester site) and I’m going nuts over here trying to figure this out, so I greatly appreciate any help! 🙂

May 28, 2019 at 9:26 am #489439
Alex Rollin
Moderator

Post count: 27815
Here is an example to start with.
```
/*GDV2 - Supreme Featured Area - Make Popular Categories text background Transparent*/
header .featured-area .geodir-categories-container .gd-cptcat-rows ul li {
    background: transparent!important;
}
/*GDV2 - Supreme Featured Area - Make Popular Categories text background Transparent*/
header .featured-area .geodir-categories-container ul li {
    background: transparent!important;
}
```
https://wpgeodirectory.com/docs-v2/themes/supreme/#popular
May 28, 2019 at 5:28 pm #489563

tinamama
Expired Member

Post count: 317

Thank you. That code did make the top layer transparent, but it also made the layer beneath transparent as well. See attached image.

I’ve fiddled with the code a bunch and nothing seems to work to make only the top layer transparent.

May 28, 2019 at 7:40 pm #489596

Alex Rollin
Moderator

Post count: 27815

Yes, try removing one or the other based on your needs.

May 28, 2019 at 10:13 pm #489627

tinamama
Expired Member

Post count: 317

One or the other what? I’ve tried both pieces of code separately and they both appear to do the same thing. I can’t tell a difference. And both make both layers transparent.

May 29, 2019 at 8:14 pm #489860

Alex Rollin
Moderator

Post count: 27815

Mmm, well, what are you trying to do?
There isn’t a hidden layer that has the background color of the top layer, that is what you are looking for.

May 30, 2019 at 12:10 am #489905

tinamama
Expired Member

Post count: 317

As I said in my original post…I want to make the thumbnails look like they used to look. See the attached images in my original post. They didn’t used to have this grey stripe under the words. I just want that grey stripe gone. Not sure why anyone would want to make just the bottom half of the category thumbnails just invisible…the code you shared just makes the bottom go away. Either I’m not understanding something or it’s weird.

I just want to have that grey stripe gone. I like the colors with the words directly on the square. NO GREY.

May 30, 2019 at 12:12 am #489907

tinamama
Expired Member

Post count: 317

I suppose I could make each one the same color as the button it’s on, but is there a way to make the stripe specific to each individual button? I have no idea how to code that.
Author

Posts