Adding a Search Bar to the Footer of a Turning Gate Website

Screen Shot 2015-04-05 at 3.12.59 PM

On all of my websites I have added a small search bar into the footer.  I had to create these search boxes on my own, but now that they are there I can share the code so that you can easily implement both types of search boxes. There are a few requirements for you to get started. First, you will need to have phplugins and custom CSS activated. Once this is done, the rest is easy. If you want the search bar to bring up blog posts from WordPress then paste this code into your phplugins.php file.


//FOOTER SEARCH FOR BLOG
function ttg_footer_top( $style, $path ) {
echo '
<form action="/" method="get">
<fieldset>
<input class="footsearch" type="text" name="s" id="search" placeholder="Blog Search" value="" />
<button type="submit" class="footsearch">Search</button>
</fieldset>
</form>
'; return true;
}//END

If, instead, you want the box to bring up results from your TTG galleries then use this code:

//FOOTER SEARCH FOR PHOTOGRAPHY
function ttg_footer_top( $style, $path ) {
echo '
<div id="search" class="collapse clearfix">
<form action="/search" method="GET">
<input type="text" id="q" name="q" placeholder="Photo Search" class="footsearch" value=""/>
<button type="submit" class="footsearch">Search</button>
</form>
</div> <!-- #search -->
';
return true;
}//END

After you have put the first piece of code into your phplugins.php file, then paste this code into your custom.css file so that the box isn't too big:


/*FOOTER SEARCH*/	
.footsearch{
	max-width: 150px !important;
	height: 20px !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	font-size: 12px !important;
	display: inline !important;
	}

That is it! Now you should have a fully formatted search bar in the footer of your website.

-Graceson Aufderheide

Tell your friends:
Share on FacebookGoogle+Pin on PinterestTweet about this on TwitterShare on LinkedInEmail to someone

Leave a Comment

Your email address will not be published. Required fields are marked *

four × three =


Welcome

This blog discusses Graceson's interests and ideas, including: Lightroom and Photoshop tips, photography discussions, jewelry crafting, new projects, gear reviews, and more.

Visit his Photography here.
Visit his Goldsmithing here.

About Me

Image of GracesonMy name is Graceson Aufderheide, but you have probably figured that out already. I am currently a senior in high school who photographs, teaches, and makes jewelry. I have always been creating, that is what I do.
Learn More About Graceson

Tell your friends:

Share on FacebookGoogle+Pin on PinterestTweet about this on TwitterShare on LinkedInEmail to someone

Photography Newsletter:

Donate

If this site and blog has helped you with your photography, editing, boredom or decisions please consider a small donation.