Skip to content

Instantly share code, notes, and snippets.

@leepettijohn
Created June 24, 2016 18:10
Show Gist options
  • Save leepettijohn/13ff0cf66e32a74edf6d5f8818d228fd to your computer and use it in GitHub Desktop.
Save leepettijohn/13ff0cf66e32a74edf6d5f8818d228fd to your computer and use it in GitHub Desktop.
Genesis - Add search icon to search box and change search text
<?php
//* Do NOT include the opening php tag
//* Enqueue Dashicons
//* CHECK YOUR functions.php FILE FIRST!
add_action( 'wp_enqueue_scripts', 'b3m_enqueue_dashicons' );
function b3m_enqueue_dashicons() {
wp_enqueue_style( 'dashicons' );
}
//* Use dashicon for search button
//* http://melchoyce.github.io/dashicons/
add_filter( 'genesis_search_button_text', 'b3m_search_button_dashicon' );
function b3m_search_button_dashicon( $text ) {
return esc_attr( '&#xf179;' );
}
//* Customize search form input box text of Genesis child themes
add_filter( 'genesis_search_text', 'b3m_genesis_search_text' );
function b3m_genesis_search_text( $text ) {
return esc_attr( 'Search my blog...' );
}
.search-form {
position: relative;
}
.search-form > input {
padding-left: 40px;
}
.search-form input[type="submit"] {
background: none !important;
border: none;
clip: inherit;
color: #4a545a;
display: inline-block;
font: 28px/1 'dashicons';
height: 38px;
padding: 0 10px 0 12px;
position: absolute;
left: 2px;
top: 12px;
vertical-align: top;
width: 38px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment