Site Notes

This is a banner - you should manage the necessary content at the banner level NOT at the page level.

1. Most of the content you will want to update will be done at the branch level through a set of pages.

   1. The main navigation is created dynamically as you create pages

   2. Utility navigation (parents, students etc.) is managed through the header utility branch

      1.  the page names are what's showing in the footer. These pages will likely link to other pages within your main site navigation. If needed you can add content to them, with the understanding that through the footer would be the only way to get to them.

2. All other information is managed on the banner itself (the logo - the school name and where it links, etc)

   1. go to the appropriate header banner

   2. each item will be associated with an element within the banner. 

   3. Pro tips to edit link content - 

      1. To change the words on the page for a link, click the html toggle in the top left corner of the tool bar (</>) and change the information accordingly retaining the formatting around all items (text is in black, code is in color). 

      2. to alter where the links go, click back to the main view and right click on the link, select “edit link”

This is a resource element

1. In resources either add the images/videos you want to the existing gallery or create a new gallery of images or a video, using individual resources you have already uploaded into the system.

   1. photos should be cropped to (1600 x 700) before uploading them into Resources

2. Once uploaded, while still in resources, click each photo - edit the photo title and the photo description if you want to show either of those on the image or video itself

   1. PRO TIP, for compliance, you should also ALWAYS add an "alt tag" to the photo

3. If adding photos to the already created gallery, once all photos are added and descriptions accurate, your work is done

   1. If creating a new gallery, Go into the element for the masthead on the homepage and click the settings

   2. Select the gallery within Resources you want to point to

4. This should be the only change you make to this element. Anything else will break it.

1. These are managed by the pages within the CTA branch

2. The page names are what's showing as the button content/title. These pages will likely link to other pages within your main site navigation. If needed you can add content to these actual pages, with the understanding that this would be the only way to get to them and that they would need to have all the appropriate banners and theme applied.

This is a container with content elements in it. The content elements are all managed the same.

Panel Title and Subtext

1. Click the settings of the container.

   1. The title of the container is the title of the panel. 

   2. Under the Design+ accordion in the header area is where you add sub text if you have it. 

Image Buttons

1. Click on the settings

   1. The title is the title of the element

   2. Under the Design+ accordion browse to the image you want to show

   3. In the footer content area add the link to what you want the button to say and where you want the button to lead to on click

   4. click save

2. Click"edit content" to add the rest of the content you want to show (this is what you see on hover along with the title again and the button)

This is a container with a tab element in it. One panel of the tab is a post element for the news one panel of the tab is a calendar element for the calendar.

Panel Title

1. Click the settings of the container - the title of the container is the title of the panel

2. News Element

3. This is controlled via the post module

4. Create your posts within the post module ensure for the homepage you always use a thumb nail and a title (as this is what shows on the homepage) - if you want to add a summery you certainly can.

5. On the homepage itself, click the gear icon for the news element

6. Using the edit tools, select what board (single) or multiple board and tags you want to pull onto your homepage

7. There are a few other features you can alter on the homepage news

   1. Pop up details, as that doesn't effect the design of the homepage layout

   2. Under format drop down you may ONLY change the number of news items you are showing on the page and the thumbnail information for the pop up

8. Under the design drop down you can change where the view all news button goes to (this needs to be a page set up within composer allowing the user to view more than just the handful of news posts you are showing on the homepage.

9. ONLY CHANGE THOSE ITEMS INDICATED ABOVE - ANYTHING ELSE WILL BREAK THE ELEMENT

Calendar Element

1. Click the gear icon for the element

2. ONLY CHANGE under General Settings

   1. The calendar (s) which you are pulling from

   2. The number of items within a date range

   3. The date range (it is recommended for the homepage to set it to 0 days before and however many days you want after today's date)

   4. Where the more events link leads to through the design dropdown (single click on the link in the footer content area and select "edit")

   5. ANYTHING ELSE WILL BREAK THE ELEMENT

1. In the Element settings you can use the Title for the main title

2. The content section is the main text. Try to not put too much text in this area.

3. The link is put in the settings > + Design section to edit the content in the Footer content

This is a banner - you should manage the necessary content at the banner level NOT at the page level.

1. The links in the footer (sitemap, privacy policy etc) are managed within the footer utility branch - the page names are what's showing in the footer. These pages will likely link to other pages within your main site navigation. If needed you can add content to them, with the understanding that through the footer would be the only way to get to them.

2. You may add a few additional pages if necessary being mindful of space

Social Icons in the Footer

1. The social icons in the footer (facebook, twitter etc) are managed within the social media links branch.

2. You will need to change where each page is linked to (at the time of this the icons are just pointing to the main social channels). This is done the same way you link any page within Composer - just use your specific channel URL 

3. To turn OFF an icon that you don't have a social media presence in, go to the gear icon of the page within the social branch and "hide from navigation" this will maintain the icon for when you are ready to start using is

4. DO NOT DELETE THESE PAGES

To update the remaining footer information: 

1. go to the appropriate footer banner

2. each item will be associated with an element within the banner. 

3. Click edit content for each - 

   1. To change the words on the page for a link, click the html toggle in the top left corner of the tool bar (</>) and change the information accordingly retaining the formatting around all items (text is in black, code is in color). 

   2. to alter where the links go, click back to the main view and right click on the link, select “edit link”

1. Add the text for your blockquote, including optional citation, all on one line. Select the text. From the toolbar select the “ icon.

2. If a citation was included, now select the citation text and choose "citation" from the styles dropdown.

(must be done in this order):

1. Type your button text.

2. Select the text and click the "link" icon.

3. Type in your link, and in this same window, select the button class you want from the styles dropdown. You have the following options 

   1. button-small-1
   2. button-small-2
   3. button-small-3
   4. button-large-1
   5. button-large-2
   6. button-large-3
   7. button-on-dark
   8. button-download
   9. button-link

4. Click Save

Note: If you add a button a different way than listed above, the text may be hard to ready and the style might not look correct.

1. Add a content element

2. Click the gear icon for the element

3. Open the “design” dropdown and the appropriate custom class to the custom class field. You have several options

   1. callout-box-light

   2. callout-box-dark

   3. callout-box-school

      1. Images are optional and are added in the settings under the Design+ accordion under the "header" area

4. Hit save

5. Click “edit content” in the main content area

6. Add the content you want into the content area

7. To create a title, add the content and style it as an h2 using the paragraph format icon in your toolbar

8. Click save (and publish)

** I find a nice size to be 800 x 400

1. Create the table using Insert Table from the menu tool bar.

2. From the table Properties, add the rows and columns you need

3. This is where you also determine how the content within the tables is aligned AS WELL AS whether your table has a styled header and what cell to apply that to (typically it's the first row)

   1. Pro-Tip: By default the cell has a 1 pxl border and a 500 pxl width. To get it to look like your approved design, set border to 0 and width to 100%

4. Once you have that set, in the same set of table property tools, select from the class drop down Table Styled

5. Click Save (and add your table cell content)

6. At any time, you can right click on the table after you have created it to adjust rows, cells, and columns - for example this is where you would adjust the settings to make each cell the same size, or if you wanted to add a row etc.

1. Add a content element to the page

2. Add the content you want to apply the call out style to

3. Highlight the content

4. From the toolbar, select the “call out” from the Styles select box

Veggies es bonus vobis, proinde vos postulo essum magis kohlrabi welsh onion daikon amaranth tatsoi tomatillo melon azuki bean garlic. Gumbo beet greens corn soko endive gumbo gourd. Parsley shallot courgette tatsoi pea sprouts fava bean collard greens dandelion okra wakame tomato. Dandelion cucumber earthnut pea peanut soko zucchini. Turnip greens yarrow ricebean rutabaga endive cauliflower sea lettuce

This is a resource element (add - set to a slideshow - where necessary).

1. To add it to a landing page, click "add element" on the landing page, 

2. Select the shared tab

3. Selected the Landing Page Hero  element

4. Once on the page, click the "shared" setting and edit and orphan

5. Now you should only need to change what image you are pointing to (change to - what gallery it points to - where necessary)

Photos should be cropped to 1440x600 before uploading them into Resources. You can have the width larger to account for larger screen sizes but the height should not exceed 600px.