Playback starts YouTube’s embedded player (privacy-enhanced mode).
How to do More with Google Sites and use Advanced embed features!
ChannelFlipped Classroom TutorialsDescription from the creator
Do more with Google Sites and become a power user today! Embed slideshows or carousels, Cards, Foldables, collapsible and many more features today with these tips and tricks! This video is a full tutorial of how you can do it!
Impress your students, coworkers and friends with a sleak design and professional looking Google Sites. No longer does the limitation of Google Sites have to mean a basic website. Click on the timestamps 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
Links used in the Video
Demo Website with links and code: sites.google.com/view/slideshowdemoflipped/home
W3 Website with Bootstrap examples: w3schools.com/bootstrap/default.asp
Androidify to create the avatar: androidify.com/
Great images, Creative Commons 0: pexels.com/
My Google Sites Playlist with more tips and tricks:
youtube.com/watch?v=Aflbbvw25xA&list=PLwXXO…
🔴 Don't forget to SUBSCRIBE today for more videos!
bit.ly/FlippedYT
🔴 AFFILIATE LINKS:
How I make my videos: Techsmith Camtasia and Snagit : bit.ly/FlippedTechsmith
Looking for a Host? www.bluehost.com/track/flippedclassroom/
✅ SUPPORT THE CHANNEL BY SHOPPING ON AMAZON:
amazon.com/?tag=flippedyt-20
✅ OR CHECK out MY PRE-SELECTED list of my ALL-TIME Favourite EDTECH TOOLS:
amazon.com/shop/flippedclassroomtutorials
🔴 Find me on SOCIAL MEDIA:
My Official EduFlip Website: eduflip.net
Follow me on Twitter: twitter.com/sdcthailand
Find me on Facebook: bit.ly/FlippedFacebook
And on Google Plus: bit.ly/FlippedGooglePlus
🔴 get CLASSROOM RESOURCES today:
My TPT Store: teacherspayteachers.com/Store/Eduflip
My Educents Store: educents.com/eduflip
Eduflip Resources: eduflip.net/p/free-resources.html
✅ Work with us:
training.eduflip.net
or SUPPORT THE CHANNEL through Patreon:
patreon.com/eduflip
Impress your students, coworkers and friends with a sleak design and professional looking Google Sites. No longer does the limitation of Google Sites have to mean a basic website. Click on the timestamps 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
Links used in the Video
Demo Website with links and code: sites.google.com/view/slideshowdemoflipped/home
W3 Website with Bootstrap examples: w3schools.com/bootstrap/default.asp
Androidify to create the avatar: androidify.com/
Great images, Creative Commons 0: pexels.com/
My Google Sites Playlist with more tips and tricks:
youtube.com/watch?v=Aflbbvw25xA&list=PLwXXO…
🔴 Don't forget to SUBSCRIBE today for more videos!
bit.ly/FlippedYT
🔴 AFFILIATE LINKS:
How I make my videos: Techsmith Camtasia and Snagit : bit.ly/FlippedTechsmith
Looking for a Host? www.bluehost.com/track/flippedclassroom/
✅ SUPPORT THE CHANNEL BY SHOPPING ON AMAZON:
amazon.com/?tag=flippedyt-20
✅ OR CHECK out MY PRE-SELECTED list of my ALL-TIME Favourite EDTECH TOOLS:
amazon.com/shop/flippedclassroomtutorials
🔴 Find me on SOCIAL MEDIA:
My Official EduFlip Website: eduflip.net
Follow me on Twitter: twitter.com/sdcthailand
Find me on Facebook: bit.ly/FlippedFacebook
And on Google Plus: bit.ly/FlippedGooglePlus
🔴 get CLASSROOM RESOURCES today:
My TPT Store: teacherspayteachers.com/Store/Eduflip
My Educents Store: educents.com/eduflip
Eduflip Resources: eduflip.net/p/free-resources.html
✅ Work with us:
training.eduflip.net
or SUPPORT THE CHANNEL through Patreon:
patreon.com/eduflip
About this tutorial
Flipped Classroom Tutorials published this 19:53 video tutorial on October 28, 2018. It has been watched 673,073 times on YouTube.
- Channel
- Flipped Classroom Tutorials
- Category
- Education
- Duration
- 19:53
- Published
- October 28, 2018
- Views
- 673,073
- Likes
- 11,343
Tags
Share
This tutorial in other languages
- FRComment faire plus avec Google Sites et utiliser les fonctions avancées intégré!
- ESCómo hacer más con Google Sites y el uso avanzado características incrustar!
- PTComo fazer mais com o Google Sites e Uso avançado incorporar características!
- ITCome fare di più con Google Sites e l'uso avanzato incorporare caratteristiche!
- DEWie man mehr mit Google Sites und Verwendung Erweiterte einbetten Funktionen zu tun!
- NLHoe kan ik meer met Google Sites en het gebruik Geavanceerde doen insluiten functies!
- RUКак сделать больше с Google Sites и использования Advanced встраивать функции!
- PLJak zrobić więcej z Witryn Google i korzystać z zaawansowanych osadzić funkcje!
- JA高度をGoogleサイトでもっとやると使用方法の機能を埋め込みます!
- ARكيف نفعل أكثر مع مواقع Google واستخدام ميزات متقدمة تضمين!
- HIकैसे Google साइटें और उपयोग उन्नत के साथ और अधिक करने के लिए सुविधाओं को आप एम्बेड!
- IDBagaimana melakukan lebih dengan Google Sites dan penggunaan lanjutan menanamkan fitur!