How to hide a date in “date picker” title

Hi there,

The “September 20” in this case simply refers to a future date, compared to the current date.

At the time that screenshot was grabbed, it looks like the current date was around September 14.

In plain English, it’s saying “here are the events between September 14th and September 20th.”

In other words, it may be worth considering leaving this as-is. Although if you still want to hide it, you’re more than welcome to.

I do see a way to do so with just Custom CSS.

.tribe-events-c-top-bar__datepicker-time:not(:first-child) {
  display: none;
}

Definitely let us know if you’re not sure about the feasibility of a CSS-only solution, so we can take a look.

Sometimes it is impossible based on the existing HTML markup, although often there is some workaround that can be found.

Some further reading if you’re curious how it was done in this particular case:

https://css-tricks.com/examples/nth-child-tester/

https://css-tricks.com/almanac/selectors/n/not/

Hope that helps. Let us know how it goes.

Best regards,
Leland

It works, great! Thanks for the fast reply.

Yes, maybe it have its purpose, but it’s somewhat confusing, since it’s not related to any specific date or show in the future, it’s just a random date (right now it shows 11 days ahead for me).

Now I have “pick a date” that opens up a calendar on click, and that’s exactly what I wanted.

Overall, this is an amazing plugin, keep up the good work!

Nebojsa

Hi there,

Thanks for the reply! Hmm, I’m not sure I would describe the date as random.

As I write this, our live preview site currently says “Now – March 18”

And March 18 corresponds with the event start date of the most future-dated event visible in that view.

Do you notice a similar pattern on your website? If you can provide a link I’d be happy to take a look myself.

Best regards,
Leland

Hm, yes, now I understand what it stands for. It’s the last date of the shows that are listed below, like on a theme that I’m using:

https://ozeum.themerex.net/events/list/

However, I think I will go with my solution and hide it, so that I have: Today – “Pick a date” (instead Now – November 17) lines only. ??

Hi there,

Sure thing!

Anyway, I’ll go ahead and mark this topic as resolved. If you have any other questions, feel free to post a new topic and we can take a look.

Best regards,
Leland

Hi there Leland,
How can you hide the date picker or that entire bar completely? Can you do this with CSS?

Hi @danchan22, please make a new topic with your question. You can do so on this page.

This topic is resolved, and is scoped to a sub-component of the bar. Hiding the entire bar is another matter, and warrants a new topic.

In your new topic, if you could include:

1) an annotated screenshot indicating precisely what you want removed
2) an explanation as to why you want to do this, while acknowledging that critical aspects of the product’s navigational features may not be able to function according to what is hidden
3) your site URL, as the potential CSS necessary may vary from site-to-site due to the unique combinations of theme/plugins in use

That will be immensely helpful in getting you the help you need from responding support agent.

Best regards,
Leland