How do you build a site where the pages have different navigation buttons and different header colors for instance, I would like for the about us page to have a different background color and different navigation button styles than the home page?
Here are a couple of things for you to look at.
- You need to be putting the code you need for this in the site code page (not the page code page). Site code will run on every page you build.
- The wix-location API gives you information about the page your code is running in so you can extract the relevant path information to drive your header manipulation.
- Use the $w.onReady() function to control how you decorate your header. Note the key information that is provided in the $w api docs…
Description
Use the onReady() function for code you want to run before the user starts interacting with your page.
The following code should be placed inside the onReady() event handler:
-
Initialization of element properties - Example: setting a text element’s initial text value.
-
Function calls on elements to set their initial state - Example: disabling a button.
-
Dynamic event handlers that you want bound when the page loads - Example: setting an event handler to be called when the mouse pointer enters an element.
*********>>>>>>>>> Return a Promise from the handler function to force the page to wait for your Promise to resolve before displaying the page to users.
If you use a .then() call to the onReady annonymous function you can perform the decorating before the page is rendered so you shouldn’t get any quirky effects. [At least that is how I read the docs ;-)].
Good luck