How to change size of header above all calendar views

[Callum]

Hi,

I’m trying to get rid of the blank space above the map on this page (because the above-the-fold experience is not that great currently) : http://www.handlebards.com/tickets.

How do I do that? I have tried adding this code to my tribe-events.css file:

—

#bodywrapper #content_inner_wrapper.dark #content-container .topspacer {
height:0px;
}

—

But I am clearly doing something wrong.

Is there some code I could add to my style.css file in Appearance > Editor that would do this?

Also, I would potentially like to add some text into this space to say something to the likes of ‘Hi there, search for a performance by date, location or keyword.”

How and where would I do this please?

Thanks so much!

Callum

[Jennifer]

Hi Callum,

Thanks for reaching out! I’d be happy to help you with this.

It looks like that space is coming from your theme, so I am not sure if there is anything under Appearance > Editor to change it. However, I haven’t seen settings similar to that in other themes, so I would be inclined to think you will need the CSS.

Your CSS should work, but try adding it to your style.css file in your theme instead of your tribe-events.css file, since it’s not being generated by our plugin. (Note that using a child theme is highly recommended so that you don’t lose your changes with future theme updates.)

If it’s still not working, you can try adding an “!important” before the semicolon or setting the .topspacer display to none.

I’d recommend including the .tribe-events-map class in your CSS rule so that this is only applied to the Events page in map view…Otherwise you may find there isn’t enough space above the content on other pages.


.tribe-events-map #bodywrapper #content_inner_wrapper.dark #content-container .topspacer {
height:0px !important;
}

or

.tribe-events-map #bodywrapper #content_inner_wrapper.dark #content-container .topspacer {
display: none;
}


To add in the text, you can copy the page template (from /wp-content/plugins/the-events-calendar/src/views/default-template.php) into your child theme and add in the following:


<?php if( ! is_single() ) {
echo 'Hi there, search for a performance by date, location or keyword.';
}?>


Make sure you have “Default Events Template” selected under Events > Display > Events Template, or the text won’t show up.

Alternatively, you can go into Events > Display > Advanced Template Settings and add HTML that you want to appear before the main content on event pages, but note that this will display on your main Events page as well as single event pages.

I hope that helps! Please let me know if you have any more questions.

Thanks,

Jennifer

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts