Revolutionize the Web
Home » iPlasmaCMS2 User Guide » 1.2 The WYSIWYG Editor » 1.2.08 Inserting Images

1.2.08 Inserting Images

You can insert an image at a specific location using the following icon.

Upload Image

***NOTE*** Do NOT Copy/paste or click and drag images into the WYSIWYG editor. This breaks the image and causes it to not show up on your site.

  1. General
  2. Appearance
  3. Advanced

General

When you select this icon, the following window appears.

Insert And Edit Image

1a. Select the image from the image manager. For how to use the Image manager, see the Image Manager help.

Image Manager

 

1b. Make sure the image description and title match. You can see a preview of your image in the preview section.

1c. Visit the appearance tab as shown below.

Back to Top 


Appearance

Appearance

 

The window will now look like this.

Appearance Tab

 

In the Alignment section, use the dropdown arrow to select how you want your image aligned. The box next to it will show how your picture will be aligned with text.

 

  • The Dimensions tab allows you to change the size.
  • Constraining proportions allows you to keep the original shape of the image.
  • Vertical and horizontal space define space around the image(we recommend 10 in both sections).
  • The border section defines a border around the image(in pixels).
  • Style simply defines the code for the choices you make in the above sections.

 

**NOTE** It is not recommended that you resize the image in this editor! If you wish to resize the image, do it in the Image Manager.

Back to Top


 Advanced

Want to make your image change when you mouse over it? You can do that in the WYSIWYG too.

3a. Click on the “Advanced” tab.

Advanced Tab

The screen that appears will look like this.

Swapping Images

3b. Select the “Alternative Image” toggle.

3c. Use the Image Manager buttons to bring up the Image Manager for the “For Mouse Over” and “For Mouse Out.” (For how to use the image manager, see the Image Manager tutorial)

***NOTE*** If you only use the “For Mouse Over” section, the picture will not change back when you move the mouse away from it.

Back to Top


 

«Previous 1.2.07 Insert/Edit LinksTable of Contents | Next 1.2.09 Insert Embed Code»