Elementor图片手风琴插件（YRWP Image Accordion）免费下载：渐变叠加、折叠图标、响应式布局一站搞定

最近的一个wordpress外贸建站项目中，客户需要一个图片手风琴效果，这有很多插件都可以做，网站是Elementor编辑器做的，有很多扩展插件能用。但是，我试过很多插件，每个插件都有一些小细节无法满足客户的需求，就比如：

1. 有些插件的Image Accordion模块只能添加文字，无法填写描述。
2. 有一些无法添加图标。
3. 有一些可以加图标，但无法设置折叠状态下的图标。
4. 有一些无法设置图片的颜色叠加。
5. 有一些无法设置图片的渐变叠加。
6. 有一些无法分别设置图片折叠状态颜色叠加。
7. 有一些只能设置单一形式的折叠展开方式，比如横向和纵向二选一。

总之，我找了特别多的Elementor扩展插件，没有一个能够完全满意客户需求的Image Accordion图片手风琴模块😅。

无奈之下，我只能尝试自己手搓一个小插件了，好在AI现在很厉害，在AI帮助下花了小半天时间终于把它做出来了，插件也顺利用到了我的这个wordpress外贸建站项目中。

插件效果

横向折叠效果

纵向折叠效果

终于，我用这个YRWP Image Accordion图片手风琴插件实现了客户想要的效果：

1. 图片折叠状态时，上面只显示图标，图片单独设置一个半透明叠加色（也可以渐变）。
2. 鼠标悬停或点击图片时，图片展开，显示标题+描述文字，图标移动到标题旁边（可设置左右或标题上显示）
3. 展开的图片可以单独设置渐变叠加颜色，可以控制渐变的位置和透明度。
4. 移动端手风琴可以设置响应为纵向显示。

插件使用

插件的使用很简单，安装之后Elementor编辑器中会多出一个Image Accordion模块，如上图所示，和其它模块使用方法一样的，拖到页面中就可以了。

选中模块后，在图片项添加即可，项目数量不限，里面可以添加图片、图标、标题、描述等内容。

布局设置中可以设置展开方向，移动端可以按需设置为纵向。展开方式可以按需设置为点击或悬停展开，图标位置可以设置，内容的对齐方式也可以设置，还可以设置默认展开哪一个项目。

YRWP Image Accordion图片手风琴插件下载

本插件只提供图片手风琴这一个功能，所以很小，才20K，关注【wordpress建站开发】公众号，回复【yrwp图片手风琴插件】即可获取下载链接。

下载之后直接在wordpress网站后台上传安装并启用即可。

说明

本插件为自用分享，仅在我自己的网站和wordpress外贸建站项目中测试过，建议您在使用之前先备份网站。免费分享，自行折腾吧😀。