Search text / Menu text

Shapely
1

Hi!

I would like to change the text that appears when you hover over the search icon. I’ve tried to copy the inc/extras.php and add a edited version of it in my child-theme in the same file path, but without success. I realise I can just adjust the text in the core theme extras.php file, but I want to make sure the changes stay when the theme is updated.

I have a similar issue with the mobile menu. I’d like to add some text next to the “hamburger menu” but don’t know where or how to make these changes.

Any help would be highly appreciated. Thanks.

2

Hi @amandau,

I hope you are well today and thank you for your questions.

I would like to change the text that appears when you hover over the search icon. I’ve tried to copy the inc/extras.php and add a edited version of it in my child-theme in the same file path, but without success. I realise I can just adjust the text in the core theme extras.php file, but I want to make sure the changes stay when the theme is updated.

Could you please share me the screenshot of what text you want to change?

I have a similar issue with the mobile menu. I’d like to add some text next to the “hamburger menu” but don’t know where or how to make these changes.

Could you please share me the screenshot of where and what text you want to add?

Best Regards,
Movin

3

Thanks for the reply.

I’ve attached two screenshots as requested.

  1. Search.png shows the text I want to change, “Type here” and “Search”.

  2. Menu.png shows the menu as it looks when the website is viewed on a small screen. I’ve illustrated in Menu2.png how I want the text to appear next to the menu.

Where do I make these changes while making sure my website stays the same in future theme updates? As mentioned I have already created a child theme where I’ve made CSS, functions.php and template changes.

4
1) Search.png shows the text I want to change, “Type here” and “Search”.

You can change it by translating the theme as described on the following page.

Alternatively you can add the following code in the functions.php file of your child theme and change the text in the below code.

/*
 * Search Widget
 */
function custom_shapely_search_form( $form ) {
    $form = '<form role="search" method="get" id="searchform" class="search-form" action="' . home_url( '/' ) . '" >
    <label class="screen-reader-text" for="s">' . __( 'Search for:', 'shapely' ) . '</label>
    <input type="text" placeholder="'.  __('Type Here', 'shapely').'" type="text" value="' . get_search_query() . '" name="s" id="s" />
    <input type="submit" class="btn btn-fillded searchsubmit" id="searchsubmit" value="'. esc_attr__( 'Search', 'shapely' ) .'" />
    
    </form>';

    return $form;
}

function custom_get_search_form(){

    remove_filter( 'get_search_form', 'shapely_search_form', 100 );
    add_filter( 'get_search_form', 'custom_shapely_search_form', 101 );
}
add_action('init', 'custom_get_search_form');
2) Menu.png shows the menu as it looks when the website is viewed on a small screen. I’ve illustrated in Menu2.png how I want the text to appear next to the menu.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

.module.widget-handle.mobile-toggle:before {
    content: "Menu";
    display: inline-block;
    color: #000;
    margin-right: 10px;
}
.module.left.site-title-container {
    width: auto;
}
5

Perfect, both those solutions did it for me. Thanks a lot!

6

You are most welcome here :slight_smile: