Scroll bar lost after MailChimp form
Printed From: openElement Website
Category:
openElement
Forum Name: openElement General Discussion
Forum Description: A place for general discussion and questions about the software.
URL: https://forums.openelement.uk/en/forum_posts.asp?TID=1875
Printed Date: Apr 20 2024 at 3:28am
Software Version: Web Wiz Forums 12.04 - http://www.webwizforums.com
Topic: Scroll bar lost after MailChimp form
Posted By: WattJet
Subject: Scroll bar lost after MailChimp form
Date Posted: Sep 30 2021 at 4:57pm
|
Hi, I made the site https://personaldatahackathon.com based on the Sensode Black template I integrated the tarteaucitron functionality for cookies. ..... and then I tried to integrate a MailChimp form for suscription and automatic management of mail list and marketing automation. Everything seems to work fine except that the scroll bar and the scroll function are lost after the MailChimp form is closed (whether filling it up or just closing it). If the page is reloaded everything works fine (and the MailChimp form does not apper again), but reloading the page does not come naturaly and the user may perceive the site is blocked and go elsewhere. Any idea on how to restore the scroll bar and function after the form is closed? Any guidance will be very welcome Al_H |
Replies:
Posted By: Hobby001
Date Posted: Sep 30 2021 at 5:22pm
|
Just tested your site and added an email in the screen. Did not loose scroll bar nor scroll functionnality. Did you get any error message in the console? ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: Hobby001
Date Posted: Sep 30 2021 at 5:25pm
|
Do not forget to clear the browswer's cashe prior to test again ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: digizar
Date Posted: Sep 30 2021 at 6:05pm
|
Anyway ... http://personaldatahackathon.com" rel="nofollow - https://personaldatahackathon.com I do recommend NOT to use green letters on a dark blue background. I'm 82 soon, and it is verry hard for me to recognize those green? letters. So I recommend bright(er) background (perhaps chamois), and dark letters. ------------- ___________________________________ Ask questions only if there is no answer yet. https://blumendigi.com |
Posted By: WattJet
Date Posted: Sep 30 2021 at 6:18pm
|
Thanks for the feedback Digizar |
Posted By: WattJet
Date Posted: Sep 30 2021 at 6:19pm
|
I am clearing the cache beforehand, and I also test it in the private browsing. The point is that I cannot reproduce the error everytime, even if I clear the cache before. I'll check the console
|
Posted By: Hobby001
Date Posted: Oct 01 2021 at 1:27pm
You might also use CSS to add a border around letters https://css-tricks.com/adding-stroke-to-web-text/" rel="nofollow - https://css-tricks.com/adding-stroke-to-web-text/ ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
digizar wrote:Posted By: WattJet
Date Posted: Oct 01 2021 at 8:31pm
|
Thanks for the suggestion Hobby001 I'll give it a go! |
Posted By: WattJet
Date Posted: Oct 02 2021 at 9:10am
|
Hobby001, The effect is great, but it makes it heavier to read. I understand that the color scheme chosen may lead to some people having trouble to read it. I will add a printable B&W version. If someone is really interested they will read it. If not, I'd rather keep the "flashy" color scheme chose to attract certain demographics. In any case, thanks so much for the suggestion |
Posted By: WattJet
Date Posted: Oct 02 2021 at 9:15am
|
Getting back to the scroll blockage I still have not been able to reproduce the issue. It may be linked to the actual process that MailChimp makes to add the contents of the form. The "funny" thing is that when one clears the cache the tarteaucitron process kicks in properly since it does not find the cookie.....but the mailchimp form does not. I don't know if MailChimp collects the IP or something, but it is a weird behaviour.
|
Posted By: Hobby001
Date Posted: Oct 02 2021 at 12:38pm
|
Without access the mailchimp code, it's impossible to understand how they create the issue ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: WattJet
Date Posted: Oct 02 2021 at 8:35pm
|
I know... but they just give you a code with a script reference number..... "<script id="mcjs">!function(c,h,i,m,p){m=c.createElement(h),p=c.getElementsByTagName(h)[0],m.async=1,m.src=i,p.parentNode.insertBefore(m,p)}(document,"script","https://chimpstatic.com/mcjs-connected/js/users/XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.js");</script>" |
Posted By: WattJet
Date Posted: Oct 14 2021 at 3:07pm
|
Hi again, I found a way to reproduce the error. It definitively ocurrs when one closes the mailchimp suscribe window (regardless of having suscribed or not), regardless of filling in the Cookie notice or not The problem to reproduce the error is that you only get once the mailchimp form. Whether mailchimp achieves this with a tracking pixel or any other mean, the problem is that once you do it once, you need to clear all browsing data to have it appear again (cleaning session or cookies does not seem to be enough) I have tried with Chrome, Edge, Firefox and the moment the MailChimp form is closed, the web loses the scroll bar and the ability to scroll down (even with mouse or keyboard). The only way is reloading again the site (and of course this second time there is no form, so no problem) |
Posted By: WattJet
Date Posted: Oct 16 2021 at 10:30am
|
I was thinking that perhaps the issue is due to the location where I placed the script. I have two external scripts in the site. - Tarteaucitron: for the cookie consent manager - Mailchimp: for the form The tarteucitron appears as a folder in the same "rank" as the Homepage The Mailchimp was placed as a script in the head section of the Homepage Can the issue be that I misplaced the Mailchimp script and that is why it interrumps the scroll? Any guidance will be very welcome |
Posted By: Hobby001
Date Posted: Oct 16 2021 at 10:46am
|
Try to moving Tarteaucitron before Mailchimp ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: WattJet
Date Posted: Oct 16 2021 at 11:24am
|
In the code section, Tarteaucitron is already before Mailchimp: The order is - Base >CSS - Base > CSS-BT-TOP - preloader > CSS - Base > Meta mobile - Base > tarteaucitron - Maillist-Chimpmail - Base > JS-BT-TOP |
Posted By: Hobby001
Date Posted: Oct 16 2021 at 1:29pm
|
Tarteaucitron needs to end before mailchimp starts, you will neet to delay mailchimp untill Tarteaucitron ends. ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: Hobby001
Date Posted: Oct 16 2021 at 1:35pm
|
Maybe starting mailchimp in the use strict https://www.npmjs.com/package/tarteaucitronjs" rel="nofollow - https://www.npmjs.com/package/tarteaucitronjs
------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: Hobby001
Date Posted: Oct 16 2021 at 1:39pm
|
https://github.com/AmauriC/tarteaucitron.js/issues/118" rel="nofollow -
https://github.com/AmauriC/tarteaucitron.js/issues/118
------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: WattJet
Date Posted: Oct 16 2021 at 2:04pm
|
Wow! Thanks so much Hobby001 So.... should I add te code of the issue 118 at the end of the tarteaucitron code? I basically don't know how to do it... as "holze" says in the Github comments, " it would be cool to have it added to the services" Anothe additional point, I installed the tarteaucitron in the Base Layer, and the MailChimp in the Homepage.
Should this be installed in the same layer? |
Posted By: Hobby001
Date Posted: Oct 16 2021 at 2:49pm
|
Sorry but I don't have time to test the solution it may takes hours Once you publish the site, the layer becomes part of the page. The difference is that all pages that have the layer attached will receive the code. ------------- https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video |
Posted By: WattJet
Date Posted: Oct 16 2021 at 6:06pm
|
Thanks for the clarification and for all your help. I'll give it a go and see what happens |