Solved

adding a search box to wordpress page

Posted on 2013-01-14
11
466 Views
Last Modified: 2013-01-22
Hello,

I have gone through a few forums as well as the knowledge base on here and can't seem to find the answer to what I'm looking for. Part of our company site is a blog page found at:
http://www.gobrightwing.com/category/skyrocket
I would like to add a search box all the way to the right of the 'linkedin' link in the blue banner part. The search box would then search all blogs that have been uploaded to the site. Could someone please help me with the code I need and where to put that code? Thank you kindly!
0
Comment
Question by:RTCexpert
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 5
11 Comments
 
LVL 2

Expert Comment

by:ConnerT
ID: 38776217
Hi There Hopefully This bit of code should get you a search box :)

1
Visit the wp-admin sub-directory of your WordPress website and log into the Dashboard. Navigate to "Appearance" and click the "Editor" link to load the "Edit Themes" screen.

2
Locate the template file you want to edit in the list under "Templates" and click its link. Each template file controls a certain page type or a part of the overall theme, such as the sidebar or the header. File names for templates relate to their function within the theme, so editing footer.php, for example, will change the footer.

3
Place the following code into the file where you want the search box to appear:

<?php get_search_form(); ?>

Save the updated template file. The search box will now appear in your theme on the pages controlled by the template you edited.

also note that the box will be overridden if other theme settings are obstructed

Hope this helps !
0
 

Author Comment

by:RTCexpert
ID: 38776317
When I add the code to where those links are in the skyrocket banner, it ends up adding 2 boxes, one with a quote symbol in it, and a second box to the right with the word Search between two quotes, both between the banner and newest blog. And seemingly not having any search functionality...I am able to edit the code to add, say a link to google, to the right of the linkedin link...
0
 
LVL 2

Expert Comment

by:ConnerT
ID: 38776342
Can i ask what theme are you using as there may be an option to add one under:

Theme Options>Appearance and have a look at the theme options there may be already one coded for you.

Hope This Helps
-ConnerT
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:RTCexpert
ID: 38776401
It's a custom theme that was built for the company. Doesn't look like anything is available in the theme options that I can tell. I'll keep digging and see if there are other ideas. I appreciate the assistance.
0
 
LVL 2

Accepted Solution

by:
ConnerT earned 500 total points
ID: 38776428
Also you could try another method.

Navigate to header.php via Dashboard> Appearances >Edit

then paste this code at the top changing the URL to your website(s)

<form method="get" class="searchform " action="WEBSITE_HERE"> <input type="text" name="s" class="searchfield" value="Search" onfocus="if (this.value == 'Search') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search';}"> <input type="submit" class="searchsubmit" value="" name="searchsubmit"> </form>

Hope This Helps

Regards Again
-ConnerT
0
 

Author Comment

by:RTCexpert
ID: 38778184
Thanks again for the help. Looks to be getting closer. This code in the header.php now has a search bar with a button that functions, however, it is putting it on every page rather than just the blog page, "skyrocket", and it is at the top of the page rather than in the 'video banner' where the links for rss feed, facebook, twitter and linkedin are.
0
 

Author Comment

by:RTCexpert
ID: 38778207
If I put that newer code you suggested on the loop-blog.php instead under the code for the social media links, it puts the search bar above the newest blog post. Now if I could just get it to the right side of the blue banner bar where the social media links are, that'd be great. Sincerely appreciate your help. Here is a link to show you where it's at so far:
http://www.gobrightwing.com/category/skyrocket
0
 
LVL 2

Assisted Solution

by:ConnerT
ConnerT earned 500 total points
ID: 38778935
Ok i see why this isn't working as the document you want to modify actually consists of a DIV so the Media/Social tags are just elements which means that the search bar will appear infront of the media tags try centring the code (done below) and paste it outside the <div> tags in the header.php document

<center><form method="get" class="searchform " action="WEBSITE_HERE"> <input type="text" name="s" class="searchfield" value="Search" onfocus="if (this.value == 'Search') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search';}"> <input type="submit" class="searchsubmit" value="" name="searchsubmit"> </form></center>

Open in new window


Hopefully this should work if not then i will try again to help !

Regards
-ConnerT
0
 

Author Comment

by:RTCexpert
ID: 38779062
There doesn't seem to be any <div> tags in the header.php.
0
 
LVL 2

Assisted Solution

by:ConnerT
ConnerT earned 500 total points
ID: 38779100
Then just add the code in manually under where you see any reference to the Media/Social icons

Regards
-ConnerT
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 38781498
Once you get the placement of the search form where you want it, you can control which types of content it appears on by using two simple WordPress conditionals:

<?php if ( is_category() or is_single() ) { ?>
       //form code goes here
<?php } ?>

Open in new window


So if you prefer to add the search form in the header, use the above code to limit the display to any category archive or single post display.  WordPress Pages will be skipped.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Transferring a wordpress site from a host or local dev server to another host can be a pain. So I've included my steps on how I have accomplished this task. Steps include an assumption that you have Cpanel access or Ftp access.. If you do not hav…
Do you think that WordPress is just for blogs?  Think again!  WordPress is really a fantastic all around platform that you can use to develop websites on.  Integrated into its basic functionality is the ability to create pages using your choice of a…
The purpose of this video is to demonstrate how to automatically show related posts at the bottom of a blog post in WordPress. This will be demonstrated using a Windows 8 PC. Plugin “Yet Another Related Posts Plugin” will be used. Go to your…
The purpose of this video is to demonstrate how to insert an Iframe into WordPress. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp-login.php : Open Page or Post…

695 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question