[Resolved] Conflict with Arforms Plugin

[Samuel]

Hello,

I just purchased Arforms plugin and there is a conflict with GP Premium.

Here is the issue : when using the dropdown field of my form in frontend it’s adding a #top to the URL and instantly move to top of the page.

It appears that this issue is only happening when the “smooth-scroll” option is active in GP Premium.

Is there a way to resolve this ? To be able to use both “smooth-scroll” option and my form plugin ?

I let you an URL in the private information part where you’ll find a form and check this behaviour.

Thanks for your help
Sam

[David]

Hi there,

are you using any functions to change the behaviour of smooth-scroll ? Such as apply to all links ?

[Samuel]

Yes I found that I’m using this snippet in my function.php

add_filter( 'generate_smooth_scroll_elements', function( $elements ) {
  $elements[] = 'a[href*="#"]';
  
  return $elements;
} );

What could I do ?

[David]

First temporarily remove that to check to see if that is the issue.
I think it will be – but worth testing first. And if it is then ill scratch my head a lot to try and figure out how to exclude those links.

[Samuel]

Yes, removing the code is fixing the issue… do I put it back or do you need it to be removed to find a solution ?

[David]

You can add it back. Trying to figure out the best approach for this.
Couple of questions:

1. Where do you require the ALL <a> to apply the smooth scroll ?
2. How many pages will you be adding those Forms to ?

My thoughts is to exclude the pages where the smooth scroll isn’t required for links inside the content.

[Samuel]

Ouch that’s going to be difficult…

I use a lot of forms (about 40 different forms) in many pages (about 100) (it’s my economic model to send customers to suppliers)…

On the other hand, anchors are used in almost everywhere also because I’m using table of content for each post…

So there is a lot of pages AND using table of content AND displaying a form…

There is no way to say “don’t do that with this specific plugin” ?

By the way I don’t understand why selecting a dropdown field in a form would add an anchor to the URL ?

[David]

Ok – thats not an option 🙂

Try updating the snippet to this:

add_filter( 'generate_smooth_scroll_elements', function( $elements ) {
    $elements[] = 'a[href*="#"]:not[data-normalized-text]';
    
    return $elements;
} );

[Samuel]

It’s not working, it’s removing the smooth scroll behaviour for Table of content anchors.

If it’s relevant I let you in private information a page where you’ll find both Table of content and Form.

[David]

Well thats a pain. Presumably they are both using the same data-attributes or the ToC plugin is adding them to all links.
Ask the Arforms developer if its possible to add a CSS Class to the <a> elements in the form. Its the kinda thing there would be a filter for, then we can exclude the class.

[Samuel]

Ok I will and I’ll let you know (their support is not as fast as you guys)

Thanks a lot

[David]

You’re welcome

[Samuel]

Hi there,

I have some news.

ARform support gave me a file to replace with a class added to dropdown’s anchor.

So to someone who would need this as well :

1. you ask ARform support to send you the bootstrap-select.js file with a specific class added to dropdown’s anchor (Or if you know what you’re doing you surely can edit bootstrap-select.js to add the class by yourself)
2. it’s adding .arf_selectpicker_link class on the anchor tag used in the dropdown
3. you replace the file at wp-content/plugins/arforms/bootstrap/js/bootstrap-select.js
3. then you can exclude the mentioned class by changing a[href*='#'] to a[href*='#']:not(.arf_selectpicker_link) in your smooth scroll function.

It works.

[David]

Glad to hear that!

[Author]

Posts