How to add images, link material from other sites, and more
The editor is a window, rather like a word processor built into your website, which lets you edit text without needing to know HTML code.
There's a very comprehensive user guide at http://docs.cksource.com/CKEditor_3.x/Users_Guide.
If you want to actually experiment with the editor without fear of doing any damage, there is an online demo at http://ckeditor.com/demo#full
For page content you can use a language other than English that is supported by the UTF-8 character set for Redhat Linux EL5. This includes languages using non-latin characters.
There may be slight differences between computers, depending on their age and the software used.
Start by creating your image locally (on your own computer) and make sure it is sized correctly – the size you want it to appear on your website.
1) Click the "image button" on the editor. It is the one that looks like an outdoor photograph (under the "Source" button)
2) The "Image Properties" window will pop up. Click the "Upload" tab.
3) Click the "Browse" button, select your gif, jpg, or png file, then click the "Send It To Server" button. You will get a success message when completed.
4) Click the "Cancel" button to close that window. Now the image will be in your custom image library, ready to insert.
1) Place your cursor where you want the image to be inserted.
2) Click the image icon.
3) Click the "Browse Server" button.
4) The image library window will pop up and your custom image pane will be open by default. Click on the image you want inserted, the window will close, and your image will be inserted.
(Note: to insert an image from the stock "Toastmasters Image Library", just click on that tab, then click on the image you want to use.)
The above upload procedure still works, but you may find it easier to drag an image from your computer desktop or file manager and drop it into the editor. The image is uploaded for you. Then you can proceed to resizing and positioning your image as described below.
Unless you are using Firefox, you can't yet copy and paste an image into the editor from your computer desktop or file manager. You can, however, copy and paste from other sources.
Once your image has been added to the page, you may wish to change its size, put a border around it, and/or position it to the left or right of the page and have text flow around it.
Click on the image and then on the image icon in the toolbar (arrowed in the first image above). A dialogue box comes up.
If necessary, click on the Image Info tab.
To resize the picture, make sure that the lock (inside the red circle) is closed before doing anything else. Click on it if necessary. Then type either the width or height in the appropriate box.
You would only have the lock unlocked if you are deliberately wanting to distort an image.
If you've already distorted your image and want to start over again, click on the reload icon (circular arrow - also in the red circle) to reset. Then resize as described above.
If you would like the size of your image to automatically adjust for various screen sizes (e.g. viewable on mobile phones), then enter a percentage (e.g. 80%) for the width, but leave the height blank. Your browser will automatically resize the image for various screen widths without distorting the image.
If you want a border around the image, enter the required border thickness (in pixels) in the border box. If you're not sure, use "1".
The HSpace and VSpace define the gap (in pixels) between the picture and the text, in the horizontal (HSpace) and vertical (VSpace) directions.
Align gives you a choice of having the picture to the left or the right of the text, with the text flowing around it, or not set. Not set means that the text will not flow around the picture.
If you want a centred picture, make sure that it's in its own paragraph, and then set text alignment to centred.
Important: Please enter something descriptive in the Alternative Text box, to help those who are unable to view the image. In addition, Google considers this to be an important feature when ranking pages.
Sometimes, you may insert an image in you page and discover that it's lying on its side, or even upside-down. Using this tool, you can quickly and easily re-orient the image.
Choose "Rotate image" in the Web Page Tools pull-down menu.
Choose the image from the pull-down list, then choose the amount of rotation you need and click Rotate Image/Photo.
Note: You can only choose increments of 90 degrees. You can't use this tool to create other angles of rotation. If you wish to do that, you'll need to use an image manipulation program.
From time to time, you'll want to replace an existing image on a page with a new one. This tool allows you to do this in a single operation.
Choose Replace Image/Photo from the Web Page Tools pull-down menu.
Select the existing image you want to replace in the upper pull-down list, and select the replacement image in the lower pull-down list.
If the image you want to replace isn't on the server, you can upload it from your computer with the Upload Image button.
There is also an option to delete the original image from the server, if it is one that has previously been uploaded to your site. (You cannot remove system images.) If you're going to do this, make sure that you have a backup somewhere, in case you need it again in the future.
When images are no longer needed, ensure to remove the image from your page first THEN delete it from your library.
Otherwise, your browser will try to display an image that does not really exist. This may cause your website to load vary slowly or not at all. You may need to ask an admin to reset your website in this case. This is an especially bad situation to be in on the day of a club meeting.
Doing it this way takes users to a completely different site. If you'd prefer that they stay on your club website, see the next section.
You can do this by creating an IFrame. This is a special window in which material from the other site will appear. The user does not need to click on a link and they will not be taken away from your site. Google maps are a common use of IFrames.
To insert an IFrame you can use the IFrame tool. Click on the IFrame button:
Then enter the details in the window.
The height and width figures define the dimensions of the frame. You may need to experiment with them to get the effect that you want.
You won't see the content of an IFrame when you are editing the page, only a rectangle of the relevant size.
Once you have finished editing, save and close. To see the final effect, choose the page from the menu.
Broken links cause annoyance and detract from the value of your page. They also slow down page load performance, particularly in the cases of images. This item gives you a quick and easy way to check for them.
Choose Link Checker from the Web Page Tools pull-down menu.
You'll be shown a list of working links, plus any that aren't working properly. Anything in the second list needs to be removed or fixed. Note that this also will include any image references that are broken--if you deleted an image in the wrong way, for example.
Web page variables are items that will update automatically as the information changes. They are especially useful for dates, such as the next meeting date, which change regularly.
Select a variable from the pull-down list and, depending on your browser, it will be copied to the clipboard.
- Some browsers don't use this function. If the variable isn't copied, you can enter it yourself, making sure that it begins and ends with two curly braces.
The variable will still be visible in the page editor window after you've saved. To see the end result, close the editor.
For the basics on doing well in Google search, see http://support.toastmastersclubs.org/doc/item/improving-google-ranking
For further information from Google itself, see https://www.google.com/webmasters/docs/search-engine-optimization-starter-guide.pdf
Do remember, though...
Google is only one way that people find your website and your club. Don't rely on it to the exclusion of other methods. For example, you might find that most of your contacts are word of mouth, or come from a link on your District site.
How to find out? Ask visitors where they heard about you. Then put most of your efforts into making sure that these things are working well.