Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

One Page Menu

one page menu
    • 8 years, 6 months ago Rachel
      Participant

      Expired

      Hi,

      I’m looking to replicate the menu you use in your One Page demo https://codeless.co/specular/onepage/

      I’ve tried all the default options, but none have the side brackets on hover as per the demo. Which option was used?

      I’ve also created a One Page menu but the colour does not change to the appropriate section when in that section.  Is there a trick to that?

      See https://manukalife.mystagingwebsite.com/ for my menu reference.

      Thanks!

    • 8 years, 6 months ago Mirela
      Participant

      Hello,

      The menu with brackets is an old version of one page. We have removed it in quite some updates before. To reproduce it, add this code at the end of your style.css file:

      /* Effect 1: Brackets */
      .background--dark nav .menu > li > a:hover {
      color: #0c93d6 !important;
      }
      .header_1 nav .menu > li > a::before,
      .header_1 nav .menu > li > a::after {
        display: inline-block;
        opacity: 0;
        -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
        -moz-transition: -moz-transform 0.3s, opacity 0.2s;
        transition: transform 0.3s, opacity 0.2s;
      }
      
      .header_1 nav .menu > li > a::before {
        margin-right: 10px;
        content: '[';
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        transform: translateX(20px);
      }
      
      .header_1 nav .menu > li > a::after {
        margin-left: 10px;
        content: ']';
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        transform: translateX(-20px);
      }
      
      .header_1 nav .menu > li > a:hover::before,
      .header_1 nav .menu > li > a:hover::after,
      .header_1 nav .menu > li > a:focus::before,
      .header_1 nav .menu > li > a:focus::after {
        opacity: 1;
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        transform: translateX(0px);
      }
      .header_1 nav .menu > li:last-child a{padding-right:0; margin-right:0;}
      .sticky_header .header_wrapper.header_1{
        -moz-box-shadow: 0 3px 5px rgba(0,0,0,0.04);
        -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.04);
        box-shadow: 0 3px 5px rgba(0,0,0,0.05);
      }
      
      /* End Header 1 */
      

      -Did you set up page as a one page? Please check in page’s General Settings > Page Options & Style > Use menu as one page menu.
      I see you do not have a sticky header. If you scroll back to the top, this means that the section you are now is the first section, so the first menu item will be highlighted.

      Let us know.

      Best regards!

    • 8 years, 6 months ago Rachel
      Participant

      Expired

      Great thank you.

      One final menu question – I’m having issues hiding the dropdown menu on the menubar. I’d prefer it not to display.

      Show Responsive Menu Dropdown is switched to off, yet it still shows.  Do i need to deactivate anywhere else?

      Thanks,

    • 8 years, 6 months ago Mirela
      Participant

      Hello,

      The “Show Responsive Menu Dropdown” option is to display menu in mobile. Do you want to remove the drop-down menu items from the normal layout (desktop)? In this case the fastest way is to remove them from menu altogether. Go to Appearance > Menus, and edit your main menu.

      I don’t see any sub-menus in your site. Are you perhaps referring to the extra side navigation? See screenshot. In this case go to General Options > Layout > Extra Side Navigation, set it OFF.

      Let us know.

      Best regards!

    • 8 years, 6 months ago Rachel
      Participant

      Expired

      You’ve perfectly answered all my questions :)

      Thank you!

      Please close the ticket.

      Cheers,

Viewing 4 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password