There are a few sections to this page:

• Adding images to your site
• Keeping images organised
• Resizing and cropping images
• Adding image captions
• Choosing images from other sections of the site
• Advanced notes
• Copyright

Adding images to your page. 

1. Click on the image button (the picture frame). This will display your image filesystem.
2. On the left choose the correct folder to add an image. There is a folder for each subdomain site (eg /ca for Canada). Inside this folder ,you can upload and delete images. You can browse images in other subdomain folders to add them to your page, but you can't add them there.
3. To upload an image, use the Upload button and select the image from your desktop. 
   
4. To add to an image to your page (either a freshly uploaded image or one that existed already), select that image and press the 'Add to ckeditor' button.

Keeping Images Organised.

We have kept the existing Plone structure of images, so you will find images already existing in subfolders. However, you may want to create more subdirectories to organize your images, e.g

• ca/images/meditation
• ca/images/people
• ca/images/size-250

To do this, navigate to the subdirectory /ca/images. Then click on the 'Manage directories' button, and type in a name (e.g. 'small') then click Add. You can now add images into this subdirectory /ca/images/small.

You can also use the 'Manage directories' button to remove directories

Resizing and Cropping Images

• You will achieve better results if you resize and crop images using Photoshop or Picasa before you add them to the site. However, there is basic functionality for cropping and resizing inside the file manager.
• To resize images, select the image, press the 'Resize' button and select the width and height. If you wish to change the width and keep the proportions, just change the width and then click in the height box - the new height will automatically be calculated.
• To crop images - select an image and press the 'Crop' button. In the bottom window, you will see the image inside a green square, and a tiny pink window. Hover around on the small pink window, and hold and drag. (Holding and dragging when there is a hand cursor will move the square, when there is a crosshair will change the square size)

  

  Note: to change the size of the cropping window, don’t try to change the size of the pink square (it wont work). Instead, click and drag to create a new pink cropping window. When you are happy, press ‘crop’. You can choose to crop the existing image or create a new, duplicate image.

Adding image captions

After you have added the image, press 'Source' and find the HTML for the image - we need to add a title attribute.

Changing it is relatively straightforward. The basic code for the image will look something like

<img src="/files/members/asprihanal.png" alt="" />

We change this by adding a title attribute:

<img src="/files/members/asprihanal.png" alt="" title="Asprihanal"/>

Once this is done, then click Source again, then click on the ‘Styles’ dropdown and add one of the 3 styles there (‘Align image to left, Align image to right, Unaligned image with caption’). You won’t see the caption immediately, but you will see it once you’ve finished editing and pressed ‘Save’.

Choosing Images from Other Sections of the Site.

• Suppose you like images in the UK section. You can browse in the left to  files/uk/images. You can then select the image you want, press Send to CKEditor, and use it in your page.
• Example: If you liked the lotus image on https://uk.srichinmoycentre.org/meditation. To see where the image is located: right-click on the image and then select 'view image'. This shows the image is at: http://uk.srichinmoycentre.org/files/uk/images/flower.jpg. Then, when you are editing your page, you can go into the filesystem, navigate to /uk/images and send this image to your page.

Browsing Other Sections to Find Images

Advanced Notes for Images

• To increase the speed of page load, it is important to keep the size of images low. When adding new images the size should be less than 100k.
• If an image greater than 900 by 600 pixels is added, it will automatically be resized.
• Some images in Plone were added without the .jpg suffix at the end. This means the text editor can't calulate their size and will add them as a link instead of an image.
• Linking Images. You can make a link into an image. Just click on an image and then select the link button. For example, the above image links to the main help page. Visitors often expect images to be links.

Copyright

• Please make sure you are not breaking copyright law before uploading images from google image search. We have thousands of beautiful images available on the Sri Chinmoy Centre Gallery to use, if possible try to use these instead of from some external site.

This page is in 2 sections

• The text editor
• Page options - dealing with the light blue tabs below the

The text editor

For text editing, we are using a program called FCKEditor, which we have been using for almost a year now on other sites and are very happy with. Most of the buttons/features should be self-explanatory (if you hold the cursor over them you can see their description), but we'll talk about a few of the less obvious ones here.

1. Paste from Word.
Besides the content, a Microsoft Word document contains a lot of unnecessary extra code and formatting wich can ruin the look of a page - use the Paste as Word button in the text editor to remove the junk but still keep the basic formatting.  If you want to remove all formatting completely, you can use the Paste as Text button.

2. Links

When you press the link button (the globe and chain) you can add a link by pasting in the URL of the page. We often find it handy to thave the page you are linking to open on a seperate tab, so you can easily copy and paste the URL. You can also press 'Browse server' to link to files or images, more on that here...

The 'link to menu' button will search for pages in your country site to link to (to save you pasting in the URL) but it isnt fully functional yet.

3. Images
We have a whole page on adding and editing images here....

4. Show Blocks
This is not a button you'll be using often - basically if you're trying to put a complicated layout on your page and it is not working out the way you expected, this button will show the different 'blocks' on your site (eg paragraphs, tables, div classes) so you can see if any of them are accidentally bumping against each other.

5. Teaser button
A teaser is basically like the 'Description' field in Plone.

• On the Centre site, it is the text that appears on the 'Latest News' page/sidebar block for your country site.
• On the Races site, it appears in News and Events sidebar blocks as well as different 'views' that can automatically display laterst news and results.

When you want to set a teaser, you click the cursor on where you think the break should take place between the teaser and the main content, and then press the 'teaser' button. A red line will appear separating the teaser from the rest of the content.

If you unclick the 'Show summary in full view' checkbox, then the teaser you have set will not appear in the main page at all, so you can keep your teaser and main content completely seperate.

6. Source
This is basically the HTML code of the page. Bear in mind that settings such as the colour and size of text and headings is set globally using a time-honoured method known as CSS, so tyring to change them may not bring about the results you expected. A website looks more professional if it has a consistent look.

7. Templates

We have included some templates to help speed up the process of creating web pages:

• Centre site: We have many countries making a country site for the first time. To help speed up the process, we have included a few page templates that can be added and then changed/translated.
• Races site - we have included quite a few 'view' templates that will automaticaly display events/ results happening in your country

8. Spellcheck
The spellchecker uses a remote service to spellcheck, and you can select quite a few languages. Its a little annoying the way it keeps holding up 'Chinmoy' as a spelling error, but we're not sure what we can do about that.

9. Format
If you want some text as a heading, you select it here

10. Style
This is only really important for images (so far) - for more on this see the page on adding and editing images....

• To align images left or right, click on the image and then select the appropriate option from the 'style' list.
• If you want to add an image caption but still have the image unaligned, then select 'unaligned image with caption'
   

Page Options

Submit page for moderation

Country editors will see a 'Submit page for moderation' checkbox, when they are ready to send their changes to the country manager to be moderated. Country managers will not see this, as their content is published by default.

Mark as news/event item

This is handled differently in the Centre and Races sites, see the below links:

• Centre site
• Races site

Navigation controls

When the 'Show child pages...' option is ticked here, some nice navigation options show up at the bottom of the page. If the page has child pages, they will show up in a 'table of contents'-like listing. Below that, a previous/next navigation shows up. This can be a very nice alternative to the navigation menu.

If you don't want to go through every page enabling/disabling this setting, you can save work by checking the 'Apply the above setting...' box.

Revision information

Drupal creates new revisions every time you edit a page. If you are unhappy with how the page looks once you save it, you can 'revert' to the previous revision in the edit tab.

In the 'Revision information' section you can organise your revisions by explaining the current changes in the Log Message box. Note that revisions older than a few weeks will be automatically deleted.

URL path settings (i.e the short name)

1. The URL path is basically what we used to call the 'short name' in Plone. When saving, all the URL paths will automatically be named after the title of the page, not including the folder structure. In Plone they were named after the folder structure. If you want to rename your page something different than the title, just uncheck the Automatic alias checkbox in the URL settings and enter your title. Read more on setting URL...
2. It is best to have the URL's all in Roman alphabet characters. If your country language uses additional accents on letters, or is entirely non-Roman (eg Cyrillic or Japanese), Drupal will do its best to 'transcribe' the non-Roman bits of the URL into phonetic Roman letters. We think the attempt at transcribing will cover all scripts used on the site, including all Cyrillic scripts, Georgian and Japanese katakana. If there is a character not covered, please let us know.
   However, you may feel that the results are not good enough and that it's best to enter an alias yourself. Note that if the Save button is pressed with a non Roman alias and the transcribing fails, any non-Roman symbols will simply be stripped from the path.
3. When importing the site, we made sure all the old URLs were kept, so there will be no broken links.

Book outline

Basically this controls where the page gets placed in the parent/child structure of the site. By default, the parent is the page you were on when you clicked the 'create new page' link. If you were in an admin page when you clicked it (eg editing a sidebar block) then the parent page is set to the country home page. You can change that default here.