したがって、この質問はさまざまなフラグの下で何度も提起されてきましたが、この問題の究極の解決策のための統合スレッドを提示したいと思います。
WordPressでは、デフォルトで、TinyMCEでHTMLエディターとビジュアルエディターを切り替えると、特定のタグがコンテンツから削除され、その他の奇妙な機能が発生します。より効率的なHTMLコードを記述するための2つの既知の回避策は、フィルターを使用してwp_auto_p関数を削除し、TinyMCE Advancedをインストールして「p&brタグの削除を停止」オプションを有効にすることです。
これは、残念ながらうまく機能します。
たとえば、次の例を見てください。
<h2>How does it work?</h2>
<p>In order to use jQuery Easy Columns, you must install it as you would any other jQuery plugin. First, download the zip file using the button above. After downloading the file, extract it to a location of your choice, and move the extracted folder to your server using your favorite FTP client. After moving the plugin to your server (and of course calling the jQuery source into your document), call it in on your site using the following snippet of code:</p>
<pre>
<script type="text/javascript" src="/path/to/jquery.easycolumns.js"></script>
</pre>
上記の両方のオプションが既に有効になっている状態でこのコードをHTMLエディターに入力した場合、2つの異なるエディターを切り替えると、何も起こりません。残念ながら、保存すると、コードは自動的に次のように変換されます。
<h2>How does it work?</h2>
<p>In order to use jQuery Easy Columns, you must install it as you would any other jQuery plugin. First, download the zip file using the button above. After downloading the file, extract it to a location of your choice, and move the extracted folder to your server using your favorite FTP client. After moving the plugin to your server (and of course calling the jQuery source into your document), call it in on your site using the following snippet of code:</p>
<pre>
<script type="text/javascript" src="/path/to/jquery.easycolumns.js"></script>
</pre>
ご覧のとおり、preタグ内のすべてのエンティティは、実際のHTML文字に変換されます。その後、この同じ投稿を再度保存すると、次のようなメッセージが表示されます。
<h2>How does it work?</h2>
<p>In order to use jQuery Easy Columns, you must install it as you would any other jQuery plugin. First, download the zip file using the button above. After downloading the file, extract it to a location of your choice, and move the extracted folder to your server using your favorite FTP client. After moving the plugin to your server (and of course calling the jQuery source into your document), call it in on your site using the following snippet of code:</p>
<pre><br />
<script type="text/javascript" src="/path/to/jquery.easycolumns.js"></script><br />
</pre>
Wordpressが実際にbrタグを投稿に挿入することに注意してください。言うまでもなく、この投稿が数回更新された場合、フロントエンドで表示すると、ディスプレイは意図したディスプレイに近づきません。
追加されたすべての「書式設定機能」を取り除くように思えた唯一の方法は、プロファイルでビジュアルエディタを無効にすることでした。
私はプロのWeb開発者であることを考えると、これは私にとって素晴らしいソリューションです。私のクライアントにとって、このソリューションはエレガントとはほど遠いものです。私のクライアントは、ほとんどの場合、ビジュアルエディターを使用します。私のクライアントの多くは技術に精通していないため、レイアウトが崩れたときに投稿を修正する必要がある場合があります。これにより、レイアウトを壊すことを恐れずにHTMLエディターに変更できないため、ビジュアルエディターの使用に制限されます。
主に、(そして、この答えから利益を得ることができる大きなコミュニティがあると思います)、以下を確実にするためにどのような明示的な手順を踏むことができますか:
- 投稿は、ビジュアルエディタまたはHTMLエディタから編集できます。
- 2つのタブを切り替えても、投稿のコンテンツは一切変更されません。
- HTMLエディターから投稿を保存するとき、追加のコンテンツは追加されません。
- HTMLエディターから投稿を保存するとき、エンティティは変換されません。
- ボーナス:HTMLエディターから投稿を保存すると、preタグ内にラップされていて、まだエンティティに変換されていないコード(HTMLなど)は自動的にエンティティに変換されます。
基本的に、サードパーティのプラグインを使用してTinyMCEで前述の動作を作成できる場合、TinyMCEを使用して誤ったフォーマットに関する他のすべての質問を鎮めることができます。多くの人がこの恩恵を受けることができると感じています。
WYSIWIGエディターに期待される特定の機能があることは論理的に思えますが、これは逆です。すべての論理と理由によると、Wordpressの組み込み書式設定関数は、現在の設定ではほとんど役に立たない。これらの書式設定オプションを使用したい場合、最善の策は、両方ではなくどちらか一方のエディターを有効にすることです。
また、問題を「修正」する他のWYSIWIGエディターの回避策やダウンロードでこのスレッドに答えないでください。これは、修正が必要なWordpressコアの根本的な問題です(本当にバグではありませんが)。
編集:申し分なく、私はこれに取り組んできました、そして、リバースエンジニアリングがこの問題を解決する最良の方法になると思っています。そのため、今のところ、wpautopを無効にしました(わかりやすくするために、テキストが保存されるときではなく、テキストが表示される前に pタグとbrタグを追加する "the_content"フィルターにフックする機能です。この関数の動作については、wpautopは、エディターのタブを切り替えたときに発生する変更については責任を負いません。
とにかく、wpautopを無効にしました。これは、HTMLエディターを使用するときの良い習慣です。その時点から、投稿を保存するときに表示されるhtmlエンティティエラーで最初に起動するビジュアルエディターを無効にしました。C. Bavotaの助けのおかげで、サイトのフロントエンドに表示する前に、HTMLエディターのタグを同等のエンティティに変換するスニペットを見つけました(クレジット:http : //bavotasan.com/2012/convert -pre-tag-contents-to-html-entities-in-wordpress /)。
#add_filter( 'the_content', 'pre_content_filter', 0 );
/**
* Converts pre tag contents to HTML entities
*
* This function is attached to the 'the_content' filter hook.
*
* @author c.bavota
*/
function pre_content_filter( $content ) {
return preg_replace_callback( '|<pre.*>(.*)</pre|isU' , 'convert_pre_entities', $content );
}
function convert_pre_entities( $matches ) {
return str_replace( $matches[1], htmlentities($matches[1] ), $matches[0] );
}
add_filter( 'the_content', 'pre_content_filter', 10, 2 );
これにより、Wordpressを回避することで、保存時にすべてのエンティティをタグに変換する問題を効果的に排除できます。これで、HTMLエディターを使用して、エンティティ変換を自分で行うことなく、「pre」タグの間に標準コードを記述できます。これにより、Wordpressでのエンティティ変換に関するすべての問題が処理され、フロントエンドですべてが正しく表示されるようになります。次に、タブ間で前後にクリックしたときに発生する動作を変更するために、何をフックするかを把握する必要があります。現時点では、HTMLからビジュアルタブに移動すると、HTMLタブのコンテンツはjavascriptなどによって解釈され、コンテンツの外観をライブで更新しようとするように見えます。これにより、タグ(HTMLタブに非エンティティ形式で表示される)が表示される代わりに処理されます。次に、HTMLタブに戻ると、TinyMCEが現在のデータを渡すように見えます。つまり、元に戻すと、HTML構造が失われます。ウィンドウに読み込む前に、preタグのすべてを同等のエンティティに変換するようTinyMCEに指示する方法を見つける必要があります(基本的に、フロントエンドで行ったことのバックエンドバージョンですが、phpとフックの代わりにtinymceとjavascriptを使用)。処理される代わりに表示されるようにします。提案?sウィンドウにロードする前の同等のエンティティ(基本的にフロントエンドで行ったことのバックエンドバージョンですが、phpとフックの代わりにtinymceとjavascriptを使用)。処理される代わりに表示されます。提案?sウィンドウにロードする前の同等のエンティティ(基本的にフロントエンドで行ったことのバックエンドバージョンですが、phpとフックの代わりにtinymceとjavascriptを使用)。処理される代わりに表示されます。提案?
編集2:
さらに調査した結果、preタグ内のエンティティを表示時に変換すると、preタグ内のコンテンツに対して正常に機能しますが、次のような行を含むブログ投稿があるとします。
「次に、この行をHTMLファイルに追加する必要があります:<p> Hello、World!</ p>」
この行を見ると、コードはサイトに表示され、解析されないはずであることがわかりますが、投稿が保存されると、これらのエンティティは次の投稿編集ロードでデコードされ、その後の保存で保存されます未加工のhtmlタグとして、フロントエンドで解析されます。私がこれまでに考えられる唯一の解決策は、事前に使用している「コード」タグに同様のコードを記述し、次に「コード」タグに小さなライナーを、そして「pre」タグ。誰か他のアイデアがありますか?