WordPress编写文章界面的添加媒体按钮允许用户上传多媒体文件,但并不是每个人都能用的顺手,有的人倾向于引用外部图片,所以希望“从URL上传”这一项是默认选中的,有的人喜欢从媒体库中挑选图片,如果定制一下WordPress添加媒体界面,就能称心如意了。

注:该代码只适用于<3.5的版本,3.5以上定制方法请看文章最后一节。

定制WordPress添加媒体界面

WordPress的好处就是提供了很多钩子函数(actions and filters),使用户不用更改核心文件就能改变很多WordPress的默认行为,媒体界面也不例外。

更改多媒体选项卡位置

多媒体选型卡通常有四项:从计算机上传、从URL上传、从相册上传(如果该文章已经有图片附件)和从媒体库选择图片。

改变它们的顺序只需要使用filter: media_upload_tabs。将下面的代码放到主题的functions.php中即可看到效果

这段代码会使“从URL”变成第一项,改变返回的数组的元素顺序,即可改变多媒体选项卡的顺序

add_filter('media_upload_tabs', 'modify_media_tabs');
function modify_media_tabs($tabs) {
 return array(
  'type_url' => __('From URL'),
	'type' => __('From Computer'),
  'gallery' => __('Gallery'),
  'library' => __('Media Library')
 );
}

设置默认选项卡

前面提到有人喜欢直接通过URL插入图片,那么就让“从URL”变成默认选中的选项卡吧,将下面代码放到主题的functions.php中查看效果

add_filter('_upload_iframe_src', 'change_default_media_tab');
function change_default_media_tab($uri) {
 return $uri.'&tab=type_url';
}

要默认选中其它选项卡,只需要更改tab后面的值:

从媒体库 – tab=library

从相册 – tab=gallery

从计算机 – tab=type

删除某个选项卡

将下面的代码放到主题的functions.php中

add_filter('media_upload_tabs', 'remove_media_library_tab');
function remove_media_library_tab($tabs) {
	unset($tabs['library']);
	//unset($tabs['type_url']); //删除从URL
	//unset($tabs['gallery']); //删除从相册
	//unset($tabs['type']); //删除从计算机
 
	return $tabs;
}

媒体库选项卡将被删除

添加自定义消息

add_action( 'post-upload-ui', 'media_upload_infobox' );
add_action('pre-html-upload-ui','media_std_upload_infobox');
 
function media_upload_infobox() {
?>
<div style="background:#FFCC66; color:#000000; padding:10px; text-align:center">
自定义消息
</div>
 
<?php
}
 
function media_std_upload_infobox() {
?>
<div style="background:#FFCC66; color:#000000; padding:10px; text-align:center">
使用标准上传工具上传界面的自定义消息
</div>
 
<?php
}

效果如下

添加自定义消息

WordPress 3.5.0以上版本的定制方法

3.5以上media_upload_tabs这个钩子虽然存在但已经没有任何用处,3.5以上可以用media_view_strings这个filter来修改界面。下面的代码演示如何删除Create Gallery和Set Featured Image。

add_filter('media_view_strings', 'remove_media_library_tabs');
function remove_media_library_tabs( $strings ) {
	unset( $strings['createGalleryTitle']);
	unset( $strings['mediaLibraryTitle']);
	unset( $strings['setFeaturedImageTitle'] );
	return $strings;
}

可以unset的字符串变量如下

Array
(
    [url] => URL
    [addMedia] => Add Media
     => Search
    [select] => Select
    [cancel] => Cancel
    [selected] => %d selected
    [dragInfo] => Drag and drop to reorder images.
    [uploadFilesTitle] => Upload Files
    [uploadImagesTitle] => Upload Images
    [mediaLibraryTitle] => Media Library
    [insertMediaTitle] => Insert Media
    [createNewGallery] => Create a new gallery
    [returnToLibrary] => ← Return to library
    [allMediaItems] => All media items
    [noItemsFound] => No items found.
    [insertIntoPost] => Insert into post
    [uploadedToThisPost] => Uploaded to this post
    [warnDelete] => You are about to permanently delete this item.
  'Cancel' to stop, 'OK' to delete.
    [insertFromUrlTitle] => Insert from URL
    [setFeaturedImageTitle] => Set Featured Image
    [setFeaturedImage] => Set featured image
    [createGalleryTitle] => Create Gallery
    [editGalleryTitle] => Edit Gallery
    [cancelGalleryTitle] => ← Cancel Gallery
    [insertGallery] => Insert gallery
    [updateGallery] => Update gallery
    [addToGallery] => Add to gallery
    [addToGalleryTitle] => Add to Gallery
    [reverseOrder] => Reverse order
)

参考资料:remove other tabs in new wordpress media gallery

31条留言

  1. 请问媒体库如何只显示指定目录的图片呢?谢谢

      1. 谢谢回答,这个插件是更改整个媒体库,而我希望的是保留系统的媒体库不变,我自己做的插件调用的媒体库功能指向指定的目录,请问也是通过修改这个插件来实现吗?

        1. 我不明白你说的目录是什么概念,如果是你自己插件实现的功能,我想除非我也看代码,不然无法回答。

  2. 我用的wordpress 3.5.2版本,你说的这个方法怎么都不管用了,我只想让编辑从url插入图片,其它几个选项删掉或者禁用掉。

    1. 你看界面应该能发现我写代码的这个WordPress版本比3.5低,3.5的媒体上传界面变化很大,代码不工作很正常。新界面怎么定制我暂时还没关注过,等有空我会再更新下。

      1. 谢谢谢谢,这两天在你博客上面发现不少好东西啊,Nice

          1. 你是女孩子啊,厉害厉害!这么多网友问你问题,都逐一解答,好姑娘啊!
            再问个问题,呵呵:

            有没有办法自定义每个注册的wordpress编辑发布文章的个数?最好是插件,不知道你有没有接触过?
            能交个朋友吗?方便把你QQ发我邮箱吗?

        1. 我加你qq了。
          估计你问的问题不是我经常接触的,所以不太明白,你是说控制在WordPress站点注册的editor最多可以发几篇文章的插件吗?

          1. 对的,就这意思

        2. 控制文章发布数这个需求我还没遇到过,所以没什么经验可分享。不过搜索了一下,我觉得这个插件比较接近你的需求,http://wordpress.org/plugins/bainternet-posts-creation-limits/

          1. 看来搜索很有技巧啊,搞定了,就这个插件,谢谢美女

        3. 搜这种我一般都用谷歌和英文关键词

          1. 顺便问下,你有没有见过什么插件可以做类似安居客或者58.com上面那种房产检索导航,就是可以按照区域/租金/厅室等进行多极筛选的…

    2. 如果区域/租金/厅室是tag的话,按照tag筛选文章的插件应该不少吧。

      1. 是有一些,但基本都是一级筛选,也有找到几个是多层级筛选,但又需要点击搜索按钮提交才能检索,还有就是要美元,闹心啊…

        1. 那就自己写一个吧,我想原理就是根据用户点击的tab标签用与的方式查询数据库,太定制化的东西就不要指望能找到现成又免费的插件了。

  3. sola,我又来了,我建议你开个留言板吧,每次都得跑到你的文章下面来留言了。。。
    这几天忙着转移空间,估计链接有点稳定。不过现在好了。
    顺便来请教下sola一个问题啊。在wp-config.php下添加
    define(“WP_CONTENT_URL”, “http://content.codecto.com/wp-content”);
    其他都正常使用,但是有个插件不知道如何修改,后台用会报错,具体如下
    SAE_Warning: file_exists() [function.file-exists]: open_basedir restriction in effect. File(/data1/www/htdocs/996/wpcontent/admin.php) is not within the allowed path(s): (/usr/local/sae/php/lib/php/sae_std_lib/:/usr/local/sae/php/lib/php/apibus_lib/:./:/usr/share/fonts/chinese/TrueType:/data1/www/htdocs/996/wpcontent/1/:/saetmp/996/wpcontent/1336284180_873844533/:) in plugins/hacklog-remote-image-autosave/header.php on line 6
    Failed to load bootstrap file: /data1/www/htdocs/996/wpcontent/admin.php.

    顺便贴上header.php代码
    /** Load WordPress Administration Bootstrap */
    define( ‘IFRAME_REQUEST’ , true );
    $bootstrap_file = dirname(dirname(dirname(dirname(__FILE__)))). ‘/wp-admin/admin.php’;

    if (file_exists( $bootstrap_file ))
    {
    require $bootstrap_file;
    }
    else
    {
    echo sprintf(‘Failed to load bootstrap file: %s.’,$bootstrap_file);
    exit;
    }

    sola ,我该如何修改啊。请求帮助呢。

    1. 你是想通过cdn访问wp-content目录下的内容吗?移动wp-content目录最好根据文档来,更改绝对路径和url地址
      define( ‘WP_CONTENT_DIR’, $_SERVER[‘DOCUMENT_ROOT’] . ‘/blog/wp-content’ );
      define( ‘WP_CONTENT_URL’, ‘http://example/blog/wp-content’);
      上面两个都需要修改。
      另外你用的是新浪SAE平台吗,我没用过这个,不知道具体有什么限制。不过从你的报错信息来看,
      Failed to load bootstrap file: /data1/www/htdocs/996/wpcontent/admin.php.
      这个目录下肯定不会有admin.php,因为这个文件在wp-admin下,获取的路径错了,至于为什么错不知道你现在的目录结构是什么样不好说。不过你可以试试修改插件代码,
      将$bootstrap_file = dirname(dirname(dirname(dirname(__FILE__)))). ‘/wp-admin/admin.php’;
      改成
      $bootstrap_file = dirname(dirname(dirname(dirname(dirname(__FILE__))))). ‘/wp-admin/admin.php’;
      上面这句代码意思就跟../../../../../wp-admin/admin.php一样,你可以尝试修改路径,看看能不能把路径设置对了
      还有,不知道为什么你的wordpress路径里会有wpcontent,你把wp-content文件夹改名了?如果改名的话必须设置WP_CONTENT_DIR

      1. solagirl:
        你好,wordpress 路径没这个wpcontent,是我在sae 空间下设置的域名为wpcontent.sinaapp.com,,所以域名根目录为/data1/www/htdocs/996/wpcontent/
        。貌似这个插件是要去访问blog/wp-admin/admin.php这个文件,因为我wp-content 与wp-admin已经分离到不同服务器上,sae空间下并无这个文件夹。
        那我现在应该怎么改插件下的代码

        PS;看到你的回复,真的是太高兴了。你就如同那女神一般了。。。

        1. 哈,女神,我升级的速度好快啊。

          没有wp-admin目录,SAE好神奇。

          你说admin.php在另一个服务器,是不是说只能通过http协议访问?如果是的话就只能直接require一个远程文件,例如
          require “http://www.example.com/wp-admin/admin.php”;
          或者用include
          include “http://www.example.com/wp-admin/admin.php”;
          include和require的区别是require通常产生fatal error,会导致所有脚本停止运行。而include只会产生一个warning。

          将$bootstrap_file = dirname(dirname(dirname(dirname(__FILE__)))). ‘/wp-admin/admin.php’;替换成上面说的形式,用http协议引用。

          但引入远程文件需要服务器支持,php.ini里下面两项应该是开启的
          ; Whether to allow the treatment of URLs (like http:// or ftp://) as files.
          allow_url_fopen = On

          ; Whether to allow include/require to open URLs (like http:// or ftp://) as files.
          allow_url_include = On

          如果不行的话,只能具体看下这个插件为啥要用到wp-admin.php,然后想别的替代方法,因为我没用过,也不知道header.php到底是用来做什么的。总之一步一步来吧。

  4. 技术MM很难得哦,sola好勤快,发文勤快,回复也勤快,希望坚持。你的wordpress教程对我这新手很有帮助。有一个问题请教,你的文章页面的左上角的“文章目录”功能是如何实现的,是插件还是主题自带的功能?还有右下角的弹出窗口如何实现的?望告知,谢了!

    1. 文章目录功能就是用网上最常见的文章目录代码改的,应该一搜就搜到了,自己加了一点js代码弄成了跟随效果。我爱水煮鱼的博客有一款文章目录插件,主要核心也是那段代码。
      至于右下角其实就是上一页下一页的功能,用插件实现的,http://wordpress.org/extend/plugins/upprev/
      多谢你的鼓励,很高兴认识你

      1. Sola MM果然给力,回复如此迅速,谢谢了,加油!!!

    1. 哇,你是搞前端设计的,很高兴认识你

      1. SOLA,你好,请问你有不有用过,buddypress1.81版的?它里怎么没有集成论坛功能了呢,是不是得自己再安装一个bbpress,谢谢

        1. 我很久很久没用过buddypress了,不太清楚有没有论坛,记忆力是没有。

评论功能已关闭