- Reviewing Home Page Standards
- Customizing Tabs & Accordions
- JUST FOR FUN - ADDING VOICE-OVER CHARACTERS
(Note: Some pages differ slightly due to approved display changes/additions)
As we celebrate the 6th month anniversary of our Launch to Finalsite, it's a great time to review our Home Page Standards. This information can also be found in your Webmaster's Guidebook.
Home Page Panels
- Flyout Navigation Menus
- Slideshow Panel
Webmasters have access to edit the Quicklinks Flyout and the Slideshow panel. Prospective Families Flyout is managed by District Admin. The Slideshow panel can be comprised of images and videos. At least 1 image or video should be displayed, at all times. Use the drone shot of your building as a placeholder, if you do not have images. SINGLE images or videos can be added via the Edit Gear, from a Resources Folder. If you use more than 1 item, they need to be added to a Gallery Folder to be viewed as a SLIDESHOW.
It's recommended that all images and videos fall within the set standard size to keep consistency and the Flyout menus from falling off the masthead.
Image/Video Standard Size: 1440px x 640px
Note: Some sites have additional or changed flyouts, per approval.
Masthead copied from Hamilton Elementary site.
To add images and/or video:
- Click on the Edit Gear for the Masthead
- Create a Gallery, if using a grouping of images and/or videos. *Single items can be used, if placed in a Gallery Folder or from a Resource Folder.
- Browse for the Resource or Gallery.
- To add a Title, link or text, you'll open the Resource and add it to the Description field. To turn it on in the Masthead, expand the All settings and click the Description box and Display Resource selected to Title.
- To link a Calendar to display, click the Edit Element gear and select the calendar.
- Calendar event details (Time, Location , Summary, etc...) can be turned on/off per the Edit gear.
- TIP: If event descriptions appear too long, turn Truncate ON to "shorten" titles.
- The Troy District Calendar must be set to display during the summer on your school homepage, as most school calendars do not have events scheduled.
How to Build and Manage Calendars will be an upcoming Blogger topic - Stay Tuned!
Calendar copied from Boulan Park Middle School site.
News & Announcements (Posts)
- There are 18 image slots available for posts to display on the home page. These are accessed via arrows and/or dots that can be turned off/on in the Edit Element gear. Dots are added at the bottom of the panel and arrows on both sides of the "View All News" design sub-title link at the top of the panel. You must have at least 3 posts added to your page, at all times.
- Each Post is made up of the following elements:
- Title (Preview on the Hover-Over)
- Body copy (to be used for 1 paragraph or less)
- Summary (used if there is more than 1 paragraph of text)
- Publish Date ( Featured and Expire dates can also be set)
- Thumbnail Image (use the recommended image size so that images are not cut-off or appear distorted)
Image Size recommendations: 380px x 285px
News copied from Martell Elementary site.
Each Image/Video container in this section has been sized to fit and display a SINGLE resource of your choice. These containers are meant to provide a glimpse into your school and highlight weekly, monthly or yearly achievements or events.
Images/videos can be edited and added via the Edit Element Gear. Galleries of multiple resources (slideshows, etc) CANNOT be added. To view a gallery of resources, have your image link to a site page.
Although you have access as a page editor, DO NOT delete the video/image containers, replace the resources. Do not delete the Twitter feed from this section.
If you have mistakenly deleted element any homepage elements or Spotlight containers, please contact Melissa, for support.
TIP: Use the larger containers for video elements and the smaller ones for images.
The recommended image sizes, per container are listed below. Video should reduce correctly for the larger containers with some cut-off outside the container. Smaller containers will adjust and cut-off video, per the container size. Although these are suggested sizes, other sizes can be used in the containers. Images will adjust to the container size by cropping or stretching. It is not recommended using photos or videos above 385px in height, as it extends the Spotlight container beyond normal responsive viewer standards.
Image Size recommendations (Small containers): 325px x 285px
Image Size Recommendations (Larger containers) 525px x 285px
Spotlight copied from Larson Middle School site.
How to Link to a Panel/Tab Rather Than Entire Page
Note: This link will not work for Tabs or Accordion elements that are inside of other Tabs or Accordion elements. Only panels that are initially displayed on the page when it is loaded will respond to the anchor link.
Reminder: Page Load Speeds
Make sure you set your iframe to allow full screen, so you can change the size
Add a border by changing the 0 to a number (this number represents how many px = pixels wide the border will be)
Set your height and width (same as with border, this is represented in pixels)
You'll have to go to Voki to select your character and add a voice. Change the URL in the iframe below to embed your character or request an embed code to add.