HTMLやコードをそのままページに載せると、タグとして解釈されて表示が崩れます。特殊文字を実体参照に変換しておけば、書いたとおりに表示されます。ブログでコードを紹介するときにどうぞ。逆方向(元に戻す)にも対応しています。
🔒 この処理はブラウザの中だけで完結します
- 入力した内容はサーバーに一切送信されません。未公開のソースコードでも安心してお使いいただけます。
変換する文字
& → &、< → <、> → > が基本です。属性値の中に入れる場合は " → " と ' → ' も必要になります。変換の順番が重要で、& を最初に処理しないと二重変換になります(このツールでは正しい順序で処理しています)。
WordPressでコードを載せるときのコツは?
ブロックエディタの「コード」ブロックを使えば自動でエスケープされるため、多くの場合このツールは不要です。問題になるのは、カスタムHTMLブロックやテーマファイルに直接書くとき、あるいはコードブロックにコピペしたのに崩れるときです。特に <script> を含むコードは、エスケープしないとページ内で実行されてしまうので必ず変換してください。
二重に変換されてしまいました
&lt; のように amp; が重なっていたら二重変換です。「元の文字に戻す」で1回デコードすると直ります。すでにエスケープ済みのテキストを再度エスケープすると起きるので、貼り付ける前に元の状態を確認してください。
なぜエスケープが必要なのですか?
表示崩れを防ぐためだけでなく、セキュリティ上の理由もあります。ユーザーが入力した内容をエスケープせずにページへ出力すると、悪意のあるスクリプトが実行される「XSS」という脆弱性になります。フォームの入力値を画面に出す処理を自作するときは、必ずエスケープしてください。
🔒 調べた内容は記録・公開しません
- 検索した内容を保存・一覧化・公開しません。調査結果をデータベース化して検索できるようにしたり、他の利用者に見せたりすることは一切ありません。
- 検索履歴を残しません。誰が何を調べたかを紐づけて蓄積することはしません。会員登録・ログインも不要です。
- 第三者に提供・販売しません。営業リストや広告目的での利用もありません。
- サーバー負荷を抑えるため、判定結果のみ最大1時間の一時キャッシュに保持し、時間の経過で自動的に消えます。連続アクセスの制限用にIPアドレスをハッシュ化した値を最大10分間だけ保持します(元のIPアドレスは保存しません)。
- 調べた対象は共有用にURLの
#以降に付きますが、この部分はサーバーにもアクセス解析にも送信されません。
同じ分類のツール(制作の道具(ブラウザ内で完結))
アクセス情報チェックあなたのIPアドレス・ブラウザ・OSなど、サーバーに送られている情報を表示します。IP制限の設定に。URLエンコード・デコード日本語URLをパーセントエンコーディングに変換、またはその逆に戻します。複数行まとめて処理できます。HTML特殊文字変換(表示中)HTMLやコードをページに載せるための実体参照変換。逆方向にも対応しています。カラーコード変換HEX・RGB・HSL・HSV・CMYKを相互変換し、明度違いのバリエーションも自動生成します。パスワード生成推測されにくいランダムなパスワードを生成します。強度と解読にかかる時間の目安も表示します。.htpasswd 生成(ベーシック認証)ベーシック認証に必要な .htpasswd と .htaccess の記述を作ります。公開前のサイトを隠すときに。Excel表 → HTMLテーブル変換ExcelやスプレッドシートからコピーしてHTMLテーブルに変換します。Markdown表にも対応。.htaccessリダイレクト生成旧URLと新URLの対応表から301リダイレクトの記述を生成します。www統一や常時SSL化の定番も。ファビコン一式生成画像1枚から favicon.ico・各サイズPNG・manifest・HTMLの記述までまとめて作ります。OGP画像ジェネレータータイトルを入れるだけで、SNSシェア用の1200×630px画像をその場で作ります。画像のWebP変換・リサイズ画像をまとめてWebPに変換・リサイズし、前後のファイルサイズを比較できます。カラーコントラスト判定文字色と背景色のコントラスト比とWCAG判定。基準を満たす色も自動で提案します。
運営:WEBツール箱(MOTOKI合同会社)
WordPress専門のホームページ制作会社です。日々の制作で「毎回調べるのが面倒だった」ことを、そのままツールにして公開しています。
診断結果の見方や改善のご相談も承っています。お問い合わせ
WordPress専門のホームページ制作会社です。日々の制作で「毎回調べるのが面倒だった」ことを、そのままツールにして公開しています。
診断結果の見方や改善のご相談も承っています。お問い合わせ