• <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4181_SB_SFSchool_playback_I__32V.2.rev.1689891226.jpg" alt="North Yard" width="1200" height="410" class="featurePhoto" data-max-w="2388" data-max-h="1201"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1977_grandparents_day_2016_05.rev.1469225708.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="818"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3935_IMG_9526.rev.1656449878.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3935_IMG_9526.rev.1656449878.JPG 2x" data-max-w="3200" data-max-h="1396"/></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/3923_SFS_210923_1988.rev.1656445786.jpg" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3923_SFS_210923_1988.rev.1656445786.jpg 2x" data-max-w="3200" data-max-h="1251"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/498_portola.rev.1439239167.jpg" alt="A mural designed and guided by a parent at our School Work Day in Spring 2015 around the corner from campus." 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/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>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/765_dsc05394_copy.rev.1438991983.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="512"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3958_IMG_1398.rev.1656529148.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3958_IMG_1398.rev.1656529148.JPG 2x" data-max-w="3200" data-max-h="1358"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3945_IMG_0532.rev.1656452092.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3945_IMG_0532.rev.1656452092.JPG 2x" data-max-w="3200" data-max-h="1390"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4174_SB_SFSchool_kinder_I_42079.rev.1689889641.jpg" alt="K Lunch" width="1200" height="410" class="featurePhoto" data-max-w="2388" data-max-h="1179"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/3960_IMG_8925_1.rev.1656529357.JPG" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/3960_IMG_8925_1.rev.1656529357.JPG 2x" data-max-w="3200" data-max-h="1382"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/1967_anniversary_steve.rev.1469222091.jpg" alt="" width="1200" height="410" class="featurePhoto" data-max-w="2048" data-max-h="901"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4140_SFS_220915__5345.rev.1672960964.jpg" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/4140_SFS_220915__5345.rev.1672960964.jpg 2x" data-max-w="3200" data-max-h="1221"/></div>
  • <div class="intro-image fullscr-image"><img src="/live/image/gid/4/width/1200/height/410/crop/1/4135_SFS_220915__5025.rev.1672960246.jpg" alt="" width="1200" height="410" class="featurePhoto" srcset="/live/image/scale/2x/gid/4/width/1200/height/410/crop/1/4135_SFS_220915__5025.rev.1672960246.jpg 2x" data-max-w="3200" data-max-h="1332"/></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.