How to Integrate Bootstrap v4 NavBar into WordPress theme?


Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 118

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 119

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 118

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 119

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 118

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 119

I am using Bootstrap 4 and my menu structure like this:

Let’s start adding menu dynamically on wordpress custom theme. I am calling WP Nav in header.php file like this: Now, add this function in function.php file.

How to vertically center a div for all browsers?


Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 118

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 119

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 118

Notice: A non well formed numeric value encountered in /home/flexwebc/public_html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 119

Below is the best all-around solution I have found. Tested and working for all browser.

HTML

CSS