Viewing 18 posts - 1 through 18 (of 18 total)
  • Author
    Posts
  • May 19, 2016 at 3:54 am #91943
    J
    Participant

    How can I get the search function to be included in the menu list on smaller screens?

    May 19, 2016 at 1:14 pm #91972
    Mahesh
    Keymaster

    @jb: You’ll need to do some customizations for this. I recommend you to hire a customizer.

    Regards,
    Mahesh

    July 17, 2017 at 3:10 am #119251
    Derek Batty
    Participant

    Hi

    Can someone please help?

    I want to be able to display the “search box” which currently appears at the end of the primary menu bar although is hidden. It appears as a magnifying glass although you dont know it is there until your cursor falls over the top of it. So it is unseen until you do this.

    How can I make the search option visible rather than invisible or until I place my cursor over it? I still want it in the same area in the primary menu bar.

    The other problem is that when you do a search in the search box it falls down over and covers what is below it and or partially obstructs it from being viewed?? Seems odd functionality.

    Appreciate your help/support to make these changes easy. So far has been pretty frustrating and difficult working with Catch Themes web sites. Hope this can change.

    Thanks

    Derek

    July 17, 2017 at 6:40 am #119261
    Mahesh
    Keymaster

    @dbatty: Please post in your site url. Let us know what difficulties are you facing with Catch Themes websites so that we can help you further.

    Regards,
    Mahesh

    July 17, 2017 at 8:46 pm #119279
    Derek Batty
    Participant

    Hi Mahesh

    Thanks for your reply. The site is yet to go live yet as we havent finished it. Does that matter?

    So we want to see Search… at the end of where the main primary menu appears. If you run your cursor along the same menu line right to the right side of the page the Magnifying glass for search appears.

    Dont want this to be hidden from view, and preferably a box to with search… If cant include a box then the magnifying glass is fine.

    Difficulty has mainly been all of the coding needed to make changes. We are not very savvy with this and so it is a big learning curve. Time consuming trying to understand what we thought would be a reasonably simple thing to do to construct a web site?

    https://theancientpathways.com/

    Appreciate your help

    Thanks Mahesh

    July 18, 2017 at 12:30 am #119286
    Mahesh
    Keymaster

    @dbatty: The magnifying glass seems to be hidden because you’ve changed the navigation bar background to white. The default color of search icon is also white so it blends in and difficult to see. Go to Dashboard=> Appearance=> Customize= Additional CSS and add the following CSS.

    #search-toggle {
    color: #000;
}

    We have made the theme as simple as possible so the user finds it easy to use and customize as necessary through Customizer. But if you go through coding and you are not much familiar with programming, well it will obviously be difficult. We do provide help and support for customization within theme support scope. But if you need further customization beyond theme support scope, I recommend you to hire a customizer.

    Regards,
    Mahesh

    July 18, 2017 at 12:42 am #119288
    Derek Batty
    Participant

    Hi Mahesh

    Tried sending you a screen shot of what I want although it wouldnt attach to this forum reply.

    I have sent the screen shot to Sangeeta though via his email and have mentioned I have been speaking to you about this adjustment.

    Can you please let me know at your next earliest convenience.

    Thanks Mahesh

    July 18, 2017 at 12:43 am #119289
    Derek Batty
    Participant

    Hi Mahesh

    thanks and just received your reply. I must have been writing as you were sending. I will give your code a try.

    Thanks again

    July 18, 2017 at 12:49 am #119291
    Derek Batty
    Participant

    Thanks and yes worked although the other concern I mentioned to you was that the search bar drops down onto the picture below it rather than opening on the same line as the main menu items.

    i sent a screen shot as mentioned above to Sangeeta of where I would like it to appear.

    When you open the search on other pages as well it does the same thing although opens over the top of page writing.

    Can this be changed to open on the same line as Home About Podcasts Blog Contact us Search

    Thanks

    Derek

    July 18, 2017 at 4:04 am #119296
    Sakin
    Keymaster

    Hi Derek,

    I got your issued forwarded to me. To add the search in the primary menu, you can add the following css in “Appearance => Customize => Additional CSS” box:

    @media screen and (min-width: 991px) { 
	#search-toggle { display:none; }
	#search-container { clear: none; display: block; float: right; max-width: 300px; opacity:1; position: relative; bottom: auto; left: auto;  }
	.nav-primary .search-form { padding: 0 20px 0 10px; }
}

    Regards,
    Sakin

    July 19, 2017 at 3:34 am #119334
    Derek Batty
    Participant

    Hi Sakin

    Wow…great! Thank you so much for your help Sakin, exactly what we wanted.

    If there is anything else we need assistance with I will forward through.

    Great help thanks again!

    Derek

    July 19, 2017 at 3:48 am #119335
    Derek Batty
    Participant

    Hi Sakin

    If we were to make the search box slightly darker in shade and the word Search.. also how would I adjust the colours?

    Thanks

    Derek

    July 19, 2017 at 3:55 am #119336
    Derek Batty
    Participant

    Hi Sakin or Support

    Can you make the colour of the Primary Slider box on the home page transparent so there is no colour and the box is not seen?

    Thanks

    Derek

    July 19, 2017 at 3:57 am #119337
    Derek Batty
    Participant

    Additionally, the title words will still be seen although just not the slider Title Box which is currently in a opaic black.

    thanks

    Derek

    July 19, 2017 at 4:40 am #119338
    Sakin
    Keymaster

    Hi Derek,

    To change the color of the search box border and color to black, you can add the following css in “Appearance => Customize => Additional CSS”, if you want any other color, then you can change the color code in the following css as per your need and add it.

    .nav-primary .search-field { border-color: #000; color: #000; }

    For slider background, you can just remove the padding by adding the following css in “Appearance => Customize => Additional CSS”

    #feature-slider { padding-bottom: 0; }

    Regards,
    Sakin

    July 19, 2017 at 5:10 am #119339
    Derek Batty
    Participant

    Hi Sakin

    Thank you so much.

    The first code worked for the search box colour.

    The second code had no effect on the Featured Slider title box where Featured Slider Title appears when the slider changes.

    The black opaic box still appears, rather we don’t want to see the box just the words we entered into Feature Slider Title in customise.

    Thanks

    Derek

    July 19, 2017 at 6:09 am #119340
    Sakin
    Keymaster

    Hi Derek,

    For your site doesn’t have slider title. Anyway, if you add back the tile like in our demo https://catchthemes.com/demo/catch-responsive/, then you can add the following css to hide that black transparent box:

    #feature-slider .entry-container { background: transparent; }

    Regards,
    Sakin

    July 20, 2017 at 12:48 am #119363
    Derek Batty
    Participant

    Great thanks Sakin that has changed it!

  • Author
    Posts
Viewing 18 posts - 1 through 18 (of 18 total)
  • The topic ‘Primary Menu Search’ is closed to new replies.