我们专注攀枝花网站设计 攀枝花网站制作 攀枝花网站建设
成都网站建设公司服务热线:400-028-6601

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

wordpress可视化编辑 web可视化编辑

如何给WordPress可视化编辑器添加更多按钮

在上图中,我们可以看到,我们给wordpress文章编辑器添加了2个百度广告按钮,我们只需要发表文章时,在需要显示广告的地方点击一下这个百度按钮,就会在那里添加短代码 ,而不需要再像以前一样要一个一个地输入字符了。这种效果只需2部就可以实现。

发展壮大离不开广大客户长期以来的信赖与支持,我们将始终秉承“诚信为本、服务至上”的服务理念,坚持“二合一”的优良服务模式,真诚服务每家企业,认真做好每个细节,不断完善自我,成就企业,实现共赢。行业涉及花箱等,在成都网站建设公司成都全网营销推广、WAP手机网站、VI设计、软件开发等项目上具有丰富的设计经验。

1、将下面的代码放到主题的functions.php文件中:

function baidu_button() {//判断用户是否有编辑文章和页面的权限if ( ! current_user_can(‘edit_posts’)  ! current_user_can(‘edit_pages’) ) {return;}  //判断用户是否使用可视化编辑器if ( get_user_option(‘rich_editing’) == ‘true’ ) {

add_filter( ‘mce_external_plugins’, ‘add_plugin’ );add_filter( ‘mce_buttons’, ‘register_button’ );}}add_action(‘init’, ‘baidu_button’);

function register_button( $buttons ) {array_push( $buttons, “|”, “baidu1″ ); //添加 一个baidu1 按钮array_push( $buttons, “|”, “baidu2″ ); //添加 一个baidu2 按钮

return $buttons;}function add_plugin( $plugin_array ) {

//baidu2按钮的js路径$plugin_array[‘baidu1′] = get_bloginfo( ‘template_url’ ) . ‘/js/baidu1.js';

//baidu2按钮的js路径$plugin_array[‘baidu2′] = get_bloginfo( ‘template_url’ ) . ‘/js/baidu2.js';

return $plugin_array;}

上面的代码,我们添加了2个百度按钮。效果如上图。

2、在主题文件夹的js文件夹里添加baidu1.js和baidu2.js2个JS文件,在这2个js文件中分别添加如下代码:

baidu1.js文件

/*给wordpress编辑器添加自定义按钮*/

(function() {tinymce.create(‘tinymce.plugins.baidu1′, { //注意这里有个baidu1init : function(ed, url) {ed.addButton(‘baidu1′, { //注意这一行有一个baidu1title : ‘百度广告-1′,image : url+’/baidu.jpg’, //注意图片的路径 url是当前js的路径onclick : function() {ed.selection.setContent(‘【baidu1】’);

}});},createControl : function(n, cm) {return null;},});tinymce.PluginManager.add(‘baidu1′, tinymce.plugins.baidu1);})();

baidu2.js文件

/*给wordpress编辑器添加自定义按钮*/

(function() {tinymce.create(‘tinymce.plugins.baidu2′, { //注意这里有个baidu1init : function(ed, url) {ed.addButton(‘baidu2′, { //注意这一行有一个baidu1title : ‘百度广告-2′,image : url+’/baidu.jpg’, //注意图片的路径 url是当前js的路径onclick : function() {ed.selection.setContent(‘【baidu2】’);

}});},createControl : function(n, cm) {return null;},});tinymce.PluginManager.add(‘baidu2′, tinymce.plugins.baidu2);})();

然后在这个js文件夹里添加一个百度图标,图片名称为baidu.jpg ,这样就可以了。

注:需要把js代码中的【baidu】各【baidu2】这2个中文中括号修改成英文的中括号。否则会出错哦。

这里没有添加百度广告代码,这个在前面的章节中已经介绍过如何添加,所以这里就不多说了。

怎么才可以可视化编辑WordPress网站?

直接在后台可视化编辑,就可以编辑页面了,如果你说生成模板页面这种,只能在Dreamweaver里面可视化编辑,然后放到WordPress里面的。

wordpress无法使用可视化编辑

1. 检查是否开启了可视化编辑器:

在网站后台,找到【 用户 – 我的个人资料 】,查看是否勾选了“撰写文章时不使用可视化编辑器”,如果勾选了,则表示不使用可视化编辑器,所以,这里我们要取消勾选,如下图所示:

如果还是无法解决,则进行下面的操作再来测试看看。

2. 更换为WP自带默认主题,禁用所有插件;

3. 清理你的当前浏览器缓存,或者使用其他浏览器;

4. 下载相同版本的WordPress安装包,解压后通过FTP上传覆盖老的WordPress程序;

5. 打开网站根目录,找到 wp-config.php ,在底部添加以下代码:

define(‘CONCATENATE_SCRIPTS’, false);

如何可视化编辑Wordpress主题,可以推荐好用的软件或插件,要详细!

没有什么软件可以直接可视化修改wordpress的主题吧,不过你可以用浏览器来辅助修改,以谷歌浏览器为例,右击网页要修改的位置,选项中有个“审查元素”,就可以看到要修改的模块的源代码和CSS参数,关键是可以在浏览器中直接修改CSS的参数,效果立马可见的。然后你再根据你刚才的修改效果到CSS中修改对应的参数就行了


网站栏目:wordpress可视化编辑 web可视化编辑
URL链接:http://shouzuofang.com/article/dophsee.html

其他资讯