Share This Post

Overview

The HTML Editor interface allows you to easily edit your HTML documents from the File Manager interface (cPanel >> Home >> Files >> File Manager). This visual (WYSIWYG) HTML editor includes powerful editing functions of familiar desktop editors (for example, Microsoft® Word).

Toolbar

The HTML Editor interface offers the following tools that help you to edit your HTML files:

Save

htmleditortbsave— Saves the file to the server.

Templates

htmleditortbtemplates— Selects a template to use to structure your document with pre-built forms. Each template includes elements such as page layout, text format, and style.

Print

htmleditortbprint — Prints the file.

Undo Redo

htmleditortbundoredo— Undo or redo selections of text in your content.
  • Click the left arrow to undo your most recent actions.
  • Click the right arrow to repeat actions that you just undid.

Find and Replace

htmleditortbfindandreplace — Search for and replace selections of text in your content.
  • Click the Find icon to search the text for certain content.
  • Click the Replace icon to search for the content and then replace it with different content that you enter in the text box.

Select all

htmleditortbselectall— Selects the whole document, which you can then cut, copy, or delete.

Form tool

htmleditortbformtool— Insert one or more form elements (for example, checkboxes, text boxes, selection fields, or buttons). The form container must contain all of your form elements. Forms can include the following elements:
  •  — A checkbox allows users to select one or more items from a list within a form.
  • htmleditortbradio— A radio button allows users to select one item from a list within a form.
  • — A text box is a single-line field that allows users to enter text.
  • — A text area is a scrollable, multiple-line field that allows users to enter text.
  • htmleditortbselection— A selection field is a scrollable list that allows users to select one or more settings.
  • htmleditortbbutton— A button allows users to submit a completed form.
  • htmleditortbhidden— A hidden field is a field that users cannot see, but which the system submits to the server with the completed form.

Text tools

— Changes the appearance of text with the following settings:
  • Bold
  • Italics
  • Underline
  • Strikethrough
  • Subscript
  • Superscript

Remove Format tool

htmleditortbremoveformat— Removes the selected text’s formatting, but maintains the text itself. If you copied your content from an outside source and the format is inconsistent with the rest of your document, click this setting to set the text back to the default style.

List tools

htmleditortblisttools — Creates an ordered (numbered) or unordered (bulleted) list in your content.

Indent tools

htmleditortbindenttools — Increases the left or right indentation for the selected paragraph.

Block quote tool

htmleditortbblockquote— Creates a block quote for the selected text.

Div

htmleditortbdiv— Creates a div container around the selected text.

Alignment tools

htmleditortbalignment— Formats the selected text or images with the left align, center, right align, or fully justify settings.

Link tools

htmleditortblink— Creates a link to a website or file in your content. If you added a link that you no longer need, highlight the link and use the broken link icon to remove it.

Anchor tools

htmleditortbanchor— Creates anchors in your content to link to another section within your website.

Image tool

htmleditortbimagetool— Inserts an image into your file. When you use this tool, you can also browse the server and select an image from it, rather than your local computer.

Insert tools

htmleditortbinsert— Adds tables, horizontal lines, page breaks, and other special characters to your content.

Embed Media Content from Various Sites tool

htmleditortbembedmedia — Inserts multi-media elements, such as YouTube™ videos and Flash objects, in your document.

Styles menu

htmleditortbstyles — Sets the style of font for the selected text.

Paragraph Format menu_

htmleditortbformat— Sets the paragraph style for the selected text.

Text direction tools

— Set the direction of your text from left to right or from right to left.

Font menu

htmleditortbfont— Sets the font setting for the selected text.

Size menu

htmleditortbsize— Sets the font size for your text.

Color tools

htmleditortbcolor— Sets the color of the text as well as the background color of your text.

Minimize

htmleditortbminimize — Minimizes the interface to fit smaller windows.

Show Blocks tool

htmleditortbshowblocks— Displays a grid that separates the block-level elements with HTML tags.

Source

htmleditortbsource— Displays the source code for the content area.

About

htmleditortbabout — Displays information about the File Browser on the CKEditor website.

Insert an image

To insert an image, perform the following steps:

  1. htmleditortbimagetool
    — Click the Image tool icon in the toolbar. The editor displays the Image Properties interface. The Image Properties interface includes the following tabs:

    • Image Info (default) — Sets the image URL and manipulates how it displays in the document.

    • Link — Creates an image link, which can point to, for example, another web page or a document.

    • Upload — Stores your images on the server, where you can retrieve them without your local computer.

    • Advanced — Configures image settings (for example, ID assignments, classes, tooltips, or CSS properties).

2. Confirm your settings in the Preview interface and click OK.

For more information about the Image Properties interface, read the CKEditor Users Guide.

File Browser

The Browse Server setting directs you to the interface’s File Browser section. Use this section to browse, upload, and manage images on your cPanel account.

This interface includes the following sections:

  • Toolbar — A series of buttons that quickly execute specific file browser functions.
  • htmleditortbarrows— Move up or down levels of folders.
  • htmleditortbinfo— View more information for the selected file.
  • Folders pane — Organizes the folder hierarchy for easy navigation. Use the arrows to expand and collapse the different hierarchical levels.
  • Files pane — Lists the files available in the selected folder.
  • Status bar — The section at the bottom of the interface that displays information about, for example, the selected file or the total number of files in the folder.

Subscribe To Our Newsletter

Get updates and learn from the best

More To Explore

About Company

Leading Blog Hosting Providers for 2024

To begin with, let us briefly review the reasons why it is so important to invest in high-quality blog hosting sites. Your host provides a

Email Hosting Australia
Email

Email Deliverability in cPanel

Use this interface to identify problems with your mail-related DNS records for one or more of your domains. The system uses these records to verify that other servers can trust it as a sender.

Do You Want To Boost Your Website?

Share your requirements with us and we will get in touch with you shorlty.

ask
anything...

Get in touch