WordPress.org

Ready to get started?Download WordPress

Forums

Twenty Twelve
Search bar in the main menu OR in a container div containing both in floats (21 posts)

  1. rdg@me.com
    Member
    Posted 1 year ago #

    Ultimately I want to put the search bar into the main menu. Given that there is more than one way to make an omelette, I appreciate I could put it as the last child of the menu and position it using css OR I could create a container div which floats the menu to the left and floats another container to the right which hosts the search bar.

    My query then is which of the two techniques might be better and if the former solution is better; the search bar in the menu, how the hell do I do it?

  2. HaHaYouSuck
    Member
    Posted 1 year ago #

    I put it in the header and really like it there. But then I moved the menu elsewhere. Maybe this would work for you in a custom menu somewhere?

    <div class="alignright" margin= "1rem">
    	<?php get_search_form(); ?>
    </div><!-- .alignright -->
    <!--end addition of search bar in header -->
  3. rdg@me.com
    Member
    Posted 1 year ago #

    I've got mine currently in the header in the same way but I think I'd like to persevere with trying to put it in the menu itself as the last child of the menu. I'll see what I can dig up in other posts. I'm sure it's going to need a function in the functions.php file but I think I'll be able to find posts on that as it's not Twenty Twelve specific. It's when you want to modify Twenty Twelve specifically you come across more problems as its a newish theme and there is less written about modifying it.

    Thanks for your reply.

    r

  4. alchymyth
    Forum Moderator
    Posted 1 year ago #

    any websearch 'add search bar to custom menu wordpress' might have resulted in some useful links;
    related:
    http://www.wprecipes.com/how-to-automatically-add-a-search-field-to-your-navigation-menu
    http://diythemes.com/thesis/rtfm/add-search-form-wp-wordpress-nav-menus/

  5. rdg@me.com
    Member
    Posted 1 year ago #

    My original post wasn't well written. The purpose of the post was to ask whether others felt it was a better technique to include the menu in the header or in the menu aesthetically and for logistical reasons although in my final line I asked for a 'how to'.

    The first respondent responded to the initial part of the question. He/She was happy to have it in the the header.

    My subsequent post reiterated that, should I consider that putting the search bar in the menu was a better option, then it was my responsibility to put in a little research before posting for a solution.

    Accepting that the original post was unambiguous in that it ended with a request for a solution, the sarcasm of the tone of the moderator's response aggravated me somewhat although I do VERY much appreciate that the moderator directed me towards a solution in their post.

    I'm a teacher (during the daytime) and so I appreciate more than most that the 'learned' should value the desire of the 'learner' to 'learn'.

    Less sarcasm would be appreciated by the users of the forum although we VERY much appreciate the help you give us.

    A request, though; please respect the fact that we are learning and doing all we can to learn. And your place on the web is a place of knowledge. We don't always inherently understand your frustrations at being asked a question that has been asked before as we don't do your job as you don't do ours. I'm only a coder by night. During the day I teach other things.

    You slapped my wrists and I'm now slapping yours.

    Finishing I reiterate that, while I haven't yet finished implementing the solution, I only know of it on the basis of your post. But your job isn't to be sarcastic (if you are paid for it). It is to help the 'less learned' to learn.

  6. Andrew
    Forum Moderator
    Posted 1 year ago #

    I don't think Alchymyth was being sarcastic, but factual.
    A moderator doesn't have a responsibility. If a moderator had a responsibility, it would be to moderate the forum.

    If you're not satisfied with the level of support provided by these forums, try hiring someone at http://jobs.wordpress.net .

  7. rdg@me.com
    Member
    Posted 1 year ago #

    Andrew his help was perfect. He responded to a post and gave me directions towards a solution which I very much appreciate and might allow me to move on with the development of my site. I fully understand that this forum is not a place to ask for someone to write your code for you and tried as best as I could to reiterate in my response to him that my original post was not well written and came across as asking for a 'quick fix' which I fully understand is not the point of any technical forum. It's about techniques that we share between us that allow us to move on together.

    I repeat. I didn't like is tone. I taught a group of 14 year olds today to teach them about density as a concept. If I had said to them "how ignorant you are to not have first searched the available literature before asking me an 'obvious' question, do you really consider I would be 'in the right'? It might have been an obvious question to me who already knows but to him it was a part of the learning process.

    We're arguing over semantics, this isn't the place and I ABSOLUTELY agree that my original post was 'late night' and not well written. I'm in the wrong here. I wrote a crap question or included a crap part in a genuine question. I stand, nonetheless by what I wrote earlier. Learners make mistakes and the learned should allow a degree of tolerance of these. Read the thread from start to beginning. The original post wasn't meant to be a 'write me my code for me request'. It was nothing other than 'late night' and I shall do everything I can to avoid repeating my mistake.

  8. alchymyth
    Forum Moderator
    Posted 1 year ago #

    there is no 'tone' in my reply - it simply referred to the first paragraph of the forum guidelines - http://codex.wordpress.org/Forum_Welcome#Search_First

    imho, this forum is not setup to teach WordPress.

  9. adlawrence
    Member
    Posted 1 year ago #

    Hi all! I'm also trying to put my search box in my nav bar. (theme: Twenty Twelve Child, URL: http://reddoorreview.com )

    It looks like HaHaYouSuck's code is perfect, but I can't seem to figure out the best place to plug it in. Here's the code I want to plug it into, in the file: reddoorreview.com/wp-content/themes/twentytwelvechild/header.php

    <nav id="site-navigation" class="main-navigation" role="navigation">
    <h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
    <a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
    </nav><!-- #site-navigation -->

    However, if I place it just above

    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>

    then the search bar appears above the nav bar. If I post it below that same line of code, it's below the nav bar.

    I've searched other files and am coming up empty-handed. Suggestions?

    (I also tried the suggestions Alchymyth put forward before and neither worked for me. I also searched Google and the forums and didn't see an answer for the Twenty Twelve theme. If there is an answer posted about this, I'm very sorry I didn't find it.)

    Cheers!

  10. Andrew
    Forum Moderator
    Posted 1 year ago #

    Hi adlawrence, I think it would be best to start your own thread regarding this.

  11. steveshead
    Member
    Posted 1 year ago #

    I found this on the web, and currently use it on a test site. This will add a search box to all menus, if you have more than just the primary. This goes in the functions.php by the way.

    /**
     * Add a search bar to the navigation menu.
     *
     * @since Twenty Twelve 1.0
     */
    function menu_search($items){
        $search = '<li class="search">';
        $search .= '<form method="get" id="searchform" action="/">';
        $search .= '<label for="s" class="assistive-text">Search</label>';
        $search .= '<input type="text" class="field" name="s" id="s" placeholder="Search" />';
        $search .= '<input type="submit" class="submit" name="submit" id="searchsubmit" value="Search" />';
        $search .= '</form>';
        $search .= '</li>';
    
        return $items . $search;
    }
    add_filter('wp_nav_menu_items','menu_search');

    If you have more than one navigation menu I've found the easiest way to remove it from unwanted menus is to use CSS. For instance I have a header widget with a custom menu in it, but I don't want the search function in there. I used this CSS:

    #headerWidget .search {
         display: none;
    }

    I'm not an expert in PHP so I find the above the easiest way to remove something like that. Feel free to use, or not as the case may be.

  12. adlawrence
    Member
    Posted 1 year ago #

    Steveshead, thanks for posting the php. Instead of pasting the code into the parent theme's functions.php file, I created a new one for my child theme and pasted it into there. However, it isn't working. I'm not sure if it's because the code doesn't work on my site or if I missed something when I created the PHP file. Here's all of the code in that one file:

    <?php
    /**
     * Twenty Twelve Child functions and definitions, added for RedDoorReview.com.
     */
    
    /**
     * Add a search bar to the navigation menu.
     *
     * @since Twenty Twelve 1.0
     */
    function menu_search($items){
        $search = '<li class="search">';
        $search .= '<form method="get" id="searchform" action="/">';
        $search .= '<label for="s" class="assistive-text">Search</label>';
        $search .= '<input type="text" class="field" name="s" id="s" placeholder="Search" />';
        $search .= '<input type="submit" class="submit" name="submit" id="searchsubmit" value="Search" />';
        $search .= '</form>';
        $search .= '</li>';
    
        return $items . $search;
    }
    add_filter('wp_nav_menu_items','menu_search');

    [Signature moderated]

  13. steveshead
    Member
    Posted 1 year ago #

    Hmm - I've used this a few times with no issue. Are you using a menu built in the admin panel, or just the default menu?

  14. adlawrence
    Member
    Posted 1 year ago #

    Default menu.

  15. steveshead
    Member
    Posted 1 year ago #

    Try creating a menu in admin/appearance/menu - that might be why it's not showing.

  16. adlawrence
    Member
    Posted 1 year ago #

    You are f-ing awesome. Thanks, steveshead. You not only helped me solve this problem, but another I've been wondering how to fix. That's the fastest navbar I've ever made. Thanks again!

    P.S. My website is: http://reddoorreview.com

  17. steveshead
    Member
    Posted 1 year ago #

    No problem - glad I could help!

  18. dylan
    Member
    Posted 1 year ago #

    I'm using this too, and it's great! Thanks for the tips!

  19. adlawrence
    Member
    Posted 1 year ago #

    I'm using this too, and it's great, but I don't see how to get the search box to float in the same line as the other menu items. In my case, it breaks to a second line. did you do anything in CSS to make it work?

    Dylan, if you are asking me: I didn't touch my CSS file. Good luck!

  20. steveshead
    Member
    Posted 1 year ago #

    Hey Dylan - did you get your issue sorted out?

  21. robmanbo
    Member
    Posted 9 months ago #

    I'm having the same issue as Dylan. I actually created a blank space on my site for a search box by shortening the menu bar as to not parallel the entire header image and I believe that white box in the corner is now PART of the header image.

    I'd like to somehow fill it with a good looking search box. Any ideas?

    Thanks!

    http://howtoincreaseconcentrationnow.com/

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.