サポート » 使い方全般 » インライン要素内にブロック要素wo

  • 解決済 tak016

    (@tak016)


    現在、WPをHTML5で記述して構築しています。

    固定ページなどで以下のようなインライン要素の中にブロック要素を含めた記述をし、
    編集画面でテキストとビジュアルの切り替えを行うと、外側のインライン要素タグが消えてしまいます。

    <div>テキスト等</div>

    自動整形によってpタグやbrタグが消えてしまう問題がありますが、
    function.phpにて自動整形は無効にしています。

    このような現象を回避する方法はあるのでしょうか?

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • トピック投稿者 tak016

    (@tak016)

    失礼しました。
    コード例は以下となります。

    <a href="/"><div>adas</div></a>

    普段こう書いてます。
    <div><a href="/">adas</a></div>

    こんにちは

    HTML5 では、blocklinks は記述できるようになったと思いますが、

    例えば、ギャラリーの表示では、html5で表示されるように(figure)設定していても、エディタの中では、依然として dl で表示します。

    なので、TinyMCEでは、まだそれをうまく扱えないんじゃないかと思います。

    無理やり という事なら

    <a href="/"><!--div-->adas<!--/div--></a>

    等としておいて、the_content フィルタなどで、divに置換して表示するとか、

    荒っぽすぎますかね?

    追記:

    も少し、使えそうなことを思いついたので、

    <a href="/"><b class="block">adas</b></a>

    b 使ってますけど、big だとか、今では誰も使わなくなったタグを探すといいと思います。

    エディタスタイルに、

    .mce-content-body .block{
        display:block;
        width:100px;
        height:100px;
        border:1px solid red;
    }

    (幅、高さ、ボーダーはテスト用)

    これだけだと、出力した時に、へんてこなコーディングになるので、the_contentで、divに置換して表示、

    あとスタイルを記述すれば、なんちゃってブロック要素の出来上がり。

    ※ レイアウトの確認用にテキストモードと、ビジュアルモードを切り替えるのは、個人的には、お勧めしません。いろいろ不具合でますから、、、、

    トピック投稿者 tak016

    (@tak016)

    맹조様、nobita様

    回答、並びに具体的なコーディング方法の提案、ありがとうございます。

    TinyMCEでは、まだそれをうまく扱えないんじゃないかと思います。

    なるほど、そういうことですね。
    このあたりはバージョンアップを待つしかないですね。

    入力する値のコーディングはそのままに、function.phpなどへの追記でなんとか回避する方法がないものかと考えたのですが、現状では難しいようですね。

    blocklinksを使用しない、若しくはご提示いただいたような力技で回避する方向で考えたいと思います。

    ※ レイアウトの確認用にテキストモードと、ビジュアルモードを切り替えるのは、個人的には、お勧めしません。いろいろ不具合でますから、、、、

    仰るとおり、このあたりは重々承知しております。が、なかなかそういうわけにもいかず、皆様も苦心していらっしゃるのではないでしょうか。。。

    本トピックスは解決済みとさせていただきます。

    ありがとうございました。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • トピック「インライン要素内にブロック要素wo」には新たに返信することはできません。