如何使用Wordpress创建这样的按钮?

如何使用Wordpress创建这样的按钮?,wordpress,button,Wordpress,Button,我对WordPress很陌生(tbh,这是我第一次使用它)。我需要做一个网站作为我的学校项目使用CMS。使用模板创建页面是可以的,但是我在按钮方面有很多问题。我找到了这个网站,我可以用WordPress看到它。我需要这样的按钮在这个页面上(他们出现时,你在图像悬停)。这是WordPress中按钮的默认选项吗?如果没有,是否有此插件,或者如何将它们添加到我的图像中?首先安装Elementor插件 当您添加按钮并使用elementor打开页面时,请转到第页 并拖放任何元素,如按钮、空格、文本编辑器等

我对WordPress很陌生(tbh,这是我第一次使用它)。我需要做一个网站作为我的学校项目使用CMS。使用模板创建页面是可以的,但是我在按钮方面有很多问题。我找到了这个网站,我可以用WordPress看到它。我需要这样的按钮在这个页面上(他们出现时,你在图像悬停)。这是WordPress中按钮的默认选项吗?如果没有,是否有此插件,或者如何将它们添加到我的图像中?

首先安装Elementor插件 当您添加按钮并使用elementor打开页面时,请转到第页
并拖放任何元素,如按钮、空格、文本编辑器等。

您有几种方法可以实现这一点:

  • 覆盖Wordpress CSS
  • 使用插件
  • 创建自己的短代码
  • 1-覆盖Wordpress CSS

    如果您使用wordpress模板显示所有元素,并且您唯一的问题是在图像上显示按钮,那么这应该只是CSS的问题

    2-使用插件

    这里的想法是找到一个插件,帮助你创建/显示你需要的信息(也许你需要通过自定义字段或使用一个插件向基本帖子添加功能性)

    一旦你找到了正确的插件,如果插件没有直接提供一些设计上的设置,那么你就必须覆盖插件的CSS规则来显示你想要的元素

    3-创建您自己的短代码

    如果你是Wordpress的新手,我不会推荐这种方法,因为它有点高级,除非你对PHP/HTML/CSS(可选JS)很熟悉。 这是一个更灵活的解决方案,因为您基本上可以控制任何东西,但它需要您了解Wordpress的一些核心概念以及如何工作

    这里的想法是创建一个。 这个短代码引用了一个定制的PHP函数,在该函数中,您可以创建一个定制请求,从Wordpress数据库中获取需要显示的信息,并将其显示在您决定的HTML结构中。 然后angain,你只需要通过CSS定制它


    注意:如果您决定创建一个短代码,则无需创建整个插件,您可以使用template functions.php文件来实现此目的。

    非常感谢!