解決 WordPress 發佈的問題

2007/09/18
~ 阿亮 ~

找到一個方案可以解決長年以來 WordPress 發布問題

Keywords: tinymce, wordpress virtual editor, code, dreamweaver, nvu…

因為 Web 的 HTML editor 能做的畫面比較有限,所以,我有時會用外部 HTML editor (比如 nvu, dreamweaver 等) 編輯比較複雜的畫面,特別是多張照片並排多張等,然後,拷貝其 HTML Code 到 WordPress HTML code 的部份(下面稱 Code mode),但是有許多情形,切到 Visual mode,會出現不同原本在外部 editor 的結果。比如下圖,原本一個 Table 的呈現,在 WordPress 的 Visual mode 會不正常呈現。

Wrap01

原因如下圖: 因為許多 editor 內同一個 tag 內容不見得會連續串接在同一行內,所以,table tag 內的 cellspacing, width 等屬性會分布在各行,這在各種 editor 是可以正常處理的,但在 WordPress 的 tinymce editor 卻會不正常處理 (至少到目前 2.2.3 仍有問題)

Wrap02

其實在以前的版本就有此問題了,很早以前就只用 Code mode 在處理而己,但最近的照片整理的文章要和熊協同編輯,發現這個問題實在困擾

後來發現可以用 Tidy  處理此問題(Mac 內建此小程式),原理很簡單,就是串接這些字串,當然,也可以自己手動去串接這些字串,但那可是每次新的文章,就要再做乙次,那可累人啊

下圖是一般 editor 會形成的結果 , 假設存成 Source.html。

Wrap03

然後,執行下述指令

tidy -i -wrap 2048 -utf8 Source.html > Dest.html

重點即 -wrap 這個可將字串串成 2048 字元,Dest.html 結果就會像下圖,拿這個 HTML Code 貼到 WordPress 的 editor 內即可了。

Wrap04

有了此方式,我現在可以兩個 mode 並用了

Wrap06

另外,最近才知,Wordpress 下要按 Shift-Alt-v (IE) 或 Ctrl-v (Firefox) 其 Virtual editor 有另外的選單,可以用字的顏色

Wrap05



2 Responses to “解決 WordPress 發佈的問題”

  • 阿亮  說:

    確定 WordPress ticket #3492 的問題。

    另一篇 ,我有改個 Workaround 的檔案。

  • 阿亮  說:

    最近,又被 TinyMCE 煩死了,在於 TinyMCE 內切換 Visual/Code 模式,會發生 <pre> tags 處理不好的情形 !!昏頭!! 根據這篇 ,是 {wordpress-dir}/wp-includes/js/tinymce/plugins/wordpress/editor_plugin.js 內 wpautop() 所造成的,Code 裡面都有人註解 Hmm…

    天啊~ Visual Editor 好難用啊 !!OMG!!

站內搜尋



本站其他服務

本站其他軟體



  • 台灣空污警報(AirInfo)

    設定特定站點為推播通知關注點後,當該站點空氣品質變糟時,即時推播通知給您。另外提供站點附近基本天氣預測資料。


  • 藝文快訊

    讓你可以輕鬆追蹤含有您想要關注關鍵詞的任何藝文活動訊息,只要有最新的資訊,「藝文快訊」即會推播通知給你.


  • 條碼掃描器(QRCode)

    支援 QRCode and Barcodes、可連續快速掃描、自動對焦、可打開手電筒供掃描時使用


  • 臉書粉絲專頁搜尋 (FPSearch)

    不用登入臉書即可搜尋臉書粉絲專頁(臉書粉絲團)所公開的文章。您可以指定特定日期範圍之前的文章,也可設定搜尋粉絲專頁內包含特定關鍵詞的文章。


  • 下一班公車(nextBus)

    這個 app 只要開啟後,就根據定位幫你過濾出附近站牌的時刻表,以及提供相關公車預計到站的時間,方便您在很快時間內確定要坐的哪一班公車


  • 標案快訊

    讓你可以輕鬆追蹤含有您想要關注關鍵詞的任何採購標案,只要有最新的資訊,「標案快訊」即會推播通知給你.