WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Menubar issue - twentytwelve (8 posts)

  1. Arnoud
    Member
    Posted 1 year ago #

    I have a menubar with a few items.
    I have used functions.php to add a searchbox to the menu.

    What I would like is the text to be outlined to the left.
    and the searchbox to the far right.

    Functions.php search addition:

    function style_search_form($form) {
        $curLang = qtrans_getLanguage();
        $form = '<li><form method="get" id="searchform" action="' . get_option('home') . '/" >
                ' . __('') . '</label>
                ';
        if (is_search()) {
            $form .='<input align="right" type="text" value="' . attribute_escape(apply_filters('the_search_query', get_search_query())) . '" name="s" id="s" />';
        } else {		
    
    		if ($curLang == "nl")
    		 {
    		$form .='<input style="width: 155px; padding: 0px 0px 0px 5px;" type="text" value="Zoeken" name="s" id="s" onfocus="if(this.value==this.defaultValue)this.value=\'\';" onblur="if(this.value==\'\')this.value=this.defaultValue;"/>';
    		}
    		else {
    		$form .='<input style="width: 155px; padding: 0px 0px 0px 5px;" type="text" value="Search" name="s" id="s" onfocus="if(this.value==this.defaultValue)this.value=\'\';" onblur="if(this.value==\'\')this.value=this.defaultValue;"/>'; }
    
        }
        $form .= '</form></li>';
        return $form;
    }
    add_filter('get_search_form', 'style_search_form');
    
    add_filter('wp_nav_menu_items','add_search_box', 10, 2);
     function add_search_box($items, $args) {
    ob_start();
     get_search_form();
     $searchform = ob_get_contents();
     ob_end_clean();
    $items .= '
    ' . $searchform . '
    ';
    return $items;
     }

    CSS for the menu:

    .main-navigation ul.nav-menu,
    	.main-navigation div.nav-menu > ul {
    		border-bottom: 1px solid #ededed;
    		border-top: 1px solid #ededed;
    		display: inline-block !important;
    		margin-left:10px;
    		margin-right:10px;
    		text-align:left;
    		width: 958px;
    	}

    When I change text-algin: right the box is outlined to the right.
    But the text is also aligned right.
    That I don't want.

    How can I seperate the text from the searchbox for alignment?

  2. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Can you target just the search box, not the navigational menu items?

  3. Arnoud
    Member
    Posted 1 year ago #

    Sounds like a good option, but how would I accomplish that?
    I've been playing around with this for a few hours now. :)

  4. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    This is your search input field, right?

    $form .='<input align="right" type="text" value="' . attribute_escape(apply_filters('the_search_query', get_search_query())) . '" name="s" id="s" />';

    You've got the ID (S) in there, so why not use that?

    E.g;

    #s {
     /*your styles*/
    }
  5. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Okay I've misunderstood your issue.

    Can you provide a link to your webpage to illustrate it?

  6. Arnoud
    Member
    Posted 1 year ago #

    its not a public website, sorry.

    I do have a screenshot:

    1)
    http://oi46.tinypic.com/24o8ryo.jpg

    2)
    http://oi49.tinypic.com/2nsqfcw.jpg

    It needs to be algined with the images in the 'portfolio' column.

  7. Arnoud
    Member
    Posted 1 year ago #

    does that help to illustrate what I am attempting to do?

  8. Arnoud
    Member
    Posted 1 year ago #

    I used CSS to achieve my goal.

Topic Closed

This topic has been closed to new replies.

About this Topic