Editor Help

Frequently Asked Questions – Member Site Setup

Tips for using the WYSIWYG editor

WYSIWYG stands for "What You See Is What You Get".  The Drupal WYSIWYG (CKEditor) is a very commonly used control in modern content management systems.  While the WYSIWYG is designed to be easy to use and for the most part self explanatory, all WYSIWYGs have flaws and some effort should be made to learn the way this control works.  A few tips and tricks have been created for commonly used features.

Links:

Any text in the WYSIWYG can be linked to another page in the web site, an external page, a file, or an email address.  

1. To start building a link, highlight the text in the WYSIWYG and click the Link icon in the toolbar:

(toolbar screenshot)

2. The following screen will appear:

(insert link interface screenshot)

3. For a basic link to a web page, simply add that page's URL in the URL text box. You can leave off the "http://" part of the URL. The text editor will add it for you. For example, a link to Google would be: www.google.com.

3a. To link to a person's e-mail address, choose E-mail in the Link Type drop-down box.

For most links, that is all the information you need.

4. Click OK and you are done.

Linking to files (such as PDF):

1. To create a link to a PDF file, highlight the text in the WYSIWYG and click the Link icon in the toolbar:

(toolbar screenshot)

2. The following screen will appear:

(insert link interface screenshot)

3. Click the Upload tab (highlighted in the above screenshot).

4. The following screen will appear:

(upload screenshot)

5. Click the Choose File button and browse to the PDF file that you wish to upload.

6. Click the Send it to the Server button.

7. Once the file has uploaded, click the Browse Server button.

You should see your newly uploaded file along with any other files that have been previously uploaded.

8. Double Click the file. This will close the Browse Server window.

9. Click OK on the Link window and your link will be created.

For internal pages, it is only necessary to use the end of the URL.  For instance, the URL of to the "About Us" page is http://yoursubdomain.lakesandrivers.org/about-us.  To link to this page from within your web site, put in:

/about-us

That is, use only the portion of the URL following http://yoursubdomain.lakesandrivers.org.

Images

Images can be added to any WYSIWYG content using the Images button.  First, place your cursor at the beginning of the text where you want the image to appear.  Then click the Images button on the WYSIWYG toolbar:

(images button screenshot)

The following screen will appear:

(insert image screenshot)

Typically three of these fields are used when adding an image:

URL: to fill this in correctly, click the Browse Server button, this will open up the File Browser.   Use the File Browser to select or upload the image, the Image URL field will be filled in when complete.  

Alternate text:  some kind of descriptive text about the image should be added here.  This makes the site more accessible to visually impaired users with screen readers rather than browsers, and also helps search engines index the page.

Alignment:  Often users want to make text wrap around an image.  Typically the image is either on the left or right side of a page with text wrapping around it.  To do this, select either Left or Right off the "Alignment" dropdown.  

Click Insert to add the image.  

Tips on using content from Microsoft Word

If you are copying and pasting from MS Word, do not use the standard "Paste" button.  Instead use either the "Paste as Plain Text" button or the "Paste from Word".  Why?  These buttons strip away hidden HTML code that comes along with your content.  You may have to do a little more formatting after  you paste, but using these buttons gives you much more control over your content. 

We recommend the "Paste as Plain Text" button, as this button does the best job in stripping away unwanted formatting. 

How do I create a new page on my hosted site?

  • Sign in to your web site.
  • You should see a black and grey menu bar across the top of the page.
  • Click the "Add content" link on the grey navigation bar at the top-left of the page.
  • Click the Basic page link on the Add content page.
  • Fill out the Create basic page form.
  • Title: the title for the page – this will appear in large type at the top of the page.
  • Body: the full content of your page.  
  • Click the Provide a menu link.
  • Parent Item: you may choose to nest menu items to categorize your content by selecting a parent menu item for the new page
  • Weight:  menu items with higher weights will sink to the bottom of the menu.  Lower numbers will rise to the top.  Use the weight feature to organize the order of your site's menu.
  • You can leave the rest of the settings on this page at their defaults.
  • Click the "Save" button at the bottom of the page

How do I change the logo graphic on my hosted site?

  • Sign in to your web site. 
  • Click on the Appearance link in the Administration toolbar at the top of the page.
  • Under MSRPOSubsites theme, click Settings.
  • Under LOGO IMAGE SETTINGS > Upload Logo Image, click Choose File.
  • Browse to your logo image on your computer, select it and click Open.
  • (Your logo image must be smaller than 500 by 105 pixels.)
  • Click Save Configuration.