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

Switch earlier to responsive menu

    • 7 years, 4 months ago netyard
      Participant

      Expired

      Hi team,

      I am using specular theme and I would like to switch to reponsive menu not under 980px but ealier. I need responsive menu when the width is getting under 1050px. How can I do that?

      Thx.

    • 7 years, 4 months ago Mirela
      Participant

      Hello,

      Please add this code into your custom css box in General Options:

      @media (max-width: 1050px){
      header#header #navigation {display: none !important;}
      .mobile_small_menu {display: block !important;}
      #logo { margin-left: 40% !important;}
      }

      Let us know.

      Best regards!

    • 7 years, 4 months ago netyard
      Participant

      Expired

      Sorry, but this did not change anything :-(

    • 7 years, 4 months ago Mirela
      Participant

      Hello,

      This is a code generated from the default online demo. If you want a more precise code, then send us a link of your site. So we can check it up.

      Best regards!

    • 7 years, 4 months ago netyard
      Participant

      Expired

      This reply has been marked as private.
    • 7 years, 4 months ago Mirela
      Participant

      Hello,

      I tried adding this code via inspect element:

      @media (max-width: 1055px){
      .mobile_small_menu {
          display: block !important;
      }
      #navigation {
          display: none !important;
      }
      #logo {
          float: right !important;
      }}

      And this is the result: https://postimg.org/image/dev31vmdx/
      Can you please try again? make sure to not have any errors in previous code that could interfere with the right execution of this block.
      Let us know.

      Best regards!

    • 7 years, 4 months ago netyard
      Participant

      Expired

      That works for me. Is it possible to switch the header to white without transparency like in smartphone view when I switch? As the menu symbol is grey and not good to see then.

    • 7 years, 4 months ago Mirela
      Participant

      Hello,

      Yes, sure. Inside the @media (max-width: 1055px) rule, add this code as well:

      header#header {
          background-color: white !important;
      }

      So the result code with be:

      @media (max-width: 1055px){
      .mobile_small_menu {
          display: block !important;
      }
      #navigation {
          display: none !important;
      }
      #logo {
          float: right !important;
      }
      header#header {
          background-color: white !important;
      }
      }

      Best regards!

    • 7 years, 4 months ago netyard
      Participant

      Expired

      Sorry, but this did not change anything. Could you check it on our webpage? I’ve added the code.

    • 7 years, 4 months ago Mirela
      Participant

      Hello,

      I checked your site and the header is already white in ipad mode. I suggest you clear cache first and then refresh pages.

      Best regards!

Viewing 9 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