How can we help you?

Loading

Using the Easy Editor

 

The Volusion Easy Editor helps you easily edit and style content on your storefront and in your store’s Admin Area. You can use the Easy Editor to create HTML content for use in product descriptions, on the homepage, and more. 

Admin Area Editing

Most fields that accept HTML in your Admin Area come equipped with the Easy Editor “WYSIWYG” (What You See Is What You Get) tool. These fields include product and category descriptions, article bodies, and newsletter bodies. 

Wherever an editable HTML field exists, you can use the Easy Editor's tool bar to format text, add links, and insert images.

 

Read more about the functionality of specific Easy Editor buttons in the Easy Editor Tools section below.

Storefront Article Editing

You can modify content directly from your storefront by hovering over any editable area. Once you see the area outlined in blue, click Edit. You'll know that you're ready to edit the content once you see the blue dotted line appear around the content area.

The section below details the functionality of each button in the Easy Editor toolbar.

Easy Editor Tools

You can hover over the individual icons in the Easy Editor to view each button's function.

HTML

Click the HTML button to view the code version of the styled content within the Easy Editor window.

Formatting

 

 

Select from a drop-down list of common formatting options for your text.

Bold

 

Highlight a section of text and click this button to make the selected text bold.

Italic

 

Highlight a section of text and click this button to make the selected text italic.

Deleted

 

Select text and click this button to create a strikethrough effect. Note: this does not delete the text.

Unordered List

 

Click the Unordered List button to create a new unordered, bulleted list.

Ordered List

 

Click the Ordered List button to create a new ordered, numbered list.

Indent

 

Click the Indent button to add levels of indenting to paragraphs.

Outdent

 

Click the Outdent button to remove levels of indenting from paragraphs.

Insert Image

 

Click this button to open the Insert Image dialog box. You can upload an image file from your computer by clicking Browse or by dragging it into the zone labeled Drop file here. Once you've selected the file, the image will be automatically uploaded. (Note that when dragging an image into the drop zone, you can release the image as soon as the zone changes color and the image thumbnail displays the Move tag. See a depiction of this action below.)

You can also add an image from the internet by clicking Link at the top of the dialog box, then typing the Image Web Link and clicking Insert.

Once you've added an image, you can select the image in the Easy Editor window to resize it. Resizing will always maintain the aspect ratio of the image, preserving the integrity of the image dimensions. Note that you should not drag to resize an image in the Easy Editor if you're using a responsive template. Responsive templates are programmed to make this adjustment automatically, provided that there is no additional formatting on the image.

When an image is actively selected in the Easy Editor, you'll see a dotted outline around the image and an Edit link in the center of the image. Click Edit to open the Edit dialog box, where you can add an image Title (image alt text) or a Link URL. If you want an image's link to open in a new tab or browser window, select Open link in new tab. You can also use the Position drop-down menu to set the image's orientation within the content area.

Insert Video

 

Click this button to open the Insert Video dialog box, where you can paste the embed code for any hosted video. Click Insert to save the code.

Table

 

Use the Table drop-down to insert a new table, or to add / delete rows, columns, and headers for an existing table.

Link

 

Highlight text in the body of the Easy Editor and click Link > Insert Link to add a hyperlink to the text. You can also click Unlink to remove an existing hyperlink from a text selection.

By default, you enter the link's address in the URL field, change the link Text if desired, and select whether you want the link to Open in a new tab.

You can also click Email to create a link that will automatically open a pre-addressed email to the address you specify, using whichever mail client is native on the user's computer. Enter your email address in the Email field, then click Insert.

If you are familiar with HTML, you can create anchors throughout your text and use the Anchor option to create links to the anchors.

For all link types, click Insert to finalize and save the link in the Easy Editor window.

Alignment

 

Select from the Alignment dropdown to align text within the Easy Editor window.

Insert Horizontal Rule

 

Click this button to add a horizontal line to the content within the Easy Editor window.

Change font family

 

Highlight text in the body of the Easy Editor and select from a list of common fonts to change the font for your text.

Font Color

 

Highlight text in the body of the Easy Editor and select from a grid of colors to change the color of your text.

Back Color

 

Highlight text in the body of the Easy Editor and select from a grid of colors to change the background color behind your text.

Change font size

 

Highlight text in the body of the Easy Editor and select from a list of common font sizes to change the font size of your text.

Image Swapping

You can also update images and graphics that occur throughout the storefront, such as buttons. Note that images inserted into the Image Swap dialog box must be in .gif file format.

Page Text Editing

For non-styled, non-variable Page Text values, you can hover over the text and click Edit. This will open a dashed line area where you can type in the replacement text.

Click the checkmark icon to save your changes, or click the "x" icon to cancel the changes and preserve the current text.

Some Page Text values include dynamic variables as part of the editable text. In these cases, there will be an on-hover popup with a link to the specific Page Text ID in your Admin Area.

For other Page Text values that include inline styling, we recommend you make edits in the Admin Area in order to preserve the formatting.

Header / Footer Region Editing

On certain templates (such as "Retro"), you can make edits to your header and footer directly from the storefront. To edit, hover over these areas and click so Edit. Once you see the dotted blue border, you can edit text or click on it to unlink / change the associated URL. When you're finished, click the checkmark icon to save your changes.

If you don't want to save your changes, click the "x" icon or hit the "ESC" key on your keyboard to preserve the current text.