This video is all about how to implement the Bootstrap 5 Image Carousel with Hugo. I cover accessing page resource images, iterating over them, and how to resize all of the images so that they are the same aspect ratio for the Carousel.
You can use your own project, or use mine via the links below.
Watch my full length Hugo courses on skillshare here: https://www.skillshare.com/r/user/sean_emerson?gr_tch_ref=on&gr_trp=off
You get 1 month free, to watch my courses using my referral link.
Full length HUGO and Bootstrap 5 intro course
https://skl.sh/3rsfq4y
Full length SASS/SCSS building with Hugo Course
https://skl.sh/3IKdWc2
Full length JavaScript building with Hugo Course
https://skl.sh/3uHZcEz
SEO and asset optimisation with Hugo Course
https://skl.sh/3rthbOo
Looking for the best value for money travel insurance that suits both travellers and digital nomads? Covid-19 coverage included! Use my link to support this channel.
https://safetywing.com/nomad-insurance?referenceID=24741702&utm_source=24741702&utm_medium=Ambassador
Like the video? Buy me a cofee!!
https://www.buymeacoffee.com/futureweb
Code to get started
https://github.com/future-wd/video-hugo-bootstrap-carousel/tree/start_here
Code of completed video
https://github.com/future-wd/video-hugo-bootstrap-carousel
Docs:
https://getbootstrap.com/docs/5.1/components/carousel/
https://gohugo.io/templates/introduction/#example-3-declaring-variable-names-for-an-array-elements-index-_and_-value
VIDEO - Installing Hugo on windows https://youtu.be/l7PHRA8t4Bw
PLAYLIST - My other HUGO videos https://www.youtube.com/watch?v=sX1_R11wuxk&list=PLE92IfveVXuXTOjdPM_nleN6Cga_d3uJ-
0:00 - Introduction
#hugo #website #staticsite #staticsitegenerator #jamstack