GreenShift教程-古腾堡动画和页面构建器块
简介
GreenShift是一款功能强大的 WordPress 插件，专为 Gutenberg（古腾堡）编辑器设计。让我们在不牺牲网站性能的前提下，创建高质量的页面排版和动画效果。
- 页面构建器块：包括高级容器、响应式设计、标签页（Tabs）、手风琴（Accordions）、轮播滑块（Sliders）、图像热点（HotSpot Block）等等。
- 动画功能：内置高级动画框架，支持滚动动画、悬停效果、自定义动画、渐变背景等交互动画功能。
- 性能优化：插件采用“按需加载”系统，只加载页面上实际使用的资产（CSS/JS），避免预定义框架、图标字体或脚本库的加载。
- ……
它的功能还非常多，我们就通过下面的系列教程一点点学习如何使用吧！
第1节 插件的安装和调用
登录WordPress后台，添加插件，搜索Greenshift，找到对应插件，安装并启用。
插件安装完成之后，当我们再次编辑页面或者文章的时候，就可以直接添加Greenshift的元素。
第2节 Greenshift的页面布局元素
第3节 内容区块
和Stackable一样，Greenshift作为区块扩展插件，提供了很多的元素，比如文本，标题，倒计时，内容折叠，触发器弹窗，3D显示，以及一些图片，预设动画效果等等。
我们都可以直接通过左边的元素区域拖拽过来使用，选中对应的元素就可以在右边对他的参数做修改和调整，非常方便。
如果你学过了之前建站的基础教程，使用起来应该页很容易。
第4节 动画效果
值得一提的是Greenshift的元素在免费版本的情况下也是支持动画功能的。
选择对应元素，然后在右边的编辑区域有个Advanced，下面就可以添加动画类型和效果。比如，页面向下滑动时，元素复出之类。
除此之外，CSS变换和过度允许我们设置默认情况下的状态，以及鼠标悬浮在上面时的状态。这些功能看起来会比较炫酷一点。
第5节 预设的一些动画和触发元素
除了一些需要我们自己设置的动画之外，Greenshift还有一些预设的动态元素我们可以选择。
比如：Flipbox 3d Container
Text with Popup Trigger
当然还有一些其他的元素，比如按钮触发器之类的大家可以自己了解一下。
总结
这款扩展插件在使用和效果上还是非常不错的，建议大家可以自己尝试一下，对于一些动画和互动功能都是可以轻松完成的。
© 文章版权归白小菌所有，🫰欢迎转发分享。未经允许请勿抄袭转载。
