modal-on-load

Hello,

This issue is a result of Customized Codes. There are a lot of HTML Validation Errors on your Website: https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.tuttipasta-hannover.de%2F which could be causing this issue. Please consider fixing these first and this could automatically fix your issue. If the issue persists, please let us know and we will check this further.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Hello,

Thanks for reporting these. However, we noticed that you were using an Older Version of Canvas. We have made many improvements in the way Plugins are executed in the Latest Versions, so it is highly recommended to keep your Websites updated with the Latest Version of Canvas to avoid any unexpected issues.

Meanwhile, for the bootstrap.css.map Error, the Bootstrap CSS is directly used from the Official Website: https://getbootstrap.com/ in its unmodified form, so you can use it directly from the CDN as well and everything will work in the same way. So all the Core Plugins is kept as it is without removing the default codes including the bootstrap.css.map Reference.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Hello,

1. If you upgrade all the CSS/JS Files, you will lose your Customization. Make sure to keep your Customizations different: http://docs.semicolonweb.com/docs/getting-started/theme-customization/ . Please consider following the Changelogs: http://docs.semicolonweb.com/docs-group/changelog/ and make the changes according to the list of Code Changes mentioned there.

2. You will need to update the js/plugins.lightbox.js File. Find the following block of code:

$.magnificPopup.open({
	items: { src: elTarget },
	type: 'inline',
	mainClass: 'mfp-no-margins mfp-fade',
	closeBtnInside: false,
	fixedContentPos: true,
	removalDelay: 500,
	callbacks: {
		open: function(){
			if( elAnimateIn != '' ) {
				$(elTarget).addClass( elAnimateIn + ' animated' );
			}
		},
		beforeClose: function(){
			if( elAnimateOut != '' ) {
				$(elTarget).removeClass( elAnimateIn ).addClass( elAnimateOut );
			}
		},
		afterClose: function() {
			if( elAnimateIn != '' || elAnimateOut != '' ) {
				$(elTarget).removeClass( elAnimateIn + ' ' + elAnimateOut + ' animated' );
			}
			if( elCookies == 'true' ) {
				Cookies.set( elTargetValue, '0' );
			}
		}
	}
}, 0);

and replace it with:

$.magnificPopup.open({
	items: { src: elTarget },
	type: 'inline',
	mainClass: 'mfp-no-margins mfp-fade',
	closeBtnInside: false,
	closeOnContentClick: true,
	fixedContentPos: true,
	removalDelay: 500,
	callbacks: {
		open: function(){
			if( elAnimateIn != '' ) {
				$(elTarget).addClass( elAnimateIn + ' animated' );
			}
		},
		beforeClose: function(){
			if( elAnimateOut != '' ) {
				$(elTarget).removeClass( elAnimateIn ).addClass( elAnimateOut );
			}
		},
		afterClose: function() {
			if( elAnimateIn != '' || elAnimateOut != '' ) {
				$(elTarget).removeClass( elAnimateIn + ' ' + elAnimateOut + ' animated' );
			}
			if( elCookies == 'true' ) {
				Cookies.set( elTargetValue, '0' );
			}
		}
	}
}, 0);

1. For the Cookies, first, you will need to add the data-cookie="true" Attribute to the Modal on Load Element in the HTML File. Documentation: http://docs.semicolonweb.com/docs/shortcodes/modal-on-load/#docs-snippet-enable-cookies-on-modal .

Now, find the following code in the JS File:

Cookies.set( elTargetValue, '0' );

and replace it with:

Cookies.set( elTargetValue, '0', { expires: 1 });

This will enable Cookies for that Modal for a Day. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Hello,

Very Happy to Help! :)

Glad that the issues were resolved and everything works great. We will keep working on trying to improve the performance with every future update.

Do let us know if we can help you with anything else or if you find any further issues with Canvas.