Home > WordPress > How to Move the Search TextBox in Header of iNove Theme of WordPress

How to Move the Search TextBox in Header of iNove Theme of WordPress

November 26th, 2009 Masino Sinaga Leave a comment Go to comments

This modification will move the search textbox from the header to the sidebar of iNove theme in WordPress. This is useful if your menu in the header increase so the width of all of your menu in the header will collide to the search textbox in the same location. You can see the result on this blog.

Open your \wp-content\themes\inove\templates\header.php file, then move or cut and paste this following code to the \wp-content\themes\inove\sidebar.php file (adjust it with the location whether to north, west, east, or south of the sidebar):

41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90

	<!-- searchbox START -->
	<div id="searchbox">
		<?php if($options['google_cse'] && $options['google_cse_cx']) : ?>
			<form action="http://www.google.com/cse" method="get">
				<div class="content">
					<input type="text" class="textfield" name="q" size="24" />
					<input type="submit" class="button" name="sa" value="" />
					<input type="hidden" name="cx" value="<?php echo $options['google_cse_cx']; ?>" />
					<input type="hidden" name="ie" value="UTF-8" />
				</div>
			</form>
		<?php else : ?>
			<form action="<?php bloginfo('home'); ?>" method="get">
				<div class="content">
					<input type="text" class="textfield" name="s" size="24" value="<?php echo wp_specialchars($s, 1); ?>" />
					<input type="submit" class="button" value="" />
				</div>
			</form>
		<?php endif; ?>
	</div>
<script type="text/javascript">
//<![CDATA[
	var searchbox = MGJS.$("searchbox");
	var searchtxt = MGJS.getElementsByClassName("textfield", "input", searchbox)[0];
	var searchbtn = MGJS.getElementsByClassName("button", "input", searchbox)[0];
	var tiptext = "<?php _e('Type text to search here...', 'inove'); ?>";
	if(searchtxt.value == "" || searchtxt.value == tiptext) {
		searchtxt.className += " searchtip";
		searchtxt.value = tiptext;
	}
	searchtxt.onfocus = function(e) {
		if(searchtxt.value == tiptext) {
			searchtxt.value = "";
			searchtxt.className = searchtxt.className.replace(" searchtip", "");
		}
	}
	searchtxt.onblur = function(e) {
		if(searchtxt.value == "") {
			searchtxt.className += " searchtip";
			searchtxt.value = tiptext;
		}
	}
	searchbtn.onclick = function(e) {
		if(searchtxt.value == "" || searchtxt.value == tiptext) {
			return false;
		}
	}
//]]>
</script>
	<!-- searchbox END -->
  • Share/Bookmark
248 views Print This Post Print This Post

Categories: WordPress Tags: , , , , , , ,
  1. Ishank
    July 10th, 2010 at 19:41 | #1
    Reply | Quote

    I want to know “how can i add Google custom search on inove theme in order to display results on a page in my blog rather then opening results in new tab or new windows.

  2. Masino Sinaga
    July 10th, 2010 at 22:45 | #2
    Reply | Quote

    @Ishank

    Have you tried by setting it up from your Google Adsense code, for example, there will be a setting in the code management that telling us, something like: “Open result search in the same window” rather than “Open result search in the new tab/window” ?

  1. No trackbacks yet.