@kylecblanchard

Included with my GoDaddy (godaddy.com) Hosted, Managed WordPress I have a staging site and a production site. I am able to upload files through Adobe Dreamweaver (adobe.com) and that is the software I used to make my child theme. My laptop and desktop (web view) are Windows 10 HP, I currently do not have a working tablet (to test tablet view), and for mobile, I have Android (mobile view). Those are how I currently use my site when modifying or applying changes.
In addition to the Managed WordPress with the two sites (production and staging) from GoDaddy, I am able to right now afford a cPanel hosting through them also. I have WordPress installed there also to a subdomain (blog.kylecblanchard.net). I was testing having the blog section be a completely different theme (blog.kylecblanchard.net uses a child theme of the default twenty-twenty theme) from the page I need help with (kylecblanchard.net and it uses a child theme of the default twenty-seventeen theme); I created the child themes myself.

404ndy,

Thank you for the reply. I saw that there were instructions to follow (as you say through the CDN tab through the Cloudflare documentation on their site) for integration, but did not know about what you are saying here about the extensions menu in the plugin. I appreciate the help and reply.

I would be beginning with the Cloudflare free plan.

I’m not sure if there is some kind of an infinite scrolling feature enabled. Perhaps if there is, then how can I disable that infinite scrolling in the child theme?

Screenshot: https://drive.google.com/open?id=1UkyZ4wFk2N0bnrdoA0I_p3VeuDUHgNuu

It doesn’t happen all the time, but it mostly happens after this part in the page: under my bottom footer after the Proudly powered by WordPress part with my Creative commons notice and other information that I’ve listed as my custom footer.

Screenshot: https://www.kylecblanchard.net/wp-content/uploads/2017/12/2017-12-22.png

I reviewed my custom js file again, and it appears that some formats of the open and close single quotes were different in the first section that in added section for the search. Perhaps this quirk effected things. The update now is as follows.

// JavaScript Document
// sticky_mobile_menu.js

// /**
// * Sticky mobile menu, theme Twenty Seventeen
// * @uri https://www.ads-software.com/support/topic/sticky-mobile-menu/
// */

(function($) {

$(‘#top-menu li a’).click( function(){
$(‘#site-navigation’).attr(‘class’,’main-navigation’);
});
// I have a search currently under the header at above site. Is there a way to make sticky the search under the sticky menu, both at the top?
// Try adding the following code in your custom js file:
$(‘#search-container’).detach().appendTo(‘.navigation-top .wrap’);
alert(‘You will see this alert if the file is loaded properly’);
// All future jquery code can go in here

})( jQuery );

??
I hadn’t seen the alert load after adding the code into the function in sticky_mobile_menu.js. This is what the end of my functions.php looks like where the enqueue scripts are called.

/**
* Combining enqueue functions
@link https://developer.www.ads-software.com/themes/basics/including-css-javascript/
*/
function add_theme_scripts() {
  wp_enqueue_style( 'style', get_stylesheet_uri() );
	
  wp_enqueue_script( 'script', get_stylesheet_uri() . '/v1984/js/v1984.js', array ( 'jquery' ), true);
	
    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
      wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'add_theme_scripts' );

/**
 * Sticky mobile menu, theme Twenty Seventeen
 * @uri https://www.ads-software.com/support/topic/sticky-mobile-menu/
 */

/*************************** Custom js ***************************/
function my_custom_js() {
    wp_enqueue_script( 'sticky_mobile_menu', get_stylesheet_directory_uri() . '/v1984/js/sticky_mobile_menu.js', array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_custom_js' );

?>

Without luck, no placement has changed of the search section.
On my desktop, I cleared local caches, reloaded the view, and purged all cache from the plugin W3TC, your Web Performance Optimization, to no avail. I may have to wait for my server to give it some time before the changes show? Not sure.
I’ll keep checking for the next few days to see if the updated changes have taken effect.
Thanks for all the help so far @rfortin.

Thanks!
I updated the placement.

@rfortin,
This will be the code for my custom js file ( sticky_mobile_menu.js ) after I update, withstanding that the search code is placed correctly.

// JavaScript Document
// sticky_mobile_menu.js

// /**
// * Sticky mobile menu, theme Twenty Seventeen
// * @uri https://www.ads-software.com/support/topic/sticky-mobile-menu/
// */

(function($) {

$(‘#top-menu li a’).click( function(){
$(‘#site-navigation’).attr(‘class’,’main-navigation’);
});
// All future jquery code can go in here

})( jQuery );

// I have a search currently under the header at above site. Is there a way to make sticky the search under the sticky menu, both at the top?
// Try adding the following code in your custom js file:
$('#search-container').detach().appendTo('.navigation-top .wrap');

Does the placement of
$('#search-container').detach().appendTo('.navigation-top .wrap');
Need to be moved anywhere in the custom js file, or is it fine as shown?

This has proven valuable, all looking for making sticky menu on mobile.
https://www.ads-software.com/support/topic/sticky-mobile-menu/

Kyle

• This reply was modified 7 years, 7 months ago by @kylecblanchard.

@rfortin,

Thanks, works like a gem!
I have one addition that I would like to do.
https://www.kylecblanchard.net/

I have a search currently under the header at above site. Is there a way to make sticky the search under the sticky menu, both at the top?

Thanks in advance,
Kyle

Hello,

Will the above mentioned CSS make the mobile menu sticky? I have a child theme of Twenty Seventeen.

https://www.kylecblanchard.net/

My desktop view has the sticky menu at top, upon scroll. I would like this same effect on mobile. At current, when the site shifts to mobile view, then the menu is visible while at the top of the site, but upon scroll, is no longer visible.
Thanks in advance for any suggestions.

Kyle