Impossible to stick my element with Sticky Menu

Hi! Thanks for trying my plugin.

When I look at your site, I don’t see the plugin being active. However, your assumption that “.esg-filter-wrapper” is the element to make sticky is correct.

Seeing that your top left logo also doesn’t get sticky, tells me there’s something else wrong. However, without the plugin being active, I won’t be able to tell what could be the issue.

Hello,
Thanks a lot for answering !

I had to deactivate it for a while, sorry

It’s activate now, but still doesn’t work

The logo is fixed with CSS (position:fixed), but I wasn’t able to do the same (ok with Firefox, but not with Chrome and Safari) with the menu filters, so I decided to use a wp plugin

Now that the plugin is activated, are you able to see what’s wrong ?

For some reason, the plugin’s Javascript file is not being added at the bottom of the page (to execute the stickiness). I believe this may have something to do with other scripts, some of which are being misplaced, and/or invalid HTML markup, but there’s something wrong with your template(s) that’s messing up the page’s structures.

For example, there are multiple instances of the #primary DIV. This line appears twice in your markup:

<div id="primary" class="content-area">

That definitely should not happen. And on the home page, I see this after the main content:

</div><!-- .entry-content -->

</article><!-- #post-## -->

		</main><!-- #main -->
	</div><!-- #primary -->

	</div><!-- #content -->

	<footer id="colophon" class="site-footer" role="contentinfo">
		<div class="footer-area clear">

		</div><!-- .footer-area -->
	</footer><!-- #colophon -->
</div><!-- #page -->

Check where all that is coming from. It’s hard for me to tell why/how that appears (maybe some other plugin?), but it’s likely blocking my plugin from being loaded.

Hey Mark, thanks for answering again

I understand what you mean, I will try to clean the code a bit
I’m quite surprised, because I didn’t touch to it.

I only – almost- modified the CSS, I’m quite surprised of it. Never mind, I’ll try to figure it out

By the way, I have an other problem that I can’t solve, do you think you help me with it ?

My menu filter, I would like to rotate it 90deg, and to stuck it on the right part of the browser, in the middle (between top and bottom)

I managed to turn it, but I can’t find the way to place it at the right place.
Do you have an idea how to solve it ?

Thanks a lot !!!

I looked at the code, and I don’t see, as you, twice the line, only one time, at the beginning.
<div id="primary" class="content-area">

There is something strange

Then, I looked at the end of the different DIV, at the bottom of the code, everything seems to be okay, but I’m not a pro, so maybe I’m wrong !

At the beginning, here is the code, opening the different main DIV :

<div id="content" class="site-content">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<article id="post-226" class="post-226 page type-page status-publish hentry">
<div class="entry-content">

and at the end, closing the same, in the same order :

</div><!-- .entry-content -->
</article><!-- #post-## -->
</main><!-- #main -->
</div><!-- #primary -->
</div><!-- #content -->

and I checked, there the same number of <ARTICLE> and </ARTICLE>

So it seems okay …

do you know if there is a way to flush the cache ? it could be an idea ?

At the end, this script is added

<script type="text/javascript">
var essapi_37;
jQuery(document).ready(function() {
	essapi_37 = jQuery("#esg-grid-37-1").tpessential({
        gridID:37,
        layout:"cobbles",
        forceFullWidth:"off",
        lazyLoad:"on",
        lazyLoadColor:"#cccccc",
        gridID:"37",
        loadMoreType:"scroll",
        loadMoreAmount:6,
        loadMoreTxt:"",
        loadMoreNr:"on",
        loadMoreEndTxt:"No More Items for the Selected Filter",
        loadMoreItems:[
				[332, [-1, 117, 38, 131]],
				[79, [-1, 3, 38, 97]],
				[311, [-1, 113, 38, 128]],
				[205, [-1, 35, 38, 102]],
				[16, [-1, 2, 38, 99]],
				[347, [-1, 5, 38]],
				[196, [-1, 30, 38, 76]],
				[60, [-1, 6, 37, 38, 98]],
				[367, [-1, 132, 38]],
				[203, [-1, 35, 38, 104]],
				[361, [-1, 132, 38]]],
        row:9999,
        loadMoreAjaxToken:"7b3416c587",
        loadMoreAjaxUrl:"https://collectifsaga.com/X/wordpress/wp-admin/admin-ajax.php",
        loadMoreAjaxAction:"Essential_Grid_Front_request_ajax",
        ajaxContentTarget:"ess-grid-ajax-container-",
        ajaxScrollToOffset:"0",
        ajaxCloseButton:"off",
        ajaxContentSliding:"on",
        ajaxScrollToOnLoad:"on",
        ajaxNavButton:"off",
        ajaxCloseType:"type1",
        ajaxCloseInner:"false",
        ajaxCloseStyle:"light",
        ajaxClosePosition:"tr",
        space:25,
        pageAnimation:"fade",
        smartPagination:"off",
        paginationScrollToTop:"off",
        spinner:"spinner3",
        spinnerColor:"#ff9933",
        lightBoxMode:"all",
        animSpeed:500,
        delayBasic:1,
        mainhoverdelay:1,
        filterType:"single",
        showDropFilter:"click",
        filterGroupClass:"esg-fgc-37",
        googleFonts:['Open+Sans:300,400,600,700,800','Raleway:100,200,300,400,500,600,700,800,900','Droid+Serif:400,700'],
        aspectratio:"3:3",
        responsiveEntries: [
						{ width:1100,amount:12},
						{ width:1170,amount:6},
						{ width:1024,amount:5},
						{ width:960,amount:5},
						{ width:778,amount:5},
						{ width:640,amount:5},
						{ width:480,amount:4}
						]
	});

});
</script>

This script could block yours, but this one depend of the plugin Essential Grid

I’m honestly not sure what’s wrong with your page(s) but there are definitely some funky things going on with your markup.

Try switching to a different theme and check if the plugin works then. If it does, then there’s definitely something wrong with your current theme.

Did you make any changes to the template files in the theme at all, or is it all untouched? The markup structure looks very messy (for example, articles within articles within articles…not always a great idea).