ユーティリティ

2017年06月

- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -

キーワード検索

キーワード検索フォーム
キーワード

ユーザー

  • cccのアバター

新着画像

過去ログ

Twitter

Twilogを見る

Feed

エントリー

freoのTinyMCEのバージョンをアップするには(HTML5に対応)

  • 2017/06/10 18:04更新Update!
  • カテゴリー:TinyMCE3

【2017/06/10 リンク先等修正】

2012/6/20現在、freoの最新版ver1.8.1にはTinyMCEのver3.4.7が搭載されていますが、HTML5に対応していないので困っているという声がちらほらあります。
ところが TinyMCEがver3.5になってHTML5をサポートした とのこと。
そのうちないとさんが対応してくれるとは思いますが、いつになるのかわからないので(^^ゞTinyMCEだけバージョンアップしたい!!という方に...
※ざっと使った感じは問題ないように思うのですが、これを導入して不具合があるかもしれませんのでその点ご了承ください。
2012/7/7に freoがver1.8.2になってTinyMCEがver3.5.4.1になりました ので以下のバージョンアップの必要はなくなりました。
それでも単にfreoをバージョンアップしただけではHTML5には対応していませんので対応させたい方は当記事の8.の設定をしてください。

  1. TinyMCEのOlder releases ページの一番下にある「3.5.x」(2017/5現在3.5.12)の右側にある「Prod」をクリックしてダウンロードします。
    ※クリックしても何も起こらなかったら、「Prod」を右クリックして「名前を付けて保存」をしてダウンロードしてください。
    ※3.5.12がうまく解凍できない場合は 3.5.11 をダウンロードして下さい。
  2. 次に Languages for "tinymce" のページより「Japanese」の欄にチェックをし、一番下の「DOWNLOAD」をクリックしてダウンロードします。
  3. ダウンロードした tinymce_3.5.x.ziptinymce_language_pack.zip を解凍します。
  4. 解凍してできた tinymce/ フォルダの jscripts/ フォルダの中にある tiny_mce/ フォルダを取り出します。
  5. 解凍してできた tinymce_language_pack/ フォルダを開いてその中のフォルダを全て選択してコピーし、それを先ほど取り出した tiny_mce/ フォルダを開いてその中にペースト(貼り付け)します。
  6. ペーストした tiny_mce/ フォルダをfreoの tiny_mce/ ディレクトリにアップします。
    (心配だったら念のため元の tiny_mce/ フォルダは別途保存しておいてください)
  7. TinyMCE3.5.xで新しく導入されたvisualblocksプラグインを使用するには、js/admin.js の「//TinyMCE」以降のうち赤字部分を追加してアップします。⇒ この設定はfreoがver1.8.2になった際に設定済みです。
    //TinyMCE
    tinyMCE.init({
    ~(略)~
    	plugins: 'advimage,advlink,autosave,contextmenu,fullscreen,inlinepopups,pagebreak,searchreplace,table,visualblocks',
    ~(略)~
    	theme_advanced_buttons2: 'forecolor,backcolor,removeformat,|,link,unlink,image,charmap,pagebreak,|,search,replace,|,undo,redo,visualblocks',
    ~(略)~

    導入するとTinyMCEにvisualblocksのボタンが表示されます。
    ファイル 47-1.jpg

    編集中にvisualblocksボタンを押すと文章がブロックごとに仕切られるようになります。再度visualblocksボタンを押すと解除されます。
    ファイル 47-2.jpg
  8. 〔追加〕
    HTML5に対応させるための設定:js/admin.js
    tinyMCE.init({
    以降の部分に赤字の設定を追加しておく必要があるみたいです。
    	schema: "html5",

    (HTML4とHTML5のスキーマを切り替える。デフォルトはHTML4)

    	element_format : "html",

    (要素をXHTMLモードからHTMLモードにする。<br />が<br>になるとか...。デフォルトはXHTMLモード)
    ※注)HTMLモードにすると、imgタグの最後が />にならないせいか、エントリーギャラリー表示プラグインで画像が表示されなくなってしまいます。【2013.6.12追記】

    でも当方はHTML5はスマホテンプレート以外では作ったことがないのでどういうメリットがあるのか知りません...m(__)m
    一応これでHTML5独自のタグは使えるようになるみたいです。
    急がないのならfreoのバージョンアップを待ってもいいのかな?

ページ移動

関連エントリー

コメント

  • コメントはまだありません。

コメント登録

  • コメントを入力してください。
  • 一旦登録したコメントは、あとで編集できませんのでご注意下さい。
登録フォーム
名前
メールアドレス
URL
コメント(コメント本文の装飾について
閲覧制限
※基本的には「全体に公開」されますが、内容によっては管理人の方で公開を制限する場合がございますので、その旨ご了承下さい。
freoをひらがな3文字で入力してください(スパム対策)