HTMLエディタを自作！「簡易的なHTMLエディタをhtml/css、javascriptで作成する方法」
現在、自作でホームページのCMSを作成しているのですが、記事作成画面となる「エディタ画面」も自作してみましたので、ここでまとめておこうと思います。 先に画像を貼っておきます。下のような簡易的なやつになります。 htmlのtextarerが入力画面となっていて、隣にあるdiv要素で作ったboxに入力した内容が反映される感じになってます。 Ajaxのような非同期通信にも見えますが、そんな高度な事はしておらず、javascriptのkey up関数で、キーボード入力が検知（キーが上がった瞬間）されれば、textareaの内容がdiv要素に渡されるだけの、簡易的なプログラムになります。 簡単なHTML/CSSとjavascriptで作成できるので、しょぼいですがなにかの参考になれば幸いです。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset
超爆速でWYSIWYGエディターを組み込む - Qiita
こんなオーダーが。 「いい感じで記事をかける機能導入して！」 「ヘッドレスCMS使えばすぐできるから！」 ほほう。では軽く調査しよう。 〜数日後〜 いや、簡単にはできないですぜ。少なくとも使用するメリットないっすね。 そもそも、ランニングコストかかりますぜ。 「じゃあいい感じに導入して！」 「できるだけ早くね！」 そんなこんなで、超爆速でWYSIWYGエディターを組み込んだ話を。 初めに 既存システムは割とレガシー。 PHP 7.2 Laravel Framework 7.25.0 MySQL 5.7 jQuery 3.5.1 Bootstrap そもそもWYSIWYGエディターとは？ WYSIWYG（アクロニム: ウィジウィグ）とは、コンピュータのユーザインタフェースに関する用語で、ディスプレイに現れるものと処理内容（特に印刷結果）が一致するように表現する技術。What You See
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
