The WYSIWYG (what-you-see-is-what-you-get) editor for the Mozilla Developer Network wiki makes it easy to contribute new content. This guide shows you how to use the editor and improve your productivity. Please read and comply with the Mozilla Terms before editing or creating new pages.
The MDN style guide offers information about how to format and style the content itself, including our preferred grammar and spelling rules.
- Editor UI elements
- The built-in WYSIWYG editor on MDN is designed to make it as easy as possible to create, edit, and improve articles and other pages almost anywhere on the site.
- It's frequently useful to include images in articles. Images may be screenshots, examples of what a rendering should look like, or SVG diagrams of program flow, for example. This article describes how to use images in MDN content.
- Links not only among many documents, but within a single document are a crucial component to any wiki, and MDN relies heavily on them. Fortunately, links are also very easy to create, even though there are lots of ways to make them!
- Sometimes you need to have a page that simply redirects to another page, or to a section of another page. This article describes how to create redirects.
- Source mode
- MDN's editor has a prominent button that gives you the ability to switch into source editing mode. In this mode, you see the underlying HTML for the body of the article you're editing. This guide will help you understand what you can do with this feature, what you should do with it, and, most importantly, what not to do.
- Syntax highlighting
- When you add a code example to an article on MDN, it's helpful to enable syntax highlighting, to make it easy for readers to visually pick out relevant bits of the code. Here's how to enable syntax highlighting in code examples:
- Tables are a useful way to present information; this article covers how to create and maintain tables on MDN and when you should and should not use them.