[Theme: Frontier] how to create navigation bar

  • Resolved Matilda F

    (@matilda-f)


    10 years, 9 months ago

    I want my home page to have a horizontal nagivation bar with menu choices like Home| About| Resources | Articles, etc.

    In WordPress themes gallery, Frontier is shown to have a menu bar under the header. But the actual theme only supports two menu titles and forces them to appear aligned left under each other.

    The URL of the website I am building is https://www.matildafaltyn.com.

    You can see that in red text, which is nearly invisible against the background, is one menu item and that is ‘About’. There is no blue menu bar under the header just the background texture poking through. Why is it doing this?

    Also, how do you change the text colour of menu titles?

Viewing 4 replies - 1 through 4 (of 4 total)

  • Do you have 2 menus in Appearance > Menus?
    Do you have them set in Appearance > Customize?
    Do you have the topbar menu set in Appearance > Frontier Options?

    Thread Starter Matilda F

    (@matilda-f)

    Hi Batharoy,
    Yes to all three questions above. I re-checked, and didn’t have topbar and primary set in the Menu pane.

    Now you can see three menu items below the header, but they are aligned under each other (as per Frontier default theme).

    I’ve made a child of the theme. Thinking will have to scrutinise the code in Editor and apply code snippets.

    Looks like header image has a fixed width as unable to stretch it across the page. Would code snippet fix?

    Also would a code snippet fix my prob with the menu bar aligning left.

    Thank you.

    I h

    For the image header, it is not as wide as the content area so it will not stretch the full width unless told to with css. BUT that will either distort or enlarge the image so it’s not as clear.

    For the menu, the li & ul elements have a float: left applied to them. It can easily be fixed with this code.

    #nav-main .nav-main {
    float: none;
    text-align: center;
    border-left: none;
    border-right: none;
}
#nav-main .nav-main li {
    float: none;
    display: inline-block;
}
    Thread Starter Matilda F

    (@matilda-f)

    Thank you Batharoy. Have a great week.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘[Theme: Frontier] how to create navigation bar’ is closed to new replies.