Main CCI Site

To see instructions for labs within your site, jump down to Lab Sites.


Templates

Reminder: The features for each template are all located in the "Template Variables" tab.

Homepage Template: template for Homepage ONLY

  1. Homepage template features are:
    • Background Image: ensure the image is high resolution and at least 1200px in width as well as a darker image is strongly recommended for legibility.
    • Featured Sections: add up to 3 featured sections which will display as it's own block.
  2. All global information ie. footer information is editable on the homepage ONLY. The global features are located in the "Template Variables" tab, under "Global Footer" category. The following information is editable:
    • Contact Information: manage up to 4 items.
    • Internal Resources: manage up to 4 items.

Subpage Template: template for all subpages.

  1. Subpage template features are:
    • Back to Top: show/hide the back to top button at the bottom of your page
    • Featured Sections: add up to 3 featured sections below the main content on your page.
    • Photo Gallery: include a photo gallery on your page with up to 30 images. To see an example, the Media page uses the photo gallery.
    • Sidebar Sections: add up to 3 sidebar sections to the right of your main content.

Lab templates: see details about the Lab templates.


SEO: Google Analytics, Site Description & Keywords

Google analytics code, site description and keywords are included under Extras in Configurations at the top menu. Feel free to update the information as needed.

If you want your meta descriptions to be page specific, you can edit the "Description" field in the resources options. However, if the "Description" field is empty, the overall site description will take precedence.

If you do not have Google Analytics and wish to install it on your site, please view these instructions.


Navigation

Note: Do not add new navigations items as there is limited space in the horizontal orientation of the navigation.

User Navigation

The pages under User Navigation are Patients and Researchers display in the "For" section of the horizontal navigation.
To add a new laboratory under Researchers, please contact PMACS Web Team.

Main Navigation

The pages under Main Navigation display after the "For" navigation items under User Navigation.


Images

To ensure that your images are the appropriate height and width, use the free cropping tool Pixlr.

Homepage Banner Image

Ensure the image is at least 1200 pixels wide and is overall a darker image so the content readability is not affected.

Images in Content Area

Upload image to appropriate folder (documents, images, secure) within the correct User Media Files folder located in the File tab. If the file belongs to a lab, ensure the file is uploaded to the User Media Files - Lab specific directory.

Ensure the 'Image Properties' settings on all images ...


Files and Documents

Ensure all files are uploaded to the appropriate directory.

The following directories should NOT BE MOVED OR REARRANGED:

All files that are not included in the appropriate directory may not link properly. Be careful not to move the secure directory, as the files within it may no longer be Pennkey-protected.

DO NOT create new directories on the top level where document, images, and secure directories are located under User Media Files.



Secure Documents/Web Pages

You can PennKey protect a document by uploading it to the "secure" folder located under files, inside of the "User Media Files" folder. You would then link to the secure document in one of your web pages.

If you want to PennKey secure a web page, add "secure/" (without quotes) before the name in the alias form field when editing the page


Forms

Please contact PMACS Web Team to add a new MachForm to your site.


RSS Feeds

The Media Links Archive page is currently displaying your custom feed (http://feeds.delicious.com/v2/rss/pennmedcomms/TRP) set up by Penn Medicine. To change this feed, please contact PMACS Web Team.


Calendar

The calendar is currently linked to the CCI EVENTS iCal.

Feel free to edit this link located in the Template Variable tab on the "Home" resource.

Please contact PMACS Web Team if you are interested in setting up an account with the PSOM Calendar.


Directory

The directory page is included on every page, in the Global Footer. To update the link to a file, ensure the file path starts with: assets/user-content/document/filename.xslx
Make sure to replace the filename.xslx with the correct file name.


Image Galleries

The image gallery feature are specific to the Subpage Template and are located in the Template Variables tab.

Photo Gallery

Add up to 30 images of photos on your page in a grid. There is the option include a section title, link your images, and include captions for your image.
The following pages include a photo gallery:

Page NameDescription
Corporate PartnersCorporate partner logos linked to external websites
Media LinksMedia images linked to external websites

Videos

Using the toolbar, you can include a youtube video or a vimeo video.

Youtube

Vimeo


User Styles

Remove format on content using the Tx icon

Ensure you clear all styles when you copy and paste from a different program (Word, plain text, web page, etc). When copy/pasting content, make sure to highlight everything and click 'Remove Format' (The italic T with the small x). You can also use the clipboard options.

Styles dropdown options

User Styles are found in the toolbar above the content area. Locate the 'Styles' dropdown and select style.

Content type Style name Style Description
Image 'Thumbnail List' Styles image as thumbnails with captions. Create a bullet list of images with or without captions. Select the list of images, click the Styles dropdown and select 'Thumbnail List' to apply style. See the Patients page as an example.

Including special characters

For quotation marks or other special characters, select 'Insert Special Characters' found in the top row of the toolbar. Make sure your cursor is clicked in the content area to select a character and include.


Links

Linking to a page within CCI

There are 2 ways to link text to a page within your site. You can drag and drop to link or use the Link tool in the toolbar.

Drag and drop to link

This method of linking only works in main content area under the Document tab. It does not work in text areas in the Template Variables tab.

  1. Enter and highlight the text you would like to link in the content area
  2. Click on the Resources tab on the tree (left-hand side).
  3. Select the page you want to link to and drag it over the highlighted text in the content area

Link tool

  1. Click the link icon from the menu
  2. Set Link Type: UR
  3. Protocol: >other>
  4. Enter the following code in URL (replacing # with page ID number): [[~#]]
  5. Click OK.
  6. Save.

Link to a document/file

Making email addresses hyperlinks

  1. Enter the email address into the content area.
  2. Select the email address you just entered and click the link icon from the menu.
  3. Within the "Link Info" tab:
    • Choose "Email" from the "Link Type" drop down menu.
    • Enter the email address in the "Email Address" field.
    • Click OK.
    • Save.

Making phone numbers hyperlinks

  1. Enter the phone number into the content area.
  2. Select the phone number you just entered and click the link icon from the menu.
  3. Within the "Link Info" tab:
    • Choose "URL" from the "Link Type" drop down menu.
    • Choose "Other" from the "Protocol" drop down menu.
    • Enter the phone number in the URL field in the following format: tel:+1-555-555-5555
    • Click OK.
    • Save.

Laboratory Sites

To add a new laboratory to your site, contact PMACS Web Team.

Laboratory Templates

  1. Lab Homepage Template: template for Lab Homepage ONLY.
    Features on the Homepage are all located in the "Template Variables" tab. The features are:
    • Back to Top: show/hide the back to top button at the bottom of your page
    • Featured Image: choose an image to represent your lab on the main researchers page of CCI.
    • Featured Sections: add up to 3 featured sections below the main content on your page.
    • Lab Navigation: include up to 5 navigation items: Research, Publications, Media, Donate, Opportunities.
    • Sidebar Sections: add up to 3 sidebar sections to the right of your main content.
  2. Lab Subpage Template: template for all subpages in a lab.
    Features for the subpage template is located in the "Template Variables" tab. The features are:
    • Back to Top: show/hide the back to top button at the bottom of your page
    • Featured Sections: add up to 3 featured sections below the main content on your page.
    • Sidebar Sections: add up to 3 sidebar sections to the right of your main content.

All files that belong to the lab should be uploaded appropriately to the lab file system.

Please contact PMACS Web Team to add a new laboratory to your site.


Instructions on Creating a New Subpage for a Lab

  1. Click on the sign to create a new page for a lab.
  2. Fill out the following fields in the Document tab:
    • Title: title of the page
    • Uses Template: Lab Subpage Template
    • (Optional) Long Title: if page title is different than Title, enter here
    • Resource Alias: give a short descriptive name for the URL eg. publications would render publications.html
    • Publish checkbox: check if ready to publish page
  3. Add content to page and add features as needed (located in Template Variables).
  4. Update Lab Navigation if new page is one of the following: Research, Publications, Media, Opportunities or Donate.
    This navigation is set on the lab homepage only in the Template Variables tab.

Lab Navigation

To add/edit the navigation to the lab, go to the Home page of the lab (that uses the Lab Homepage Template). Follow the instructions below:

  1. In the Template Variables tab on the Home page, locate the category 'Lab Navigation.'
  2. Click 'Add Item' to add a new item to the navigation OR
    Right-click on the navigation to edit or remove a navigation item

There are standard navigation items preset for each lab. They are as follows:

To request a new navigation item, please contact PMACS Web Team.


Weblinks within Lab Sites

When linking a page within the lab site to a page in a different section (marked with the globe icon ie. Website, June Lab, Milone Lab, etc), include the full URL path to the page you want to link to.
For example, the Media page within June Lab is a weblink that goes to the Media page in the main navigation. The 'weblink' textfield includes the URL for the media page: //www.med.upenn.edu/cci/media.html