如何将wordpress主题菜单搜索.svg图标更改为自定义png

Question

我的 wordpress 主题顶部菜单搜索图标有问题，我想将其更改为自定义 .png 文件，显示“立即预订”，并将其功能从当前打开的搜索表单更改为简单的 url在网站中打开商店页面。

主题如下https://themes.waituk.com/entrada-default/

在摆弄 chrome 的网络工具和主题 styles.css 文件时，我设法确定搜索图标是一个 svg 文件，但发现该搜索图标在整个文件中被多次提及，但不确定是哪一个引用它，或者如果我需要更改主题结构中另一个文件中的某些内容。

任何帮助将不胜感激。

Answer 1

从你分享的链接中我可以看出，这里基本上有两件事需要理解：

1- 图标。 我找不到任何对 svg 文件的引用，可能是可下载的主题与您共享的演示页面不同。在这种情况下，搜索图标是由一个名为“icomoon”（https://icomoon.io/）的插件生成的，所以我建议将 span 类“icon icon-search”更改为一个新的类，并为你的新 png 图标自定义 css .

2- 搜索功能

搜索功能也被一个插件调用，在 jquery.main.js 的一个函数中：

// apply search plugin
$body.search({
        hideOnClickOutside: false,
        menuActiveClass: 'search-active',
        menuOpener: '.search-opener',
        menuDrop: '.form-group'
    });

在这里，您需要将“search-opener”类更改为其他内容或注释掉此功能，然后再根据需要修改链接。我希望这会有所帮助。