• <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1961_middle_school_pe.rev.1469139550.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="882"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3206_morgan_4th_art_2018.rev.1531158337.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="740"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4196_IMG_2933.rev.1689895497.JPG" alt="2023 Closing Ceremony" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/4196_IMG_2933.rev.1689895497.JPG 2x" data-max-w="2584" data-max-h="983"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4171_SB_SFSchool_courtyardlunch_I_42050V.2.rev.1689888929.jpg" alt="Courtyard lunch" width="1200" height="410" class="featurePhoto" data-max-w="2393" data-max-h="1286"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1947_art_5th_grade.rev.1469051460.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="867"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3944_IMG_9973.rev.1656451801.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3944_IMG_9973.rev.1656451801.JPG 2x" data-max-w="3200" data-max-h="1196"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3936_IMG_0868.rev.1656450103.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3936_IMG_0868.rev.1656450103.JPG 2x" data-max-w="3200" data-max-h="1645"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4190__DSC1803.rev.1689893249.jpg" alt="painting scenery" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/4190__DSC1803.rev.1689893249.jpg 2x" data-max-w="3200" data-max-h="1298"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4063_SFS_220915__1599.rev.1668019617.jpg" alt="5th grade" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/4063_SFS_220915__1599.rev.1668019617.jpg 2x" data-max-w="3200" data-max-h="2133"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3953_IMG_8083.rev.1656527368.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3953_IMG_8083.rev.1656527368.JPG 2x" data-max-w="3200" data-max-h="1388"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1979_grandparents_day_2016_07.rev.1469228349.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="812"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1980_grandparents_day_2016_08.rev.1469229951.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="895"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3247_web-ms-graduation-boys.rev.1535057974.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="683"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1942_fourth_grade_tech_2_3.rev.1469035437.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="1077"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3658_Web-FOF-1.rev.1611969782.jpg" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3658_Web-FOF-1.rev.1611969782.jpg 2x" data-max-w="3000" data-max-h="1000"/></div>

Accordions

Accordions allow you to display multiple sections of content in a concise layout. It makes each section easy to find without scrolling down a long page of text. Follow these steps to add an accordion to your page:

1. Edit page and click on the table button. Insert a table with up to 10 rows and only one column. Each section in the accordion needs two rows. You can always add more later. 

2. Once you’ve inserted your table, select the table (if you’ve just inserted it, it should already be selected). Go to the Formats menu and select Accordion.

3. Add titles and content to your accordion by clicking on each row.

4. To add more rows, right click on any row in the accordion and select insert row after or before.
Please add two rows at a time, otherwise the styling breaks (one row is for the section title, one row is for the content).

5. After saving, your accordion will display with all sections closed. You can click on each section to open it.