1. 程式人生 > >Wordpress之二__自定義編輯器按鈕

Wordpress之二__自定義編輯器按鈕

做一個很簡單的功能

框架上大概就是新增一個快捷鍵

編輯文章的時候,可以在文章頭加上鍊接,例如: 

===================

明日花->2015

 bababalabala ,bala,

===================

首先想到的當然是-

1.wordpress的自定義欄位 Custom Field

然後也得知道wordpress 4.6.1版本或者以前的版本

2.都是用編輯器TinyMCE,

國內很多人都用ueditor, 或者markdown,甚至是亂7雜8的程式碼編輯器,這個不管了,管不了

我要的功能就是這麼簡單

好先下個demo

發現TinyMCE並不是簡簡單單的javascript, demo裡面一個潛入按鈕正和我用,但是你要知道

3.PHP $_GET, $POST, URL, Relatvie Path

好吧,這些web 前端基本功你都得懂(我不是在後臺新增一個煎蛋功能麼?),還有什麼,繼續來吧,誰怕誰

4.TinyMCE有不錯的api,還有plugin,例如AugurJS, JQuery, !!所以你還得懂

5.JQuery

那些TInyMCE自定義那些就不要看了,你是程式猿啊,誰看誰是小狗

JQuery 我懂了,可是我還是要用一個方法去觸發jquery啊

我只看到這樣的程式碼

(function() {
	// Load plugin specific language pack
	tinymce.PluginManager.requireLangPack('sixstone');
	//注意create "tinymce.plugins.SixstonePlugin" 不能重名
	tinymce.create('tinymce.plugins.SixstonePlugin', {
//。。。
})();


好吧,又得重新學了

6.javascript的function寫法

7.tinymce.windowsManager的回撥方法(windowsManager api by  TinyMCE)

8.wordpress儲存customize field 方法

好吧,我寫不下去了

就這麼簡單一個煎蛋功能,就是增加1個按鈕這麼簡單的事情,要掌握無數個技術,而且工期還長,目測要做7天

不爛尾都值得開馬爹利慶祝了,結果還有人說這麼簡單功能不是移下滑鼠就做出來了麼

就看7天后我能不能做出來吧

結果用了2個星期多1點

其實前10天都在走彎路,最後發現這個外掛比較接近此部落格的需求


這個外掛很出名,改版也很多,其實我根本不確定我用的這個版本是不是也是一個改版,但問題不大(其實終究還是得自己改的)

有一些遮罩的bug,但問題不大,不影響使用,也不影響自己改


修改的程式碼如下:

add_filter('the_content', 'series_auto_content_display',0);
function series_auto_content_display($content) {
    global $post;
    
    if(is_single() || is_page() || is_feed()){
        $options = get_option( SERIES.'_options', series_get_default_options());
        $series_arg = array(
            "limit" => -1
        );
        $series_arg =series_attrs($series_arg, $options);
        
        $series_display = series_display($series_arg);
    }
//...
}
//series_display在另一個類裡,就是一些html的操作方法
//...

最終結果:(將categories和series橫向列表展開)


還是那句話,程式猿計劃用3天,結果用了13天,所以還是不要想太多,有1個觀眾就算好的了