Viewing 2 posts - 1 through 2 (of 2 total)
-
AuthorPosts
-
January 3, 2024 at 7:29 pm #1429207
Main Menu Search Form Placeholder Text Color
<input id=”s” type=”text” name=”s” value=”” placeholder=”Search”
What css values do I need to change the font color of the word “Search”?
Also, where can I change the word itself from Search to the word of my choice?January 4, 2024 at 1:46 am #1429223Hey Jody,
Thank you for the inquiry.
You can use the following css code to adjust the style of the placeholder text.
::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #909; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #909; opacity: 1; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #909; opacity: 1; } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #909; } ::-ms-input-placeholder { /* Microsoft Edge */ color: #909; } ::placeholder { /* Most modern browsers support this now. */ color: #909; }
And to change the placeholder text itself, add this code in the functions.php file.
/* AJAX SEARCH */ if ( ! function_exists( 'avia_append_search_nav_mod' ) ) { //first append search item to main menu remove_filter( 'wp_nav_menu_items', 'avia_append_search_nav', 9997, 2 ); remove_filter( 'avf_fallback_menu_items', 'avia_append_search_nav', 9997, 2 ); add_filter( 'wp_nav_menu_items', 'avia_append_search_nav_mod', 9997, 2 ); add_filter( 'avf_fallback_menu_items', 'avia_append_search_nav_mod', 9997, 2 ); /** * * * @param string $items * @param array $args * @return string */ function avia_append_search_nav_mod ( $items, $args ) { if ( avia_get_option( 'header_searchicon', 'header_searchicon' ) != 'header_searchicon' ) { return $items; } if ( avia_get_option( 'header_position', 'header_top' ) != 'header_top' ) { return $items; } if ( ( is_object( $args ) && $args->theme_location == 'avia') || ( is_string( $args ) && $args = 'fallback_menu' ) ) { ob_start(); get_search_form(); $form = ob_get_clean(); $form = str_replace( '<form ', '<form role="search" ', $form ); $form = htmlspecialchars( $form ); /** * Avoid duplicate indexing or empty search page * * @since 4.5.3 * @param string $items * @param array $args * @return string */ $nofollow = apply_filters( 'avf_nav_search_icon_nofollow', 'rel="nofollow"', $items, $args ); $aria_label = __( 'Search', 'avia_framework' ); $aria_label = apply_filters( 'avf_nav_search_aria_label', $aria_label, $items, $args ); $items .= ' <li id="menu-item-search" class="noMobile menu-item menu-item-search-dropdown menu-item-avia-special" role="menuitem">'; $items .= '<a aria-label="' . $aria_label . '" href="?s=" '. $nofollow . ' data-avia-search-tooltip="' . $form . '" ' . av_icon_string( 'search', false ) . '>'; $items .= '<span class="avia_hidden_link_text">' . __( 'ADJUST THIS TEXT', 'avia_framework' ) . '</span>'; $items .= '</a>'; $items .= '</li> '; } return $items; } }
Replace “ADJUST THIS TEXT” with your own text.
Best regards,
Ismael -
AuthorPosts
Viewing 2 posts - 1 through 2 (of 2 total)
- You must be logged in to reply to this topic.