ITエンジニア/デザイナ向けにオープンソースを毎日紹介

技術 - WYSIWYGの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2017/06/14

Ory - 段組まで変えられる高いカスタマイズ性を持ったWYSIWYGエディタ

一昔前のCMSというとユーザの見る画面と管理画面がはっきりと分かれていました。セキュリティ上はやりやすいかも知れませんが、管理者としてはユーザがどう見えているかを逐一確認する必要があって不便でした。最近ではユーザの見ている画面上でそのまま編集できるものが増えています。その最新作と言えるのがOryです。## Oryの使い...

List

  • 2017/04/02

Pen - WYSIWYGなMarkdownエディタ

最近Dropbox Paperというサービスが気に入っています。特にMarkdown風の記法で、WYSIWYGに編集できるのが便利です。しかしオフラインで使えないのは大きな問題で、これが解決できると便利だと感じることでしょう。そこでWYSIWYGなMarkdownエディタを探しているのですが、その中で出会ったのがPen...

List

  • 2017/04/01

Alloy Editor - 多機能でWYSIWYGなMarkdownエディタ

Markdownは覚えやすい記法だと思いますが、それでも一定の書き方を覚えないと使いこなせません。そのため多くのMarkdownエディタでは2画面のプレビューがある(間違っていないかすぐに確認できる)ものとなっています。個人的には2画面があまり好きではないのでWYSIWYGなものがないかと思っていました。そこで出会った...

List

  • 2016/12/05

medium-draft - Medium風のWYSIWYGエディタ

良いサービスというのは真似る人が多いものです。良いと思ったものを自分たちのサービスに反映したいと考えるでしょうし、純粋に開発者として自分でも実装してみたいと考えることもあるでしょう。最近多いのはMediumです。今回紹介するmedium-draftはMedium風のリッチエディタを再現したソフトウェアになります。## ...

List

  • 2016/08/31

Froala WYSIWYG HTML Editor - 綺麗なデザインのWYSIWYGエディタ

昔のWYSIWYGエディタと言うとツールバーに多くの機能が並んでおり、生成されるHTMLは相当分かりづらいものでした。機能が豊富すぎたために表示速度が重たかったり、一般ユーザにとっても混乱しかねないものだったと思います。現在ではずいぶん進化しており、すっきりとしたデザインで使いやすいものが増えています。今回はFroal...

List

  • 2016/07/30

Slate - カスタマイズできるWeb用のリッチテキストエディタ

HTMLのテキストエリアのUIが貧弱なのは有名な話で、文字入力が多いサービスにおいて素のテキストエディタをそのまま提供することはなくなっています。かといってかつてのWYSIWYGエディタのように機能がてんこ盛りなのも見かけません。もっとスマートに、もっと使いやすい形で入力してもらうべきです。今回はWeb上にリッチなエデ...

List

  • 2016/06/07

Editor - Web用のMarkdownエディタ

世の中、Markdownばかりになってきました。その効果として、コンテンツが増えたり、関連ツールも多数出てきています。特にMarkdownエディタについてはかつてのWikiのように多数の言語で実装されるようになっています。今回紹介するEditorもその一つですが、単独で動くものではなくWebサイトに埋め込んで使うタイプ...

List

  • 2016/05/21

Dante - Medium風WYSIWYGエディタ

ブログシステムとしてMediumが人気です。シンプルなUIで、文章を書くという目的にぴったりです。特にエディタが良くできていて、セクションごとに動画や写真を挿入したり、文章を装飾する際に表示されるツールバーも良い感じです。そんなMediumのエディタを真似たのがDanteです。自分のサービスの中にMedium風エディッ...

List

  • 2016/02/26

MediumEditor - MediumクローンのWYSIWYGエディタ

ブログサービスとして人気のMedium。書きやすさがとても大事で、それはデザインやフォントサイズなど様々な面に表現されます。そんなMediumの使っているWYSIWYGクローンと言えるのがMediumEditorです。## MediumEditorの使い方デモです。シンプルで分かりやすいです。!

List

  • 2016/02/09

MaterialNote - マテリアルデザインのWYSIWYGエディタ

WYSIWYGなエディタはたくさんあります。昔はリッチで機能が多いものが良いとされてきましたが、最近ではなるべくシンプルによく使われる機能だけを提供するというものが増えています。今回紹介するのはMaterialNote、デザイン性の優れたWYSIWYGエディタです。## MaterialNoteの使い方これがMater...

None

  • Premium_s 2016/02/03

業務で使えるオープンソース(175)「WYSIWYG」

今回のテーマはWYSIWYGです。過去に2013年にも同じテーマで行っていますが、すでに3年前の内容とあって、トレンドとはずれてきています。そこで今回は2014年以降に紹介したWYSIWYGエディタを中心に紹介したいと思います。## 最近のトレンド### HTML5HTML5が勧告されたこともあって、HTML5を駆使し...

List

  • 2015/11/08

Trix - 毎日使うからこそ。Basecamp製のWYSIWYGエディタ

見た目に派手、またはとにかく機能を詰め込んだソフトウェアは一見すると便利そうに見えるでしょう。しかしそれを毎日使い続けるとなると話は別です。むしろシンプルで必要なものだけが揃っている方が安心できるのではないでしょうか。Trixはそんな観点から作られたWYSIWYGなテキストエディタです。開発したのはBasecamp(前...

List

  • 2015/10/05

ContentTools - ユーザが見ている画面をそのまま使って編集

WYSIWYGエディタは見たままに編集できるというのが売りです。とはいえ、管理画面などで提供されるものはHTMLタグの入力を省略できるだけで、表示されている内容がそのままユーザ向けに表示される訳ではありません。今回はまさに見たままにユーザにも提供できるコンテンツを編集可能なContentToolsを紹介します。## C...

List

  • 2015/09/26

woofmark - MarkdownのWYSIWYGエディタ

Markdownを扱えるサイトが増えるのに伴って、自分のサイトでもMarkdownをコンテンツに使いたいと思うのではないでしょうか。レンダーは数多くありますが、さらにコンテンツを編集する機能も提供しなければならないでしょう。そこで使ってみたいのがwoofmarkです。WYSIWYGなMarkdownエディタで、HTML...

List

  • 2015/09/25

Substance - Webページをそのまま編集できるWYSIWYGエディタ

Webサービスの種類によってはユーザにコンテンツを作成してもらうタイプのものがあります。最近ではMarkdown記法で書かせることが多いようですが、それも記法に慣れた人向けでしょう。初心者はHTMLも分からないものです。そんな中使えるのはWYSIWYGなエディタです。HTMLをインラインで修正できるSubstanceは...

List

  • 2015/09/12

Summernote - シンプルなUIのBootstrap用WYSIWYGエディタ

ユーザにコンテンツを作ってもらう上で欠かせないのがWYSIWYGエディタです。HTMLでの記述に慣れた人にとっては邪魔くさいかも知れませんが、そうでない人のがたくさんいます。そうした人が自由に思い通りにコンテンツが作れるWYSIWYGエディタはとても大事です。今回紹介するSummernoteもそんなWYSIWYGエディ...

List

  • 2015/08/23

ProseMirror - Markdownで記入できるWYSIWYGエディタ

WYSIWYGエディタは多数ありますが、基本HTMLを作成するためのツールです。HTMLに不慣れな非エンジニアにとっては便利ですが、ある程度技術力がある人にとってはツールの使い勝手によってストレスが感じられるでしょう。今回は次世代的なWYSIWYGとも言えるProseMirror

List

  • 2015/02/13

Meltdown – WebベースのMarkdownエディタ

Markdownで文章を書く機会が増えると、テキストエディタでフォーマットを記述するのではなくツールで入力したいと思うようになります。まだ記法になれていない場合は入力ツールがあると便利です。今回はWebベースのMarkdownエディタ、Meltdownを紹介します。プレビューもあるMarkdown入力エディタです。##...

List

  • 2015/01/03

wysihtml – カスタマイズも簡単。HTML5 validなWYSIWYGエディタ

Webブラウザ上で使えるWYSIWYGなエディタは昔からずっと存在します。にも関わらず新しいソフトウェアが年々登場しているところを見ると、自分のサイトや使い方にぴったりマッチするツールがないのかも知れません。とにかくカスタマイズがしやすく自分たちのサイトに自由に組み込めるものが良いと考える方はwysihtmlを使ってみ...

List

  • 2014/12/29

Dante Editor – Webページそのままに編集できるWYSIWYGエディタ

WYSIWYGなエディタは多数存在します。従来はMS Word並に多くのツールバーが表示されて、その中でHTMLコンテンツが自由に組めるといったものが多かったですが、最近では機能は少なめに、スマートな表示が特徴的です。Dante Editorはそんな今時のWYSIWYGエディタの一つになります。一見、編集画面と分からな...