wordpress按钮切换内容

请按照以下步骤操作: 步骤1: 打开Header Builder 并单击要添加切换按钮的部分。 从元素列表中,选择切换按钮 第2步: 现在您可以选择要在用户单击切换按钮时出现的窗口内显示的内容,即元素。 添加切换按钮后,您将立即在标题构建器中观察画布外部分。 单击画布外部分,将打开一个元素列表。 从此列表中选择所需的元素,它们将自动添加到画布部分。 您可以添加各种元素,例如按钮、搜索

成都创新互联公司是一家专业提供柳河企业网站建设,专注与网站建设、成都网站设计、H5技术、小程序制作等业务。10年已为柳河众多企业、政府机构等服务。创新互联专业网络公司优惠进行中。

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

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

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主题添加一个返回顶部按钮

1、打开wordpress后台，选择“外观”–“编辑”–找到“footer.php”，在/body之前加上下面这段代码：

代码如下

div id="full" style="

width:50px;

height:95px;

position:fixed;

left:50%; top:420px;

margin-left:493px;

z-index:100;

text-align:center;

cursor:pointer;"

aimg src="121008370928.png" border=0 alt="返回顶部"/a /div

script type="text/javascript"var isie6 = window.XMLHttpRequest ? false : true; function newtoponload() { var c = document.getElementById("full"); function b() { var a = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; if (a 0) { if (isie6) { c.style.display = "none"; clearTimeout(window.show); window.show = setTimeout(function () { var d = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; if (d 0) { c.style.display = "block"; c.style.top = (400 + d) + "px" } }, 300) } else { c.style.display = "block" } } else { c.style.display = "none" } } if (isie6) { c.style.position = "absolute" } window.onscroll = b; b() } if (window.attachEvent) { window.attachEvent("onload", newtoponload) } else { window.addEventListener("load", newtoponload, false) } document.getElementById("full").onclick = function () { window.scrollTo(0, 0) };/script

2.然后保存，删除缓存文件即可。

wordpress怎么添加按钮

在 functions.php 文件里面添加下面代码：

add_action('media_buttons', 'add_my_media_button');

function add_my_media_button() {

echo 'a href="#" id="insert-my-media" class="button"Add my media/a';

}

添加后，登录后台编辑文章看到如图所示：

2、添加命令

继续添加代码，引用自己定义的JS，我命名为 media_button.js ，存放好路径之后，自己修改 path/to/ 为存放的路径。

function include_media_button_js_file() {

wp_enqueue_script('media_button', 'path/to/media_button.js', array('jquery'), '1.0', true);

}

3、添加JS命令

media_button.js 添加下面代码：

jQuery(function($) {

jQuery(document).ready(function(){

jQuery('#insert-my-media').click(open_media_window);

});

function open_media_window() {

if (this.window === undefined) {

this.window = wp.media({

title: 'Insert a media',

library: {type: 'image'},

multiple: false,

button: {text: 'Insert'}

});

var self = this; // Needed to retrieve our variable in the anonymous function below

this.window.on('select', function() {

var first = self.window.state().get('selection').first().toJSON();

wp.media.editor.insert('[myshortcode id="' + first.id + '"]');

});

}

this.window.open();

return false;

}

});