WordPress加入短代码运行框(运行代码/复制代码/清空代码无插件)

所属分类: CMS教程 / WordPress 阅读数: 418
收藏 0 赞 0 分享
很多朋友可能经常在一些网站上看到类似于“运行代码、复制代码、清空代码、另存为代码的静态代码运行框,直接点击运行就能实施的查看效果,给访客带来了非常好的体验。
WordPress也不例外,同样可以加入短代码运行框,效果图如下:

方法非常简单
第一步:下载 run-code-OL.js 文件,上传至服务器。
第二步:在主题目录的functions.php适当位置添加如下代码:

复制代码
代码如下:

/**添加可运行代码框*/
function textarea($atts, $content = null) {
return '<script src="http://blog.haitianhome.com/wp-content/themes/prowerV3.1/run-code-OL.js" _fcksavedurl=""http://blog.haitianhome.com/wp-content/themes/prowerV3.1/run-code-OL.js"" type="text/javascript" charset="utf-8"></script>
<form>
<div align="center">
<textarea id="code" style="width:555px;height:255px;" cols="80" rows="15">'.$content.'</textarea>

<input type="button"onclick=runCode(code) value="运行代码" style="border:1px solid #B1B4CD;background:#696D81;color:#FFF; padding-top:5px;">
<input type="button"onclick=copycode(code) style="border:1px solid #B1B4CD;background:#696D81;color:#FFF; padding-top:5px;"value="复制代码" onclick="copycode(runcode3)">
<input type="button"onclick=saveCode(code) style="border:1px solid #B1B4CD;background:#696D81;color:#FFF; padding-top:5px;"value="另存代码" onclick="saveCode(runcode3)">
<br/>提示:可以先修改部分代码再运行 <span style="color:#ff0000">注意:如需评论后运行请重新刷新页面</span></div>
</form>
';}
add_shortcode("code", "textarea");

使用方法
在HTML模式下,输入code你的代码/code
code两则加"["、"]"
更多精彩内容其他人还在看

WordPress实现网站投稿者也可以上传图片的方法

这篇文章主要为大家介绍了WordPress实现网站投稿者也可以上传图片的方法,可通过较为简单的代码修改来实现对投稿者权限的修改,进而实现其上传图片的功能,是比较实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

WordPress修改新用户注册邮件内容的方法

这篇文章主要为大家介绍了WordPress修改新用户注册邮件内容的方法,介绍了两种方法可实现针对注册邮箱内容的个性化修改,是比较实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

WordPress添加前台注册功能的方法

这篇文章主要为大家介绍了WordPress添加前台注册功能的方法,较为详细的分析了前台注册功能的完整实现过程,是进行WordPress开发非常实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

WordPress用户自动登录的实现方法

这篇文章主要为大家介绍了WordPress用户自动登录的实现方法,只需用户名而不需要密码即可实现用户自动登录的功能,需要的朋友可以参考下
收藏 0 赞 0 分享

WordPress后台删除不需要的侧边栏菜单方法

这篇文章主要为大家介绍了WordPress后台删除不需要的侧边栏菜单方法,通过添加自定义函数结合对应的菜单项删除不需要的菜单项,以实现对菜单的选取功能,需要的朋友可以参考下
收藏 0 赞 0 分享

禁止WordPress自动替换半角标点符号的方法

这篇文章主要为大家介绍了禁止WordPress自动替换半角标点符号的方法,只需将底层代码中关于半角标点符号替换的功能函数注释掉即可,需要的朋友可以参考下
收藏 0 赞 0 分享

WordPress获取当前页面URL地址的方法

这篇文章主要为大家介绍了WordPress获取当前页面URL地址的方法,给出了WordPress原生方法与自定义方法,是非常实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

WordPress实现退出登录后跳转到指定页面的方法

这篇文章主要为大家介绍了WordPress实现退出登录后跳转到指定页面的方法,可实现针对指定页面、首页及当前页面的跳转功能,是建站时非常实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

Wordpress实现单篇文章分页显示的方法

这篇文章主要为大家介绍了Wordpress实现单篇文章分页显示的方法,分析了文章页面的分页原理与对应js文件的修改方法,是非常实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

Wordpress中上一篇与下一篇功能代码

这篇文章主要为大家介绍了Wordpress中上一篇与下一篇功能代码,并对其函数的具体参数进行了较为详细的介绍,是非常实用的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多