List View Styling / Issue

[jeffnp]

Hi,

Just a few quickies re List view on an site I’m building with the Avada theme:

1) How to move the header bar that provides the month in list view. As you can see in the link, I have most of the bar already removed but a horizontal line remains.

2) How to change the color of the grey background of the “view” selector? It’s the only color I can’t seem to be able to change either through the Customizer or through the Avada / TEC options.

3) Seems like the RSVP button is cut off on the left side (see attached)?

Thanks again!

[Geoff B.]

Hello again Jeff,

Let us continue our conversation.

1) How to move the header bar that provides the month in list view. As you can see in the link, I have most of the bar already removed but a horizontal line remains.

The simplest way to achieve this is view a custom view template (as discussed in the previous answer). You might want to read our Themer’s guide to get a sense of how that works.

If you are struggling, perhaps you could provide me with a bit more information as to what you are trying to accomplish exactly so that I can help.

2) How to change the color of the grey background of the “view” selector? It’s the only color I can’t seem to be able to change either through the Customizer or through the Avada / TEC options.

In order to gain full power on your site’s look and feel, I would highly recommend reading the following articles:

• https://theeventscalendar.com/knowledgebase/wordpress-customizer/
• https://theeventscalendar.com/knowledgebase/using-google-chrome-developer-tools/
• https://theeventscalendar.com/knowledgebase/changing-fonts-and-colours/
• https://theeventscalendar.com/knowledgebase/styling-events-widgets/

Since the customizer does not let you achieve what you are looking for, you will most likely need to find the desired element with the Inspector tool and add a CSS rule for your change.

You might need to use the !important argument in there to make sure the rule kicks in.

3) Seems like the RSVP button is cut off on the left side (see attached)?

This seems like a CSS issue. Could you provide an URL where this is happening ?

Best regards,

Geoff B.

[jeffnp]

This reply is private.

[Geoff B.]

This reply is private.

[jeffnp]

That went wonderfully. Thanks for your help!

[Geoff B.]

Good morning Jeff,

I am super stoked that this worked for you.

You are welcome back in our support forums any time 🙂

For now, I am going to close this thread.

Have a great week!

Geoff B.

[Author]

Posts