tinymceのタグの置き換え 【解決済み】
tinymceのタグの置き換え
coreserverでmodx1.0.2を運用しています。
これを新しくページを作る際のテンプレートにして非公開にして置いてあります。
<div id="左カラム"></div>
<div id="右カラム"></div>
divにはcssで背景や立て幅など指定してあり、更新作業やページの作成をしてもらう方には
TinyMCEを使って直接ブログ感覚で記事を更新してもらう予定です。
新しくページを追加してもらう際に
上記のソースを利用する場合にTinyMCEを使って見出しを入れると
<div id="左カラム">
<h2>見出し2<h2>
</div>
という風になって欲しいのですが
<h2 id="左カラム">見出し2<h2>
に変わってしまって大きくレイアウトが崩れてしまいます。
div要素を残したまま、Hタグを追加するにはどこをいじれば良いでしょうか?
宜しくお願い致します。
これを新しくページを作る際のテンプレートにして非公開にして置いてあります。
<div id="左カラム"></div>
<div id="右カラム"></div>
divにはcssで背景や立て幅など指定してあり、更新作業やページの作成をしてもらう方には
TinyMCEを使って直接ブログ感覚で記事を更新してもらう予定です。
新しくページを追加してもらう際に
上記のソースを利用する場合にTinyMCEを使って見出しを入れると
<div id="左カラム">
<h2>見出し2<h2>
</div>
という風になって欲しいのですが
<h2 id="左カラム">見出し2<h2>
に変わってしまって大きくレイアウトが崩れてしまいます。
div要素を残したまま、Hタグを追加するにはどこをいじれば良いでしょうか?
宜しくお願い致します。
Re: tinymceのタグの置き換え
コード: 全て選択
<div id="左カラム">
<h2>見出し2</h2>
</div>
Re: tinymceのタグの置き換え
なるほどですね。
早速試して頂けてありがとうございます。
どうやら僕の環境に依存している可能性がありますね。
Pタグを自動挿入されたくなかった為に
Custom Parametersに以下を追記しています。
force_br_newlines : true,
forced_root_block : ''
こちらが関係している可能性はありそうですよね。
情報の後だしになってしまって本当に申し訳ございません。そこ以外はデフォルトで運用しています。
テンプレートがこんな感じです。
<body>
<div id="head"></dib>
<div id="wrap">
[*content*]
</div>
<div id="foot"></div>
</body
[*content*]の中見が
<div id="left"></div>
<div id="right"></div>
contentの中のdivはcssファイルでfloat:leftしてあります!
<div id="left">
ここで見出しを選択すると、直前のdivがhになってしまいます。
</div>
以上です。宜しくお願いします!
早速試して頂けてありがとうございます。
どうやら僕の環境に依存している可能性がありますね。
Pタグを自動挿入されたくなかった為に
Custom Parametersに以下を追記しています。
force_br_newlines : true,
forced_root_block : ''
こちらが関係している可能性はありそうですよね。
情報の後だしになってしまって本当に申し訳ございません。そこ以外はデフォルトで運用しています。
テンプレートがこんな感じです。
<body>
<div id="head"></dib>
<div id="wrap">
[*content*]
</div>
<div id="foot"></div>
</body
[*content*]の中見が
<div id="left"></div>
<div id="right"></div>
contentの中のdivはcssファイルでfloat:leftしてあります!
<div id="left">
ここで見出しを選択すると、直前のdivがhになってしまいます。
</div>
以上です。宜しくお願いします!
Re: tinymceのタグの置き換え
どうも、ご協力ありがとうございます。これだけ情報あればこちらで調べられると思います。ちょっとこれから外出しますが、あとで調べてみます。
その前に、改行の扱いで設定を加えられているようなので、
http://wiki.moxiecode.com/index.php/Tin ... lements.3F
もしよければ、こちらを試していただけますか?たぶん関係ないと思いますが。
つまりこのように記述を加えるのが正しいようです。ただしTinyMCEの不具合だと思いますがIEでは思ったとおりにいってない感じです
(そちらの現在の設定では意図どおりに使えているのですか?)
その前に、改行の扱いで設定を加えられているようなので、
http://wiki.moxiecode.com/index.php/Tin ... lements.3F
もしよければ、こちらを試していただけますか?たぶん関係ないと思いますが。
コード: 全て選択
forced_root_block : false,
force_br_newlines : true,
force_p_newlines : false
(そちらの現在の設定では意図どおりに使えているのですか?)
Re: tinymceのタグの置き換え
はい!引き続き僕も触ってみます。
宜しくお願い致します。
それと本当に申し訳ないですが、まだ情報残っていました。
Custom Parametersに
content_css : "css/import.css"を
記述しております。
css/import.cssは実際サイトに読み込ませているcssになります。
今度こそ本当に情報の全てです。宜しくお願い致します。
宜しくお願い致します。
それと本当に申し訳ないですが、まだ情報残っていました。
Custom Parametersに
content_css : "css/import.css"を
記述しております。
css/import.cssは実際サイトに読み込ませているcssになります。
今度こそ本当に情報の全てです。宜しくお願い致します。
Re: tinymceのタグの置き換え
検証した所、やはりエディタのpタグを排除しているのが原因ぽいです。
本当に上記の通りのHTMLソースで書いた所、GUI上で空の<div id="left">をクリックしてdivの中を選択する事ができませんでした。
(文字を書くと <div id="left">の直前に挿入される)
なので<div id="left">のなかに空のpタグを入れてみました。
<div id="left">
<p></p>
</div>
上記のようにするとHタグの挙動が普通になりました。
空のPタグは削除される。
<div id="left">
<h2>ここに見出し2</h2>
</div>
なのでPタグをmargin:0,padding:0にしてリセットして今は代用しています。
ただ保存するたびに空divと空Pタグに何かを書いておかないとタグが消去されてしまいます。
なにかスマートな解決策ないでしょうか?
強引な解決方法しか今は見つかっていないので、引き続き宜しくお願い致します。
本当に上記の通りのHTMLソースで書いた所、GUI上で空の<div id="left">をクリックしてdivの中を選択する事ができませんでした。
(文字を書くと <div id="left">の直前に挿入される)
なので<div id="left">のなかに空のpタグを入れてみました。
<div id="left">
<p></p>
</div>
上記のようにするとHタグの挙動が普通になりました。
空のPタグは削除される。
<div id="left">
<h2>ここに見出し2</h2>
</div>
なのでPタグをmargin:0,padding:0にしてリセットして今は代用しています。
ただ保存するたびに空divと空Pタグに何かを書いておかないとタグが消去されてしまいます。
なにかスマートな解決策ないでしょうか?
強引な解決方法しか今は見つかっていないので、引き続き宜しくお願い致します。
Re: tinymceのタグの置き換え
確認しました。どうやらGUIの問題ですね。ボックス要素内のボックス要素(DIV内のH2など)を正しく認識できないようです。もともとWYSIWYGというよりワープロ指向なツールなので、こういった使い方は想定してないのかもしれませんが・・とりあえずTinyMCE開発元に報告を入れないと対応難しいと思います。英語でうまく説明できれば、対応が早い開発チームなので期待できそうですが。
P要素をmargin:0,padding:0;にするなら、P要素内に など空っぽい文字を入れておいて div#left p {display:none;} などとするとベターかな?という気がします。
P要素をmargin:0,padding:0;にするなら、P要素内に など空っぽい文字を入れておいて div#left p {display:none;} などとするとベターかな?という気がします。
Re: tinymceのタグの置き換え
代替案ですけど。
こんなふうにしてみてはどうでしょう?何かワケがあって、あえてこのようにしてないのかもしれませんが。
コード: 全て選択
<body>
<div id="head"></div>
<div id="wrap">
<div id="left">[*content*]</div>
<div id="right">[*rightcontent*]</div>
</div>
<div id="foot"></div>
</body>
Re: tinymceのタグの置き換え 【解決済み】
確認遅くなってしまって申し訳ないです。
やはりGUI操作の問題ですね。
テンプレート変数で項目ごとに切り替えるパターンと
空div内に文字を隠しておく両パターンで作業を行おうと思います。
自分で作る分にはguiで書く事も無いのですが
いざ、htmlに詳しくない方に管理画面を投げる時に
見たままの編集作業、ちょっとした追加をさせてあげたいなと思い、試行錯誤中です。
フォーラムは最近登録したばかりです。今後とも宜しくお願い致します。
やはりGUI操作の問題ですね。
テンプレート変数で項目ごとに切り替えるパターンと
空div内に文字を隠しておく両パターンで作業を行おうと思います。
自分で作る分にはguiで書く事も無いのですが
いざ、htmlに詳しくない方に管理画面を投げる時に
見たままの編集作業、ちょっとした追加をさせてあげたいなと思い、試行錯誤中です。
フォーラムは最近登録したばかりです。今後とも宜しくお願い致します。
Re: tinymceのタグの置き換え
よろしくです。
これってたぶん、メインコンテンツ部分とサイドバー部分をざっくり2つに分けただけ。って感じでは。各部をシステマチックに作り込むイメージではなくて、逆にラフな使い方でサイトをCMS化したくてMODxを選んだとか。それはそれで多少ノウハウあるので、具体的に相談いただければと思います。
これってたぶん、メインコンテンツ部分とサイドバー部分をざっくり2つに分けただけ。って感じでは。各部をシステマチックに作り込むイメージではなくて、逆にラフな使い方でサイトをCMS化したくてMODxを選んだとか。それはそれで多少ノウハウあるので、具体的に相談いただければと思います。