change title of entry fields

[Børge]

Hello and thank you for making such a great plugin!

I am using the plugin with translation to Norwegian.

I would like to change a few of the entry fields, see attached photo.

Also one more question for the Events Calender pro. How can I hide the search field on mobile? When you load the page the search bar takes away all the focus from the page.

[Andras]

Hello Børge,

Thank you for your kind words, it makes us all really happy to hear you like our plugins!

I would like to change a few of the entry fields, see attached photo.

If you would like to change how those are translated, that is fairly easy.

You will either need a software like PoEdit or the Loco Translate plugin.

Once that in place you will need to open the .po translation files, find the string, and change it to your liking.

The translation files are located here:

wp-content\plugins\the-events-calendar\lang\the-events-calendar-nb_NO.po
wp-content\plugins\events-calendar-pro\lang\tribe-events-calendar-pro-nb_NO.po
wp-content\plugins\events-calendar-pro\lang\tribe-events-community-nb_NO.po

If you use PoEdit, then after saving the file, upload the .po and the .mo files to your site under wp-content/languages/plugins folder. This way your translations will not be overwritten with a plugin update.

If you choose to use Loco Translate, then you have an option to copy the translation files to that location.

How can I hide the search field on mobile?

There is usually an option to show/hide the fields, but I see that on your site that option is hidden with this css:

#tribe-bar-collapse-toggle {
display: none;
}

If you want to completely hide it on mobile than you can try copying this css snippet into your theme’s style.css file:

@media screen and (max-width: 768px) {
.tribe-bar-filters {
display: none;
}
}

Let me know if this helps.

Cheers,
Andras

[Børge]

Hi and tnx for the reply!

I tried the code:
@media screen and (max-width: 768px) {
.tribe-bar-filters {
display: none;
}
}

It did not remove the search bar on mobile. Tried to add it to to style.css and also to add it ass aditional css. None of them did work.

[Andras]

Hi,

Sorry to hear that.

I now tried with my browser tools and when I added it to the style.css file of the child theme (wp-content/themes/travel-time-child/style.css) then it got applied, and the filters disappeared as soon as the window width went below 768px.

Also, if your mobile screen has a high resolution and it is wider than 768px then it will not disappear.

If you are using Firefox or Chrome then you can switch on responsive mode with Ctrl + Shift + M. Then drag the window so the width is less than 768px and check if it works there. If it does, then the code works.

Let me know what you find.

Cheers,
Andras

[Børge]

Hello,

Thank you for your reply.

The code is present in my style.css file now, but still no changes.

There is no other code in my style.css, it only has this code and no other things:

@media screen and (max-width: 768px) {
.tribe-bar-filters {
display: none;
}

I tried the effect on my browser and also on my Iphone 7, no changes.

Please advice 🙂

Also when we can resolve this, i would like to hide the other top menu also on mobile.

[Andras]

Hi Borge,

I took a look at your site and it works for me. Check this screencast how the search fields disappear when the resolution goes below 768px.

Might be your mobile has a wider screen, in this case you can set that px number in the css to a bigger amount, however that will also influence computers as well. It is connected to the resolution and not the type of device.

There are 2 more things you can try:

Option one:

We have a separate stylesheet for mobile, which usually kicks in on mobile devices. You can add your extra styling (the above code) to that. You will find more detailed information in our Themer’s Guide on how this can be done, specifically in the Customizing Styles section.

Option two:

You can create a snippet that uses “wp_is_mobile()” to detect if the request is from a mobile device (if the device/the browser makes that known) and turn off the bar or else enqueue CSS that hides it.

Please note that we are limited on supporting customization request. I can give you some more pointers if needed, but this is about as much help as I can give at the moment.

Let me know if any of the above helps.

Cheers,
Andras

 

[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