When pressing "Buy Now" button page scrolls to wrong position

[Matt]

When a user presses the “Buy Now” button it takes them to the Single Event page where there is a Tickets form to “Add-To-Cart”.

During this process the page is automatically scrolled, presumably with the intention of taking the user straight to the ticket section. Unfortunately in my case it is scrolling too far and the tickets are disappearing off the top of the screen so that the user has to scroll back down.

It doesn’t seem to matter which location I choose for the ticket form.

[Shayne]

Matt, I’ve noticed the same thing on my site. It does not scroll as far as yours, but the tickets screen is somewhat still cut off. I’ll wait for notification on this thread for assistance with this as well.

[Courtney]

Hello Matt

---

@shayne-billeycheremosh-ca could you open up a new thread as well to help us track the issue better? Please send in the System Info https://theeventscalendar.com/knowledgebase/sharing-sys-info and also share your results of the following

---

Can you start by going through our Testing for Conflicts Guide https://theeventscalendar.com/knowledgebase/testing-for-conflicts/?  I am wondering if you might have a plugin or theme conflict. 

We recommend conducting these tests on a staging server (https://theeventscalendar.com/knowledgebase/creating-using-wordpress-staging-site/).

Begin by deactivating all other plugins, using a theme such as Twenty Seventeen https://wordpress.org/themes/twentyseventeen/, and see if the issue still persists.

Also, double check for any other updates available (Dashboard » Updates). 

Please let me know if the issue still persists after these tests.

Thanks
Courtney 🙂

[Matt]

Courtney,

I have established that something in my css is causing the problem. It may
be related to creating a header which stays fixed on scroll. Can you tell
me a way to change the point to which it scrolls so that I can adapt it to
my page formatting please.

Kind Regards,

Matt Flowerday CEng MIET MBA BSc(Hons) DCE DCDC RCDD RTPM
Director
+44 (0) 7917355773
http://www.capitoline.org

[George]

Hey Matt,

Thanks for your patience with some slower-than-normal response times this week!

I’m sorry to bear this news, but we unfortunately can’t troubleshoot code that we don’t make—and so if there’s CSS from your theme or that you wrote yourself or something, the best thing we can recommend is the following process:

• Make a backup of that CSS
• Then remove it from your site!
• Then add one CSS rule back at a time, re-testing this issue after each new rule is added back
• If things work as expected for a while, but then the introduction of one specific CSS rule throws things off, then you’ve just found the specific place in your CSS that is causing the problem
• From there, you can further tinker with alternatives to see if you can work around the issue

Best of luck with your custom coding here Matt!

Cheers,
George

[Matt]

I am only asking if you can point me to where in your plugin files this scrolling action takes place. I am happy to work out what is needed to modifying it.

Can you at least do that?

[Courtney]

Hi Matt

https://github.com/moderntribe/event-tickets/blob/7d608927ecabb5da79dbb8ebf981bf1acef7422a/src/template-tags/tickets.php#L167 is the first place that

tribe_tickets_buy_button()

is used.

Do check our Themer’s Guide for how to modify this in such a way that updates won’t conflict.

Let us know how it works out.

Thanks
Courtney 🙂

[Matt]

Thanks Courtney,

Where do I place the modified copy of this file in my child theme to override it once I have made changes?

I have tried several options but cannot make it pick up my changes. I have followed the suggestions in the themers guide. Most of the template files give an indication at the top of the file but this one does not.

Can it be over-ridden in the child theme?

[Courtney]

You could modify the tribe_tickets_buy_button() output then can use the tribe_tickets_buy_button filter in line 259 https://github.com/moderntribe/event-tickets/blob/7d608927ecabb5da79dbb8ebf981bf1acef7422a/src/template-tags/tickets.php#L259

I can’t be 100% sure on this, but /wp-content/plugins/event-tickets-plus/src/views/wootickets/tickets.php could be the place to override this.

We’re limited in helping with styling customizations, per our Scope of Support / Terms.

https://theeventscalendar.com/knowledgebase/themers-guide/#customizing-styles can also be useful here. You may be able to achieve your desired effect with just CSS. For that, make sure to check out the tribe-events.css portion.

I do hope you get this working Matt!
Courtney

[Matt]

Courtney, Thanks for your help. I’ll try what you suggested with the filter.

FYI; It seems you cannot replace this file in the child-theme. However, there is another template file which is also called tickets.php which formats the ticket table on the page the Buy Now button takes you to. It is this file which can be overidden in the location you describe.

[Barry]

Sounds good, Matt — let us know if we can assist further.

For what it’s worth, it does rather sound to me like you might be up against an issue with your theme and some ‘special effects’ it includes relating to scrolling to anchors within a page, rather than something our plugin is directly responsible for.

To that end, if you need more help, please do reply with some links to live examples if possible (on looking at the domain provided when you created the topic I couldn’t initially seem to find or identify the problem).

Thanks again!

[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