Looking to do more with Google Sites? You’ve come to the right place. With a few tips and tricks, you can embed slideshows or carousels, cards, foldables, collapsible and access many more features you previously didn’t think Google Sites can do.
This video is full of goodies that might overwhelm some so I’ve made a timestamp for you to find relevant sessions of the video.
Timestamps of the Tutorial:
0:13 Introducing the Examples
1:30 Create a blank Google Sites
2:30 Overview of W3 Schools and Bootstrap
3:12 Create a new Page on Google Sites
3:25 Animated Headers for Google Sites
4:14 Adding a slideshow or Carousel to Google Sites
6:42 Indicators for the Slideshow
6:57 Insert your own images for the slideshow
7:30 Find royalty free or CC0 Photos to use.
8:13 Sharing settings of your images on Drive
8:50 Change the URL to create a hosted Image
10:46 Navigation buttons for the Slideshow
11:10 Insert the slideshow onto Google Sites
12:30 Insert a collapsible or fold effect
13:50 Tweak the collapsible code
14:15 Insert the fold/collapsible onto a Google Sites
15:13 Create Custom Cards
16:15 Change the font of the card
16:55 Material design styled shadow effect for the card
17:15 Hover over effect for the card
19:05 Review and thank you for watching
Demo website with links and code: https://sites.google.com/view/slideshowdemoflipped/home
CLASSROOM INTEGRATION
With the tips and tricks, students would be able to present their content in a way that’s more animated, interactive and connected. This option might be more fitting for students in high school or college.