Creating new content for your site is relatively easy. To create a Basic page:

1. Click on Add content in the shortcut toolbar.
2. Click on Basic page link at the top of the overlay.
3. Enter the Title for the page.
4. Enter the main content for your page in the Body field. Use the WYSIWYG toolbar to format text, add tables and upload images and files.

Important Note: Themes use CSS styles to create consistency in the display of content for your site. These pre-defined styles define the text size, alignment, and color. The pre-defined styles protects your site from less-technical users who might want to create a colorful rainbow of extra large text.

The WYSIWYG toolbar provides you with all the tools you need to manage the content that is on your page. This toolbar displays at the top of your Body field when you click on the Edit tab. The diagram below itemizes the tools that are part of the basic YaleSites setup.

Typography refers to the general appearance of text on your website. Each theme has different styles for the various types of text, based on the look and feel of the site i.e. Heading styles, table styles, paragraph styles.

When adding content to your page, you can use the WYSIWYG toolbar to change the format, improving usability. These formatting options enforce the integrity of site design by only allowing fonts, sizes and styles that are part of the design. The WYSIWYG toolbar allows you to easily change the format to create bold or italic text, bulleted or numbered lists, special characters, and much more. This page provides a visual guide to the various styles for the YaleSites Standard themes.

Heading 2 sub-head

Second level heading used in the body section of the page. Vel ancillae volutpat eu, est everti dolores definitionem ad, eum noster sapientem similique ea. Te per esse tamquam, pro dicunt aeterno appetere ad. Iusto scripta id vix, ad nam causae inermis definitionem, ad sea vidit habeo.

Heading 3 sub-head

Third level heading used in the body section of the page. Ut illum paulo eam, inani salutatus vis eu. Natum movet libris ius ex, an eum noster feugiat explicari, eu nec graece scribentur. Mel cibo fuisset albucius ut, ferri consul ut has. Primis moderatius consectetuer vim te.

Heading 4 sub-head

Fourth level heading used in the body section of the page. Vim ne summo senserit, justo graeco molestie vis at. Vis corpora pericula eu. Error blandit id qui. Facilisis laboramus honestatis pro ut.

Heading 5 sub-head

Iusto scripta id vix, ad nam causae inermis definitionem, ad sea vidit habeo. Facilisis laboramus honestatis pro ut. Illud ceteros no duo, at ceteros eligendi tincidunt usu.

Heading 6 sub-head

Iusto scripta id vix, ad nam causae inermis definitionem, ad sea vidit habeo. Facilisis laboramus honestatis pro ut. Illud ceteros no duo, at ceteros eligendi tincidunt usu.

Lists

See Create Lists for detailed instructions on how to configure nested lists.

Bulleted List

• Bulleted list item 1
• Bulleted list item 2
• Bulleted list item 3
• Bulleted list item 4

Numbered List

1. Numbered list item 1
2. Numbered list item 2
3. Numbered list item 3
4. Numbered list item 4

Nested Lists

You can mix and match bulleted and numbered lists anyway you want.

1. Step One
2. Step Two
   • A statement about step two
   • Another statement about step two
3. Step Three
4. Step Four

• Step One
• Step Two
  1. A statement about step two
  2. Another statement about step two
• Step Three
• Step Four

Blockquote. Use the Blockquote button  on the WYSIWYG toolbar to add these quotation marks around paragraph text. Sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip.

Tables

Tables should only be used when you have data that needs to be stored in tabular form. CSS, not tables, should be used for layout purposes.

Here is a sample table with a Header text

Header	Header	Header	Header
Data	Data	Data	Data
Data	Data	Data	Data
Data	Data	Data	Data

Here is a table with the Grid Table class

Header	Header	Header	Header
Data	Data	Data	Data
Data	Data	Data	Data
Data	Data	Data	Data

Horizontal Rule

---

Other Formats

• Special characters can be used for languages other than English. click on the Special Character icon  and choose the character to add.  i.e. ñ ë
• Superscript and subscript can be used to add characters for math or chemical formulas i.e. H20, 102. Select the character and use the superscript and subscript  icons on the WYSIWYG toolbar.
• You can use strikethrough to create a line through a word or phrase. Select the word or phrase and use the strikethrough icons.

If you want to add your new page to a menu, you can do that as you create your page. When you scroll to the bottom of your page, you will see a set of vertical tabs. The first option is Menu settings where you will assign your page to a menu.

Click the Provide a menu link check-box and you will see fields for the Menu link title, Description and drop-down selector (Parent item) where you can select the menu you want the link appear on.

• Menu link title – the title of the page displays, but it can be changed if you want the menu link to be different from the title of the page i.e. ‘About us’ would be the menu link for About the English Department page title.
• Description – not required. This text displays when a site visitor hovers over the link so it can provide more information.
• Parent item – choose the menu you want your menu link to appear on. The drop-down selector provides only the menus that are available for that specific content type.

Revisions is an easy way to create a backup copy of the work you are doing in the event you want to revert to a previous version. You can enable revisions for each page you create, or it can be incorporated as part of a Content Type.

Important Notes:

• Revisioning alone does not allow you create draft versions of pages that are live. If you want this functionality, you need to enable the Workbench module.
• If you have revisioning turned on, and you are uploading files using the File field, each file uploaded will be renamed (file_upload.pdf, file_upload_0.pdf, file_upload_1.pdf. In order to avoid this, use the WYSIWYG toolbar link icon and upload files there.

To access Revisions, click on the Revision information tab and check the Create new revision. Be sure to enter a message to indicate how your changes affect the page. If this was built in as part of your Content Type, the checkbox will already be checked.

You can view lists of all the available content on the Browse Content panel of your Dashboard. The Browse Content listing provides a keyword search and other filters that allow you to easily find the content you are looking for.

Browse Content

1. Click on Dashboard in your Toolbar (black bar across the top of your site).
2. Enter a keyword and/or choose the type of content to filter the results.
3. Click Apply and a listing of content that meet the criteria set displays.
   
4. Locate the page/node that you want to edit and click on the edit link at the very end of the row. 
5. Make the desired changes and click on the Save button at the bottom of the page. Once you have saved your changes on the page, the Dashboard displays where you can choose another page and make additional changes.

Editing existing content directly from the page

1. Login to your site and navigate to the page that you want to edit. You will see an Edit tab at the top of the page.
2. Clicking on the Edit tab will display a form page where you can make changes directly to the desired field.

Linking to pages in your YaleSite is very similar to linking with standard HTML - you select the text and then assign a URL or web address so the page opens when the text is clicked. You can create a link to an external site, to a page within your site to an email address, and to a specific location on a page (anchors).

Creating a link to an external site

To create a link to an external site, use the   Link icon on the WYSIWYG toolbar.

1. Open a Content Type and go to the Body field or any field with a WYSIWYG toolbar.
2. Enter and select the text you want to display as a link and click on the Link icon on the WYSIWYG toolbar.
3. Select URL from the list and enter the URL for the external site.

   

4. To edit the URL just double-click on the link and the dialog appears again.
5. A recommended web practice would be to set the external link to open in a new tab/window. You can do this by clicking the Target tab and then select New Window (_blank) from the pull down menu and click OK.
   

Creating a link to a page within your site

To create a link to a page within your site, use the   Link icon on the WYSIWYG toolbar.

1. Open a Content Type and go to the Body field or any field with a WYSIWYG toolbar.
2. Enter and select the text you want to display as a link and click on the Link icon on the WYSIWYG toolbar.
3. Select Internal Path from the list in the Link Type drop-down.
4. Enter the first few letters of the page within your site. A listing of all the pages within your site are listed. Choose the one that you want to link.
    
5. Click on the OK button. The link displays with the name of the page you have chosen. 

Creating an email link

You can create a link that opens up an email client such as Outlook express with the email and subject in the email. Use the   Link icon on the WYSIWYG toolbar.

1. Open a Content Type and go to the Body field or any field with a WYSIWYG toolbar.
2. Enter and select the text you want to display as a link and click on the Link icon on the WYSIWYG toolbar.
3. Select E-mail from the list in the Link Type drop-down.
4. Enter the email address and subject in the appropriate fields.
   
5. Click on the OK button. The link displays with the name of the page you have chosen.

Creating a link to a location on a current page (anchors)

There may be times when you want to create a link at the top of a page that points to a location in a lower portion of the page. If this is the case, you can use anchors to create the links necessary to allow visitors to jump to a specific place on a web page. This is a two part process:

1) Create the anchor

1. Place your cursor in the location where you want the anchor and on the click on the   Anchor icon on the WYSIWYG toolbar.
   
2. Enter the Anchor Name and click OK. The Anchor icon shows up where you had your cursor, see below.
   

2) Create the link to the anchor

1. Select the text you want to use as the anchor link and click on the  Link icon in the WYSIWYG toolbar.

   

2. Select Link to anchor in text from the Link Type drop-down, then choose the anchor name and click OK.
3. The text selected displays as a link. Clicking on the link goes to the anchor location on the page.

Add Links to Images

You can easily add a link to an image in the following way:

• Insert the picture to the body area of your text using these instructions: Add embedded images. 

Once the image is embedded and positioned on the page: 

1. Click on the image so that it is selected. 
2. Click on the Link icon in the WYSIWYG toolbar. 
3. Add the link using the instructions above for internal and external pages Add links
4. To link to a file that was uploaded, use these instructions Upload a file.

Comments are useful for many part of your site whether you are soliciting feedback or engaging other visitors in conversation. The reason for using comments is not as important as how you use comments. You must manage who is allowed to comment and monitor those comments to prevented unwanted or uncomplimentary comments.

Managing comments

Comments can be enabled for any Content Type. If you do allow comments, it is recommended that you monitor comments prior the posts being available on your web site. By default, the Comments module is enabled, and permissions for all roles is set to allow all roles to post comments without approval.

1. Select People > Permissions from the Administration toolbar.
2. Scroll down and locate the Comments module.
3. It is recommended that you uncheck the Skip comment approval checkbox in order to ensure comments are reviewed before they are available on your site.
4. Scroll down and save your changes.

Enabling/Disabling comments on an individual page or content type

All Content Types allow you to enable to comments on your pages. When you create a Content Type, the comment settings are set to Read/Write by default. Unless you want all site visitors to be able to comment on your pages, you must disable this feature in the Content Type.

Important Note: If your site allows multiple authors and/or site visitors to comment on your site, it is recommended you put a disclaimer statement to the effect that the opinions expressed are not necessarily those of the organization/department hosting the site. Additionally, the group hosting site must regularly review or moderate content and provide ways for people to report inappropriate posts. It is recommended that each organization/department provide a statement from that content will be removed at the discretion of the organization/department.

Images are a great way to add interest to your site and help convey the message of your department or organizational mission and goals. However, there are lots of questions that come up when adding images including

• Where do I find images of Yale?
• How do I prepare images for the web?
• What types of images should I use?
• Can I use any photo I find on the web? How do I handle copyrights?

Images of Yale

There are many options to find images of Yale that are free and available for use, providing they promote a department, organizational or institutional purpose.

• Yale Office of Public Affairs and Communications - campus images
• School of Medicine, Web Team - medical images
• Yale Flickr

Guide to Working with Images

Once you find the images, you need to be able to manipulate them so they work in your site. The Choosing and Preparing Images For Your Site is a handy guide to help get the right images in the right place.

Regarding Copyrights

The most frequently asked question about imagery and websites is “Can I use this photo I found on Google?” In short the answer is NO; that is unless you have permission. Many of the images found on Google or anywhere throughout the web are copyrighted and therefore cannot be used without risk of legal action resulting in heaving fines. Therefore, unless you have explicit written permission to use an image from the photographer, you should NOT use that image. 

You can embed a video stream from a 3rd party vendor (Vimeo or YouTube) to display in the body of the page you are creating.

1. Locate the video you want to embed on your page at youtube.com or vimeo.com.
   • Vimeo - Locate the video and click on the Share link. Then click on Embed and grab the embed code.
     

     <iframe width="560" height="315" 
     src="http://www.youtube.com/embed/QoL1MMAZ0v8" 
     frameborder="0" allowfullscreen></iframe>

   • Youtube - Locate the video and click on the Share link. Then click on Embed and grab the embed code.
     

     <iframe width="560" height="315" 
     src="http://www.youtube.com/embed/QoL1MMAZ0v8" 
     frameborder="0" allowfullscreen></iframe>

2. Click on the Embed Video icon  in the WYSIWYG toolbar and paste the embed code where you want the video to display.

Tables can be used when tabular data needs to be placed within a page. The Table icon on the WYSIWYG toolbar is used to add tables to the content on your page. 

Important Note: Tables should only be used when you have data that needs to be stored in tabular form. CSS, not tables, should be used for layout purposes.

1. To start click on the Table icon on the toolbar and the Table Properties dialog window displays:
   
2. Adjust the settings to display the number of columns, rows, etc. These settings can also be changed after the table is created.
3. Click on the OK button and your table displays on the page where you can add content directly to the cells.
4. If you want to add columns or rows, you can right click on the table to display the menus that are available for that specific function.
   
    

You might want to create a link within your page that opens a file or image (.png, .xls, .ppt, .pdf, .doc, etc.) You can do this using the Link icon on the WYSIWYG toolbar.

1. Open a content type and go to the Body field or any field with a WYSIWYG toolbar.
2. Enter and select the text you want to display as a link and click on the Link icon on the WYSIWYG toolbar. 

   

3. Select URL as the Link Type and click on the Browse Server button.
   
4. Notice the Files folder displays in the left pane and any file that already exists displays in the right pane.
   • If the file you want to use as a link already exists, just double-click on the icon and the dialog closes and the text selected displays as a link to the file.
   • If the file is not available in the list, click on the Upload icon and navigate to the file(s) you want to upload. 
   • Double-click on the icon to upload it to the file list on your website, then double-click on the file to insert the link to the file in your text.
   • If you want to upload multiple files, then just select multiple files from your desktop or local directory and click on the Open icon. 

Uploading an Updated File with the Same Name

If the file you have uploaded a file and it has been updated, uploading it again can cause problems because the CKEditor automatically appends (1) to the filename of the recently uploaded file. To avoid this, we recommend deleting the file first, then uploading the updated file with the new name.

1. In the CKFinder dialog displayed in step #3, click on the file you want to update and press the Delete key on your keyboard.
2. Then repeat the steps above to upload the file.

When you create a page, your page is published by default which means it can be seen by everyone. If you do not want people to see the page, you can unpublish it by un-checking the Published check-box.

Important Note: Promoted to the front page and Sticky at the top of lists are options used in Views and discuss further in the section.