Javascript 在Wordpress中，如何在标题部分创建搜索表单？

我已经为我的电子商务网站购买了一个wp主题。在主题的标题部分有一个搜索图标。当我单击时，它将打开，再次单击它将关闭。我需要隐藏搜索图标，搜索表单始终保持打开状态。怎么做？我在theme文件夹中找到了一个custom.js文件，并找到了如下所示的搜索代码

// Show / Hide Search
    $( '.menu-search' ).toggle( function(){
        $('body').addClass('show-site-search');
        $( '.site-header .search-block' ).animate( { opacity: '1' }, 200 );
        $( '.site-header .search-field' ).focus();
    },function(){
        $( '.site-header .search-block' ).animate( { opacity: '0' }, 200, function() {
            $('body').removeClass('show-site-search');
        });
    });

});

$(window).resize(function () {

    $( '.home-slider-block-inner').height( $( '.home-slider-block-bg').outerHeight() );

}).resize();

$(window).load(function() {

    themename_home_slider();

});

//CSS部分
.搜索btn{
填充：5px 0 5px 5px；
光标：指针；
}
.搜索块{
显示：无；
位置：绝对位置；
背景色：rgba（0,0,0,0.9）；
边框：1px实心rgba（0,0,0,0.6）；
边界顶部：0；
底部：0；
右：20px；
填充：12px 0 12px 12px；
z指数：6；
-webkit转换：底部0.3s到0.0s；
-moz转换：底部0.3s到0.0s；
-ms转换：底部0.3s到0.0s；
-o型过渡：底部0.3s到0.0s；
过渡：底部0.3s到0.0s；
}
.搜索块.搜索字段，
.search块。产品搜索输入[type=“text”]。产品搜索字段，
.aws容器.aws搜索字段{
字体大小：16px；
保证金：0；
边框：1px实心rgba（0,0,0,0.18）；
边界半径：0；
背景色：#FFF；
宽度：280px；
字号：200；
大纲：无；
颜色：继承；
框大小：边框框；
}
.搜索块.搜索提交{
显示：无；
}

将class

show site search

的CSS设置为

display:block

.show-site-search {
    display: block;
}

这只会让它一直显示出来

然后，我建议删除JS about add/remove类，当用户单击它时，它将停止这样做，就像用户单击它一样，它将消失一样

---

要获得更详细的回复，请添加该部分的HTML以及屏幕截图或链接，以便我们能够准确地看到它目前的样子。

请包含包含该元素的HTML（使用class

。search block

）。还请包括应用于元素的CSS。我已经编辑了帖子。我已经编辑了帖子并插入了所需的代码。