explaingit

nnhubbard/zssrichtexteditor

3,788Objective-CAudience · developerComplexity · 2/5Setup · moderate

TLDR

A rich text editor component for iOS apps that adds a word-processor-style formatting toolbar with bold, italic, headings, lists, images, and a live HTML source view, drop in by subclassing one class.

Mindmap

mindmap
  root((ZSSRichTextEditor))
    What it does
      Rich text WYSIWYG editing
      HTML source view
      Formatting toolbar
    Formatting options
      Bold italic underline
      Headings and lists
      Images and links
      Text and background color
    Integration
      CocoaPods install
      Subclass to customize
      Restrict toolbar buttons
    Social features
      Hashtag detection
      Mention callbacks
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Build a blog post composer in an iPhone app with bold, italic, heading levels, and image insertion.

USE CASE 2

Add a formatted notes editor to an iPad app with text color, alignment, and undo/redo support.

USE CASE 3

Create a social feature with hashtag and mention detection callbacks for autocomplete suggestions.

USE CASE 4

Display and edit HTML content inside an iOS app with color-coded syntax highlighting in the source view.

Tech stack

Objective-CiOSJavaScriptHTMLCocoaPods

Getting it running

Difficulty · moderate Time to first run · 30min

The bundled JavaScript file must be added to Copy Bundle Resources in Xcode, not Compile Sources, or the editor will not function.

In plain English

ZSSRichTextEditor is a rich text editor component for iOS apps. It gives users a formatting toolbar similar to what they would find in word processors like Google Docs or Microsoft Word, embedded directly inside an iPhone or iPad app. The editor works by selecting text and tapping toolbar buttons to apply formatting. The editor displays content in a WYSIWYG (what you see is what you get) view, meaning text appears formatted as the user edits it rather than as raw code. A source view is also included that shows the underlying HTML with color-coded syntax highlighting. Changes made in the source view are reflected back in the formatted preview. The toolbar covers a wide range of formatting options: bold, italic, underline, strikethrough, subscript and superscript, six heading levels, text alignment, ordered and unordered lists, indentation, undo and redo, and the ability to insert images and links. Text color and background color can also be changed using a built-in color picker. Integration is done by subclassing ZSSRichTextEditor in your own class. You can load HTML into the editor, retrieve the HTML when the user finishes, and insert text or links at the cursor. The toolbar can be restricted to specific buttons, tint colors can be customized, and custom buttons can be added. The editor also fires callbacks when it detects hashtags or mentions, which is useful for social-style apps. Installation works through CocoaPods or by copying the source files manually. The README includes an important note: the bundled JavaScript file must be added to Copy Bundle Resources in Xcode rather than Compile Sources, or the editor will not function correctly. iOS 7 or later is required.

Copy-paste prompts

Prompt 1
I'm building an iOS app and want to embed ZSSRichTextEditor. Show me how to subclass it, restrict the toolbar to bold/italic/underline, load existing HTML content, and retrieve the final HTML when the user taps Save.
Prompt 2
My ZSSRichTextEditor isn't loading in Xcode after CocoaPods install. The README mentions a JavaScript file must go into Copy Bundle Resources not Compile Sources, how do I fix this in my Xcode project settings?
Prompt 3
How do I add a custom toolbar button to ZSSRichTextEditor that inserts a custom HTML snippet at the current cursor position?
Prompt 4
Using ZSSRichTextEditor, how do I set up the hashtag and mention detection callbacks to trigger a user autocomplete dropdown as someone types?
Open on GitHub → Explain another repo

← nnhubbard on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.