0

I am trying to build a Wordpress theme with boostrap.almost every part is complete but the nav menu is giving me some trouble for days. I would like the dropdown to work like boostraps dropdown, but I do not know how to do this.

So I need:

To add the class "dropdown", if a menu-item has child-items. dropdown-toggle sticky-top also i need necessary bootstrap web srcs or download links and local src like this: get_template_directory_uri() . '/js/scriptname.js' Hope someone can help!

when i try https://github.com/wp-bootstrap/wp-bootstrap-navwalker , the page looks like:

enter image description here

Improve this question
3
  • There are plugins that will do this for you. If you want to DIY, you'll need a custom Nav Walker to add your required CSS classes, and download Bootstrap and enqueue all of its resources in a child theme.
    – WebElaine
    Commented Jul 2, 2019 at 13:20
  • will these plugins cause slow the website? if i can do it without plugin, it will be better for me so can you tell me the how to? i found some php files and codes but they didnt work fully.
    – Murat Deniz
    Commented Jul 2, 2019 at 13:27
  • A plugin won't slow down your website any more than putting the same code into a child theme will, and the added benefit of a plugin is someone else maintains the code and keeps it all up to date for you. But like I said, you can use a Nav Walker (like the one in Nathan's answer) and also enqueue the required CSS and JS files.
    – WebElaine
    Commented Jul 2, 2019 at 13:57

1 Answer 1

Reset to default
1

You will want to extend the Walker_Nav_Menu class. This allows you to "walk" through the various states of a navigation menu. One of the first google searches I did for the term Walker_Nav_Menu led me to this Github repo with a class already built. wp-bootstrap-navwalker.

Improve this answer
4
  • when i try github.com/wp-bootstrap/wp-bootstrap-navwalker , the page looks like: [link]i.ibb.co/Gtkz0md/Acbds-z.png[/link] how can i fix this situation? only one difference that i added is " sticky-top" and when i remove it, the picture doesnt change
    – Murat Deniz
    Commented Jul 2, 2019 at 15:40
  • Sorry, I don't know. It looks like you might need some styling? Not sure what I'm looking at.
    – Nathan Powell
    Commented Jul 2, 2019 at 20:45
  • while hamburger buton apears - the menu is in default closed position-, also menu content -page links- apears.other than this problem, everythings good but you know i cant use it with its now situation
    – Murat Deniz
    Commented Jul 2, 2019 at 21:57
  • Without knowing your HTML, JS and CSS I couldn't say what the problem is. Do you have a live version viewable to public?
    – Nathan Powell
    Commented Jul 3, 2019 at 13:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.