在Drupal上使用TinyMCE編輯器通常感到困擾的是,TinyMCE的圖片plugin不能上傳圖片,它只有剪裁圖片大小的編輯功能。Drupal 7版本只能安全使用TinyMCE到3.x版本,Drupal英文官方網頁提到Drupal 7支援TinyMCE4.x版可能會有問題,因為目前(本文寫作時間)他們尚未完成檢查Drupal7相容TinyMCE 4.x版的程式碼。
我先前尋找很久,能夠安裝在TinyMCE 3.x版本且能正常運作在Drupal 7的圖片上傳plugin,試了一些,發現上傳圖片的步驟會很多,或是版本只支援到Drupal 6,而且plugin上傳的圖片不會上傳到AWS的S3,後者例如: image_assist。這對我來說管理不便,因為這代表我必須買大空間的VM,不划算。也嘗試不同的Drupal編輯器相關套件,例如:CKEditor、WYSIWYG CKEditor CKFinder bridge、BUEditor、elFinder、elFinder BUEditor integration和elFinder File Field Source這些套件,也試過伺服器檔案管理的套件,例如:IMCE和IMCE for File Field。
最後找到Insert這個套件,它可以配合Wysiwyg套件上傳圖片到AWS的S3,只要搭配一些設定就能在TinyMCE輕鬆上傳圖片並附圖片在編輯器裡,上傳步驟比之前少很多。Insert module操作說明:
以Drupal管理員身分登入網站,並點選Dashboard的架構(architecture)
架構頁面內點選內容類型(Content category/type)
在內容類型頁面找到一個已經定義的內容類型,譬如叫做「文章」,選擇右邊操作欄位的「管理欄位」
文章的欄位新增一個欄位給圖片,譬如名稱是「Image」,欄位類型點選「圖片」,Widget欄位選「圖片」;如果已經有定義一個欄位專門給圖片,請確認欄位類型與Widget的選擇內容如前所述,再進行第五步驟
新增「Image」欄位完畢之後,在「Image」的「操作」欄位點選「編輯」
進入「編輯」畫面後,請將畫面拉到進度列指示器的位置,進度列指示器位置的底下是Insert下拉隱藏選單,請依頁面指示點選你需要的功能。我選擇的是
接著再向下拉畫面到 Image 欄位設定,
完成第7步驟後請回到第3步驟,並改點選「管理顯示」
管理顯示頁面內有「預設」和「摘要」兩個子模式,請先操作「預設」子模式:將「Image」的標籤欄位值和格式欄位值都設成「<隱藏>」;「摘要」模式也請將將「Image」的標籤欄位值和格式欄位值都設成「<隱藏>」
Drupal全站內容撰寫也必須設定成Full HTML,操作說明:
尋找Drupal module解答的建議方法次序: