类似这样的网站在wordpress上可以实现吗？

尝试创建类似于此主题的网站https://www.beefitswhatsfordinner.com/, 在WordPress上可以实现吗？

我正在尝试避免使用代码, 因为我将使用插件, 但以下是我目前正在尝试的方法。

平台是wordpress, 页面构建器是elementor, 此HTML代码段位于elementor块的HTML标签内

<sectiona>
<ul>
    <li>
        <a>
            Button 1
        </a>
        <img src="/wp-content/uploads/2019/11/1.jpg">
    </li>
    <li>
        <a>
            Button 2
        </a>
        <img src="/wp-content/uploads/2019/11/2.jpg">
    </li>
    <li>
        <a>
            Button 3
        </a>
        <img src="/wp-content/uploads/2019/11/3.jpg">
    </li>
    <li>
        <a>
            Button 4
        </a>
        <img src="/wp-content/uploads/2019/11/4.jpg">
    </li>
    <li>
        <a>
            Button 5
        </a>
        <img src="/wp-content/uploads/2019/11/5.jpg">
    </li>
    <li>
        <a>
            Button 6
        </a>
        <img src="/wp-content/uploads/2019/11/6.jpg">
    </li>
</ul>

<style>
 sectiona{
 position: absolute;
 width: 100%;
 height: 100vh;
 }

ul{
width: 100%;
background: rgba(0, 0, 0, .2);
box-sizing: border-box;
-moz-column-count: 2;
-moz-column-gap: 2px;
-webkit-column-count: 2;
-webkit-column-gap: 2px;
column-count: 2;
column-gap: 2px;
text-align: center;

 }

 ul li
 {
 list-style: none;
  } 

 ul li a
 {
 display: block;
 top: 0;
 text-align: center;
 line-height: 50px;
 color: #fff;
 font-size: 24px;
 cursor: pointer;
 transition: 0.5s
  }

 ul li a:hover
 {
 background: #ff0;
 color: #000;
  }

 sectiona img
 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -2;
transition: 1s;
opacity: 0;
 }

ul li a:hover + img
{
opacity: 1;
 }
</style>

#1

WordPress只是一个CMS。

因此, 你可以使用它来构建任何站点, 最困难的部分是前端。

你可以扩展帖子类型并添加帖子类型, 添加类别以实现更复杂的内容结构。