最好的交互式JavaScript插件,可以活跃您的WordPress网站

音频,视频,活动簿,画廊,地图,倒计时时钟,时间轴,弹出窗口和表格等交互式媒体会增加访问者花在与WordPress网站上的内容互动上的时间。 他们创造了很棒的用户体验。

在本文中,我将向您展示一些使用JavaScript的WordPress插件,这些插件可在CodeCanyon上使用,并且可以使您的网站更加生动有趣。

为什么要使用媒体脚本或插件?

媒体种类很多。 假设您希望网站上的访问者填写调查表,当他们浏览您的页面时会弹出该调查表。 或者,您希望用户搜索商店的位置并了解如何到达商店。

最常见的交互式媒体是地图,音频,视频,活页簿以及交互式元素,例如调查,弹出窗口和时钟。 它们是网站内容必不可少的一部分。 这些的良好结合将推动客户参与。

为了将这种交互性添加到WordPress网站,您需要JavaScript(前端Web的语言),该语言允许动画等功能并实时响应用户输入,而无需刷新页面。

WordPressJavaScript插件是一段代码,您可以将其安装在网站上以添加交互式功能。

让我们看一下CodeCanyon上一些最好的JavaScript WordPress插件

什么是插件?

如何选择媒体脚本或插件

使用CodeCanyon中的JavaScript的WordPress插件价格实惠且易于使用。 您需要做的就是下载脚本并将其安装在您的网站上。 该脚本将完成所有后台工作,以使您的视频,音频,活页簿,交互式表单或其他媒体顺利运行,而不会降低网站速度。

不仅如此,而且因为它们的构建考虑了演示,所以它们提供了多种自定义选项,可轻松使插件的外观与您的网站相匹配。

要记住的事情包括:

易于使用:这包括易于安装,以及自定义插件并使其适应各种屏幕尺寸是多么容易。

高度可定制:插件应允许定制完全适合您为网站选择的任何主题。

跨浏览器兼容性:并非每个访问您网站的人都使用Google Chrome或Mozilla。 确保您的插件与访问者可能使用的任何浏览器兼容。

跨设备的兼容性:插件应在台式机,笔记本电脑,平板电脑和手机上无缝运行。 不仅如此,该插件还必须具有响应能力,这意味着它可以适应各种设备类型,宽度,高度,方向,分辨率,宽高比和颜色深度。

全触摸支持:该插件应可在带有触摸屏的移动设备上使用。

让我们看一下CodeCanyon上一些最流行的WordPress JavaScript插件

1. iPanorama 360-适用于WordPress的虚拟导览器

适用于WordPress的iPanorama 360Virtual Tour Builder

iPanorama 360允许您创建交互式游览,地图和演示文稿。 您可以轻松上传全景照片并添加热点,以使用户可以从一个场景导航到另一个场景。

您还可以添加弹出窗口,以指出有关场景任何部分的重要信息。 这些热点或弹出窗口可以添加文本,图像,视频和其他在线媒体。

这个全景图插件具有响应能力,可以在所有现代浏览器和移动设备上使用。 您不需要编程知识就可以使用它。

用户rostaplachy说:

如果您想在您的网站上放置3D虚拟导览,则是一个了不起的选择。 这个插件超出了我的期望,我只能推荐它。

2. Swift Box WordPress内容滑块和查看器

Swift Box WordPress内容滑块和查看器

通过将内容分组为一系列旋转幻灯片,内容滑块是在网站上呈现最佳内容的一种好方法。 如果这是您想要的, Swift Box可以满足您的需求。

Swift Box会做什么?

Swift Box将您的内容整理到盒子中。 您可以混合来自RSS提要,Facebook页面,Twitter,YouTube,Pinterest,SoundCloud或嵌入式的各种来源的内容。  

该插件可以为您处理所有事情。 标题,链接,图像,列表,表格:一切都是从数据源中自动收集的。

另外,您可以将多个内容项分组并按日期对其进行排序。

这个出色的插件的更多功能:

  • 每个Swift Box元素都是可自定义的。 有40多种选项可根据您的需求自定义显示。
  • 内容可以通过功能强大的系统进行过滤,从而使您可以剥离和删除不必要HTML标签。
  • 滑块经过完全响应,自适应和移动优化,以确保在任何设备上都能完美显示内容。
  • 支持触摸和拖动交互,以在台式机和移动设备上提供卓越的用户体验!
  • 滑块定时是完全可自定义的,具有创建令人惊叹的连续滑块效果的能力,非常适合打破新闻栏。

检查实时预览,并查看如何使用此插件。

3. 适用于WordPress的Image Map Pro-SVG Map Builder

用于WordPressSVG Map Builder的Image Map Pro

如果您想要一个SVG地图构建器,其功能不只是创建位置和添加文本,那么Image Map Pro是最佳选择。 它带有功能丰富的Web应用程序,因此您可以快速创建最全面的自定义图像贴图,图钉以及SVG和多边形形状,并将其立即导出到您的网站。

它包括50个国家的即用型和高度可定制的地图。 您可以添加图钉,更改颜色,启用和禁用区域,单击时执行自定义代码,甚至在顶部绘制多边形和其他形状。

查看现场演示 ,然后使用您自己的图像进行尝试。

用户Palice说:

出色的设计,轻松且始终在改进的UI,完美的性能和快速的支持响应。 很好!

4. WooCommerce多步骤结帐向导

WooCommerce多步骤结帐向导

结帐页面是任何电子商务网站中最重要的部分。 如果客户发现结帐流程过于复杂,他们很可能会离开而没有购买并且可能不会回来。

WooCommerce多步结帐向导通过简化结帐过程来帮助提高转换率 。 它将默认的WooCommerce结帐页面分为不同的部分,因此用户将获得便利的购物体验。

查看演示 ,看看为什么balocik3用户说:

很棒的插件。 帮助简化结帐页面。 谢谢。

5. userTrack

用户跟踪

您是否想知道用户实际上在您的页面上做什么? 他们如何移动光标,何时单击按钮,如何与JavaScript小部件进行交互,网站的哪个部分最受关注? userTrack就是这样做的!

userTrack记录您在网站上的用户鼠标交互。 您可以在网站上查看单击热图,鼠标移动热图,甚至可以记录用户活动的完整记录。

该脚本使用JavaScript跟踪用户移动,并将信息发送到服务器,然后在服务器中使用PHP处理该信息,并将所有数据存储在MySQL数据库中,以供以后检索。

用户lilarson说:

很棒的产品! 效果很好,瞬间即可。 我尝试了多种热图解决方案,而这是最好的选择!

6. 用于CF7的Drop Uploader-拖放文件Uploader插件

用于CF7Drag的Drop Uploader和Drop File Uploader插件

用于CF7的Drop Uploader允许您将功能强大的拖放文件上传区域添加到Contact Form 7表单中。

您可以为一种表单添加多个文件上传区域,为每个字段设置最大文件数量,并为每个字段指定最大文件大小和文件类型。

您可以将上载的文件作为邮件附件,Dropbox的链接发送,或将其上传到服务器并发送链接。 另外,Drop Uploader支持JavaScript文件验证,因此它可以在文件上传之前处理错误。

查看实时预览 ,看看为什么razy用户说:

超级好插件:按照它说的做,就像一个魅力! 物有所值!

7. 酷的时间轴临

酷时间线临

Cool Timeline Pro是一个时间线模板制作工具插件。 它根据帖子的年份和日期按时间顺序显示您的生活历史或公司的故事时间表。

它是高度可定制的。 您可以根据主题设置图像,视频,幻灯片以及自定义设计和颜色,从而以生动的时间轴格式表示故事。

您可以选择水平或垂直显示时间轴。 您可以按升序或降序显示时间轴。

您还可以使用此功能强大的时间轴模板制作工具插件将博客文章转换为博客时间轴

您可以使用简单的短代码轻松地在网站上的任何位置添加时间轴。

在现场演示中亲自尝试一下,发现它将如何改变您的网站或博客。

用户nonne谈到了Cool Timeline Pro

真正不错的插件:出色的功能,出色的设计和专门的支持。

8. WordPress的LivIcons Evolution —动画矢量图标

WordPress的LivIcons演变

LivIcons Evolution是想要使用动画SVG图标创建生动活泼且具有个性风格的网站的开发人员的理想选择。

LivIcons Evolution是经典的跨浏览器矢量图标包。 这些图标基于SVG(可缩放矢量图形),并且每个图标都有自己JavaScript动画。

它们可以在所有现代浏览器中使用,并且在任何设备上看起来都很完美。

这个出色的插件的更多功能包括:

  • 379个独特的动画图标,每个图标有五个   设计风格可供选择
  • 图标的大小可以通过CSS媒体查询来控制
  • 支持Visual Composer,WP Bakery Page Builder和Elementor
  • 包括配置工具箱
  • 自定义任何图标以满足您的需求
  • 悬停并单击事件和自动播放选项

查看实时预览 ,看看为什么hiegl的用户调用LivIcons Evolution

真正的杰作!

9. 进阶iFrame Pro

先进的iFrame Pro

如果您想将内容(例如视频,广告或地图)从另一台服务器嵌入并拉到您的网站中,则需要一个iframe。 您可以使用iframe将第三方内容嵌入并拉入网站。

但是从外部源嵌入和提取内容会限制该内容在您的网站上的显示方式。 这就是Advanced iFrame Pro的用处,它可以帮助您以自己喜欢的方式在iframe中包含内容。 它还提供了多个选项来使iframe响应。

用户bY-NAdvanced iFrame Pro中这样说:

很棒的插件和支持!

10. WordPress的文件管理器插件


易于使用的WordPress文件管理器插件使网站管理员可以查看,编辑和创建WordPress文件夹及其子文件夹中的文件。 它具有简单而优雅的界面,即使初学者也可以轻松使用。 它具有Windows风格的GUI和上下文菜单(右键单击菜单)快捷方式,甚至还具有图像编辑功能。

用户poivre_et_sel说:

精湛的工具:简单有效!

11. 费用计算器WordPress插件

费用计算器WordPress插件

成本计算器是一个简洁明了的报价,项目价格或估算插件,可让您轻松地为WordPress网站创建报价或价格估算表。 报价和价格估算表使您的客户了解您的服务或产品所基于的成本计算。 更好的是,它使他们可以立即了解您的服务费用,而不必等待电子邮件回复。

成本计算器易于使用,带有短代码,可与用于WordPress的WPBakery Page Builder(以前称为Visual Composer)或Bold Builder一起使用。

查看实时预览 ,看看用户iraida_semenova为什么说:

一个很棒的插件,它解决了一个相当复杂的问题,其他插件无法解决。 快速优质的支持。 推荐!

12.开始定价-WordPress响应式定价表

定价WordPress响应式定价表

创建惊人的WordPress定价或使用Go Pricing比较表非常容易。 这些WordPress定价表支持各种媒体元素,例如音频,视频,图像或地图。

这个很棒的插件的主要功能包括:

  • 易于使用的管理界面,因此您可以快速,快速地编辑表格
  • Google字体和2000多种字体图标
  • 实时预览,因此您可以实时查看定价表的外观
  • 批量操作以执行各种操作,例如克隆,导出和删除
  • 导入和导出功能可快速导入演示表,创建或还原备份以及在站点之间移动数据
  • 内置更新,以使安装的版本保持最新,并带有所有最新的修补程序,功能和改进

13. Ultra Admin:WordPress Admin主题


对于忙碌的开发人员来说, Ultra WordPress Admin Theme是金牌:它将您的WordPress管理面板带入生活!

您可以从管理面板自定义WordPress网站的任何部分。 非常适合白标品牌,重命名和重新排列菜单。 它也是多站点兼容的。

阅读有关此插件的更多信息,然后尝试实时预览以确认用户August7Teen为什么说:

这是迄今为止功能最全的WP admin whitelabel插件。 它的构建非常出色,开发人员似乎渴望解决您可能遇到的任何问题。 绝对推荐!

14. WooCart Pro


这是一个简单的插件,但可以使您的客户更轻松地进行在线购物。 借助WooCart Pro插件,客户可以以更轻松的方式更新或删除购物车中的产品,而无需不断重新加载购物车。 此插件将JavaScript添加到WooCommerce购物车控件中,使编辑购物车更具交互性和实时性。

此处查看所有功能,并查看用户allanma为什么说:

我喜欢这个插件,它非常轻巧,具有非常时尚和友好的UI。

结论

这些适用于WordPress的交互式JavaScript插件对我来说很突出。 CodeCanyon上还有更多可用功能 。 请在评论部分告诉我们您喜欢哪一种。

翻译自: https://code.tutsplus.com/articles/best-interactive-javascript-plugins-to-liven-up-your-wordpress-site--cms-33502

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Smart Ads自定义显示博客广告,可以根据文章的长度、发布时间早晚、分类,甚至文章作者来设置不同的广告。可以使用 [smartads]快捷方式来在文章或者页面调用自定义广告——广告代码直接在插件选项里面设置。如果你使用的是wp2.7版本,删除插件后,插件会自动从Mysql数据库删除相应的设定。 Smart Ads插件安装: 1.下载Smart Ads插件,然后上传插件到/wp-content/plugins/下的文件夹。 2.到WordPress 管理后台插件页面激活插件,激活后插件后,点击“Setting”--->“Smart Ads”进行相关设置,页面如下(点击浏览全图): 页面中有如下选项: Smart Ads选项设定:Show Custom ads on Homepage? 是否在首页显示自定义广告。 选定之后,首页也会出现广告,否则的话就只是出现在内容页。注意:google adsense单个页面仅允许显示三个广告单元,需注意这一点。 Minimum Post Wordcount:设定显示广告的最短字数 如果内容过少的话,展示出来的广告会很不美观。设定后,除非文章字数超过你设定的数字,否则广告不会出现。 Only show ads on posts older then :文章超过多少天后才显示广告 这个应该主要是考虑到订阅用户和老用户。对于博客而言,新文章看的最多的人还是订阅者或者是老用户。 Category Exclusions:排除不显示广告的分类 把分类的ID——不是分类名称——填入,用半角状态下的逗号隔开。在这些分类下的文章将不会显示广告——自定义广告出外。 Disable Top Ad if Post Begins with an Image:如果文章以图片开头,或者在图片之前的字数不够,则顶部广告不显示。 Disable Ads For Registered Members对注册用户不显示广告 如果这个选项勾选的话,博客注册用户登陆浏览的时候将看不到任何广告,包括自定义广告。 介绍完上面的选项后,下面我们就要把广告代码放到“Advertising Code”中,Advertising Code有三部分: •Top AD:广告将显示在文章内容的顶部 •Bottom AD:广告将显示在文章内容的底部 •Custom AD:自定义广告,使用[smartads]调用广告 放入广告代码后,点击Update就OK了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值