蘑菇TV

The hero images on each page are managed through the Properties page. You must check out a page for the properties option to be edited.

To make hero images display on desktop, tablet and mobile devices, you must create and upload three sizes so the display can react based on the viewer's device.

Hero images come in two sizes: 450 px or 250 px in height. High traffic pages work well with the 450px heros, while tactical or basic pages work well with the smaller 250px heros.

Large Hero Sizes:

450px high hero - 

Desktop = 1900px X 450px

Tablet = 900px X 200 px

Mobile = 600px X 125px

Small Hero Sizes:

250px high hero - 

Desktop = 1900px X 250px

Tablet = 900px X 200 px

Mobile = 600px X 125px

• The Website Graphics Size Cheat Sheet provides a quick reference for sizing graphics that prepare you to build or edit your website pages. 
• 蘑菇TV Design booklet - provides a broad overview of digital design standards, including colors and fonts.

Files, Documents and Pages Naming Conventions: 

Images should follow: imagedescription-dimensions.jpg

Hero images should follow:
Desktop: website-description-hero.jpg

Tablet: website-description-hero-tablet.jpg

Mobile: website-description-hero-mobile.jpg

Pages should use 'Pretty Urls', which is:

1. All lowercase
2. No special characters*
3. No acronymns**

*Dashes are allowed when it's a degree, ex. "psychology-bs"
**Acronymns may be excused when it's very well known, such as 'COE', 'COB, '蘑菇TV', etc.. MCHHS is not a good example!

---

The Quick Reference Guide provides guidelines and how-to info on using the website editing software..

 The Administrator Guide provides details for advanced users on how-to and system-level setup.

For images:
Use the

For image optimization: 

 Free alternatives to Photoshop:

Writing Tips:

Writing should have a PERM
Purpose, Engage, Reason, Motive 

For Making Documents ADA Compliant:

The icons below are examples of the available icons for use in the infographics snippets:

Anchors are places on a page that can be used to jump the user to a specific section.
An example is if there are 4 categories on one page, at the top 4 buttons can be placed where each cooresponding link jumps the user down to the anchors that were placed.

Placing an anchor

Select anywhere in the text with the cursor to set where the anchor will be placed.
Type a name like "myanchor", do not include the # in this text. Avoid using spaces and special characters.
Next, place a button at the top of the page and while still editing the text link, select the drop down where it says "Anchors".
Select your anchor and the "Link URL" field should populate your anchor in a format like "#myanchor".
The anchor can also be typed in manually by filling out the link URL using the #, "#myanchor".

Anchoring to accordions/tabs

Accordions and tab snippets come with an automatic anchor field which is generated from the title of the anchor.
To get the anchor of each accordion or tab, publish the page to webdev, then click to expand the accordion or open the tab you want to get the link for.
The accordion or tab will generate a url in your browser.
Copy the url field that follows the #. The text you will copy will look similar to this: "#myaccordiontitle"
Go back and edit your page, you can now place in the url field your anchor name.

Anchoring and jumping pages

If linking to an anchor on a different page, first link to the page you want.
The link URL should look like "{f:12345}". This is the dependency tag.
Add the designated anchor to the end of your dependency tag.

Example: "{f:12345}#myanchor"

Section Name

The section name is controlled in the _props.pcf file.

Publishing this file (_props.pcf) 飞辞苍鈥檛 update the value in the breadcrumb/nav title. Each individual page in the current folder needs to be published for the changes to reflect in any of the pages. Publishing the _nav.inc 飞辞苍鈥檛 work either.

Local Nav Items

The list items (links and text) within the Local Nav are controlled with the _nav.inc file.

Updating any list item within a _nav.inc file will reflect immediacy after publishing independent of the folder/hierarchy combination/position of the _nav.inc file in question.

NOTE: Deleting a page (.pcf file) or a folder won't automatically delete a items from the list. The item needs to be deleted manually. The same applies when updating/renaming.

Navigation Start

Navigation start indicates where the Local Nav list items should start from (i.e. from the current folder and deeper or from the Parent folder and deeper).

This is controlled by going to the Folder Access settings.

Note: by default, if left empty it will start from the Parent(s) folder and deeper.

After updating the folder Access settings navigation-start variable, each individual page in the current folder needs to be published in order for the changes to reflect.

Note: Remeber that if you raname the folder you have to rename this value to the new folder name.

Breadcrumb Start

Same as Navigation Start, just use the breadcrumb-start variable instead.