How To Make The SubMenu Sticky On Mobile

only the submenu or do you like to have the header with burger fixed too?

So my solution is to have all three alb files concerning to submenu in the child-theme shortcodes folder
Activate the usage of child-theme shortcodes instead of the parent files with this in child-theme functions.php

add_filter('avia_load_shortcodes', 'avia_include_shortcode_template', 15, 1);
function avia_include_shortcode_template($paths){
$template_url = get_stylesheet_directory();
  array_unshift($paths, $template_url.'/shortcodes/');
  return $paths;
}
// End of child-theme shortcodes loading snippet

and download all three files from pastebin here ( based on enfold 4.7.5) :
menu.php : https://pastebin.com/dl/CudTKvh1 and look
menu.js : https://pastebin.com/dl/mTtFgR8K and look
menu.css : https://pastebin.com/dl/Ckpa9z7w and look

create a child-theme shortcodes folder via ftp and upload all files to that directory.

i had to set on that in quick css :

@media only screen and (max-width: 989px) {
	#top .sticky_placeholder {
	  position: absolute;
	}
}

But this may be due to the fact that this test website has so many settings in functions.php and quick css that it was overwritten.

Result f.e.: https://webers-testseite.de/transparent-header/
You can see there both ( all three ) cases inbetween 480 and 990 i have submenu and under 480 hamburger.
And: if there are more than one submenu the lower one gets sticky too if comes to the top.

Not too complex ?
If you need additonal help – tell me

Hey Guenni, since Enfold changed parts of the shortcode behaviour in Version 4.8.9 I changed your filter from this post to:

add_filter('ava_builder_shortcode_files_loaded', 'avia_include_shortcode_template', 15, 1);
function avia_include_shortcode_template($paths){
$template_url = get_stylesheet_directory();
  array_unshift($paths, $template_url.'/shortcodes/');
  return $paths;
}

I added your modifications to the latest theme files (Version 4.9) and it works as expected.

If anyone wants to do the same just remember the correct filter.

• This reply was modified 2 years, 8 months ago by spooniverse.

Thought so too but I tested it with your code and the files did not load correctly …

On my end it worked with the pictures too but content in the color sections lost its custom styling. After I changed to ava_builder_shortcode_files_loaded it was as shown in your example. At first I thought it was a problem with the older template files, thats why I made your changes in the 4.9 files again, but the problem was still there. So you still loaded the /shortcodes folder with the code form the documentation?

add_filter('avia_load_shortcodes', 'avia_include_shortcode_template', 15, 1);
function avia_include_shortcode_template($paths)
{
  $template_url = get_stylesheet_directory();
      array_unshift($paths, $template_url.'/shortcodes/');

  return $paths;
}

If the “!important” was omitted in parent theme it would be sufficient to only load the menu.js in the child theme, correct?

I understand that. The question was if we would just have to load menu.js in the child theme if in the parent theme were no !important-rules?

Hey Ismael, I don’t know why, but in my tested installation only this code works as expected:

add_filter('ava_builder_shortcode_files_loaded', 'avia_include_shortcode_template', 15, 1);
function avia_include_shortcode_template($paths){
	$template_url = get_stylesheet_directory();
  	array_unshift($paths, $template_url.'/shortcodes/');
  	return $paths;
}

The code from the documentation does interfer with loading the correct stylesheet for the rest of the page …

My question was directed @Guenni007, I just wanted to understand his note to the devs better (see post-1342985). I just wanted to know if it would be sufficient to only load the menu.js in the child theme if the “!important” was omitted in parent theme.

Strange. Only in this way it works as intended. The one other code that interferes with styles and the child theme is this (from Guenni007 too):

add_action( 'wp_enqueue_scripts', 'wp_change_sticky_header_script', 100 );
function wp_change_sticky_header_script() {
   wp_deregister_script( 'avia-sticky-header' );
   wp_enqueue_script( 'avia-sticky-header-child', get_stylesheet_directory_uri().'/js/avia-snippet-sticky-header.js', array('avia-default'), $vn, true);
}

As mentioned above, everything works on my end, just not with avia_load_shortcodes. It is not added to the site in any other way or twice in the functions.php …

Is that a problem?

In the end I don’t want to interfere with Guenni007’s question at the devs (post-1342985), I just wanted to give a short notice to others having the same problem that the code is not working, but maybe it is just me having this malfunction.

Since latest Enfold update all of Guenni007’s files are working fine. With standard child-theme shortcode loading as described in the documentation.

@Ismael: I am testing the files for some weeks, in my opinion everything is working fine without the !important