Note that there are some explanatory texts on larger screens.

plurals
  1. POWordpress & Enquire.js - conditional loading philosophy
    primarykey
    data
    text
    <p>Is not a matter of code, I just don't get the idea of how things works in this specific case.</p> <p>I'm woking on a Wordpress theme which should dynamically load portions of php code through javascript. It actually works combined with UA Sniffing because if the device is mobile, the mobile template should be used anyway but that's not the point.</p> <ul> <li>If the screen.width is &lt; 1080px the Mobile version menu of my Wordpress theme should be loaded.</li> <li>otherwise, if the screen.width is bigger, the desktop menu version should be loaded</li> <li>a solution based just on CSS Media queries is not acceptable since the desktop version is too heavy.</li> </ul> <p>So I decided to conditional dynamically load content through <a href="http://wicky.nillia.ms/enquire.js/" rel="nofollow">enquire.js</a> The first part of my WP-homepage-template.php is:</p> <pre><code>enquire.register("screen and (max-width:1080px)", { &lt;script type="text/javascript"&gt; match : function() { $("body").load( "/path/headernav-phone.php" ); unmatch : function() { $("body").load( "/path/headernav-desktop.php" ); } } </code></pre> <p>So, when the size of the screen hits 1080px, Wordpress should to load headernav-phone.php which contains just a wp_nav_menu(MOBILE) call. If the screen size is bigger, Wordpress loads headernav-desktop.php which includes wp_nav_menu(DESKTOP).</p> <p>This doesn't work:</p> <blockquote> <p>Fatal error: Call to undefined function wp_nav_menu() in /XX/YYY/ZZZ/webseiten/XXX.YY/wp-content/themes/MyTheme/templates/headernav-phone.php on line 14</p> </blockquote> <p>It looks like that my code is run before the CMS, and it breaks its own functions.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload