WordPress网站添加个性输入礼花及震动特效/其他CMS网站均可尝试

news/2024/5/19 12:04:39/文章来源:https://blog.csdn.net/ll727ll/article/details/107406802

在这里插入图片描述
作为 wordpress 用户的一员,真是为了装逼操心吃力(虽然 js 文件不是我写的)。WordpPress 输出框的一个礼花及震惊殊效后果,因为是挪用的 js 文件,以是不只仅可以用于 WordPress,其它网站上一样可以正常应用。js 殊效中包罗礼花及震惊殊效,你可以别离启用或禁用某个后果。

安装要领:
第一步:下载 JS 文件:activate-power-mode.js(你可以点它下载),并上传到主题的 JS 文件夹中。
第二步:安装代码:将以下代码添加到主题 footer.php 文件尾部或你感觉适合的位置。

<script src=<?php bloginfo(‘template_directory’); ?>/includes/js/activate-power-mode.js “></script>
<script>
POWERMODE.colorful = true; // ture 为启用礼花殊效
POWERMODE.shake = false; // false 为禁用震惊殊效
document.body.addEventListener(‘input’,POWERMODE);
</script>

留意:这个 WordPress 输出殊效只有在评论的时辰应用,以是为了不乱加载这些 JS 文件,建议给这些代码加一个判定是否为文章页或页面,是的话才加载这些代码。假如所应用主题的 footer.php 文件内没有这个判定前提的话,建议应用以下代码:

<!--添加文字输入爆炸效果-->
<?php if (is_single() || is_page() ) { ?>
<script src="./wp-content/themes/主题/js/activate-power-mode.js"></script>
<script>
POWERMODE.colorful = true; // true 为启用礼花殊效
POWERMODE.shake = false; // false 为禁用震惊殊效
document.body.addEventListener('input', POWERMODE);
</script>
<?php }?>

假如曾经有判定前提代码<?php if (is_single() || is_page() ) { ?>,只要要将第二步的代码添加在内里即可。

留意:假如第一步上传的路径不是在 JS 文件夹中,在第二步援用 activate-power-mode.js 文件时记得改动路径哦。

可以去留言试试文字输入礼花效果

原文转载地址:https://suguoer.com/118.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_873266.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

资源网站搜录友情链接交换

站长导航&#xff1a;免费申请收录&#xff0c;支持收录各种资源站/个人博客/友情链接互换&#xff0c;增加百度收录

资源下载网站整站资源|建站6万资源数据32G整站下载

整站资源加&#xff0b;搭建教程 下载地址&#xff1a;https://suguoer.com/21241.html

SEO篇如何生成site.txt文本文件批量提交url加快百度网站收录wordpress文章

下面的教程是针对wordpress博客如何加快百度收录自动提交sitemap。 步骤&#xff1a; ①新建一个空白txt文件&#xff0c;将下面的代码复制到文档中。 <?php require(./wp-blog-header.php); header(Content-type: application/txt); header(HTTP/1.1 200 OK); $posts_t…

Nginx完成一个简单的web网站

nginx完成一个简单的web网站 网页制作生成web网站总结参考 网页制作 vscode下完成代码的编写 两个简陋的页面&#xff0c;其中包含有页面的跳转和供下载文件的链接 主页面&#xff1a; <!DOCTYPE html> <html> <head> <meta charset"utf-8"&g…

Java读取互联网web服务网站

Java基于http协议读取互联网web网站 简介实例一、读取指定城市的天气预报二、给指定手机号码发送验证码 总结参考 简介 网址组成分析 网址的组成&#xff1a; 协议&#xff1a;//域名&#xff1a;端口号/虚拟路径&#xff1f;参数列表#锚点 协议&#xff1a;用于计算机与计算机…

一个非常适合python入门和学习的网站

废话不多说&#xff0c;直接给链接&#xff1a; https://www.tutorialspoint.com/python/index.htm 十分清楚和详细的讲解 支持在线编程 Have fun!

Python数据分析——某地产网站二手房销售数据分析

一、数据分析的流程思路 1、明确分析目的和思路/提出假设 2、数据收集 3、数据处理/整理 4、数据分析/验证假设 5、数据展现/可视化图表 6、报告撰写 二、分析目的 需求01&#xff1a;每平米二手房单价&#xff08;总价&#xff0c;按月均价&#xff09;需求02&#xf…

博学谷网站编写(HTML、CSS、JS),实现轮播图,倒计时等功能

页面效果&#xff1a; 2. 源码&#xff08;gitee地址&#xff09;&#xff1a;https://gitee.com/meng-shuyu/boxuegu 3. 点击这里下载 zip 运行即可

小米网站编写(HTML、CSS、JS),实现轮播图

1. 页面效果&#xff1a; 2. 源码&#xff08;gitee地址&#xff09;&#xff1a;https://gitee.com/meng-shuyu/xiaomi 3. 点击这里下载 zip 运行即可

京东网站页面编写(HTML、CSS、JS),包括京东秒杀的倒计时、轮播图等功能

1. 页面效果&#xff1a; 2. 源码&#xff08;gitee地址&#xff09;&#xff1a;https://gitee.com/meng-shuyu/jingdong 3. 网站图标一般存储在网站的根目录下&#xff0c;如京东网站图标地址为&#xff1a; https://www.jd.com/favicon.ico 4. 点击这里下载 zip 运行即可…

【大数据新手上路】“零基础”系列课程--Flume收集网站日志数据到MaxCompute

概述&#xff1a;大数据时代&#xff0c;谁掌握了足够的数据&#xff0c;谁就有可能掌握未来&#xff0c;而其中的数据采集就是将来的流动资产积累。 任何规模的企业&#xff0c;每时每刻都在产生大量的数据&#xff0c;但这些数据如何归集、提炼始终是一个困扰。而大数据技术的…

【大数据技巧】Flume采集网站日志到MaxCompute常见问题汇总

本文列举了Flume采集网站日志到MaxCompute的一些常见问题&#xff0c;欢迎大家补充&#xff1b; Q&#xff1a;找不到指定路径的文件 A&#xff1a;本实验要在Linux系统下运行&#xff0c;路径也要写在Linux下的路径 Q&#xff1a;找不到指定sink type的类 A&#xff1a;插件错…

【阿里云网站日志分析实践】通过Log Service日志服务导入MaxCompute分析

日志服务收集的日志除了可以被实时查询外&#xff0c;还可以把日志数据投递到大数据计算服务MaxCompute&#xff08;原ODPS&#xff09;&#xff0c;进一步进行个性化BI分析及数据挖掘。通过日志服务投递日志数据到MaxCompute具有如下优势&#xff1a; 使用非常简单。用户只需要…

【Best Practice】基于阿里云数加·StreamCompute快速构建网站日志实时分析大屏

前几天在云栖社区上写了一篇普惠性的文章&#xff0c;很粗偏向数据架构层面。具体可以进入&#xff1a;【数据架构解读】基于阿里云数加StreamCompute和MaxCompute构建的访问日志统计分析&#xff0c;但是在具体实操中肯定不会那么一帆风顺。为了避免大家走弯路特意先写了一篇架…

如何打造一个小而精的电商网站架构?

本文大纲&#xff1a; 1. 小型电商网站的架构 2. 日志与监控系统的解决方案 3. 构建数据库的主从架构 4. 基于共享存储的图片服务器架构 5. 移动M站建设 6. 系统容量预估 7. 缓存系统 一、小型电商网站的架构 刚从传统软件行业进入到电商企业时&#xff0c;觉得电商网站没有什么…

[基础常识]一步搭建phpwind网站

原文链接 首先我们把服务器停止&#xff0c;然后更换系统盘 选择我们的网站phpwind 在安全组配置添加80端口 打开网页安装即可 生成的数据库密码等可以在云市场搜索环境名称查看对应信息。 https://market.aliyun.com/ 或者直接进入服务器 输入cat default.…

网站漏洞扫瞄时被云盾拦截解决方法

原文链接 为了确保网站安全&#xff0c;有时需要对网站进行漏洞扫瞄&#xff0c;比如360网站漏洞扫瞄 但是默认情况下&#xff0c;扫瞄到一半就进行不下去了&#xff0c;原因是被云盾拦截了扫瞄程序的ip地址。 那么问题来了&#xff0c;有没有办法让云盾不拦截扫瞄ip地址呢&a…

帮程序员减压放松的10个良心网站

原文链接 程序员们工作之余&#xff0c;不妨放下微博跟朋友圈&#xff0c;今天推荐的网站&#xff0c;利用代入感强的图片与音频&#xff0c;迅速帮你抹平焦虑&#xff0c;获得平和心态&#xff0c;特别献需求改千遍的程序员们。 1.Calm 这是同类型中最火的网站了&#xff0c;站…

草根站长心酸路:你的网站后来怎么样了?

原文链接 作为一个站长&#xff0c;下面这些你一定都懂&#xff1a; 1、没有资金&#xff0c;连空间都用免费的 2、没有技术&#xff0c;连域名都不知道怎样解析 3、没有人缘&#xff0c;碰到问题没有人能够帮助 4、受人鄙视&#xff0c;有时请教一些所谓的高手&#xff0c;等了…

eclipse 插件与工具下载站点集合Eclipse插件网站分类

eclipse 插件与工具下载站点集合Eclipse插件网站 分类&#xff1a; 软件应用及编程工具 2009-04-16 17:48 工具 eclipse 插件与工具下载站点集合(大全): - 收集Eclipse插件网站 Aploo.com 2006-08-08, 11:32 上午 eclipse 插件与工具下载站点集合: 1) eclipse官方下载站点 ht…