Getting Started with Bootstrap 5 using Radix in Drupal 10 (2024)
NOTE: This video uses Radix:5.x
Learn how to download and create a Radix sub-theme (Bootstrap 5) and create many components.
GitHub repo: https://github.com/WebWash/radix_boot...
Blog post: https://www.webwash.net/getting-start...
Table of contents
00:00 - Intro
02:59 - What we'll build
04:21 - Download Radix
04:52 - Download Components
05:34 - Enable Radix and Components
06:13 - Create Radix sub-theme
08:11 - Install sub-theme
09:24 - Compile Bootstrap
13:58 - Configure Block
17:09 - Understanding Components in Radix
22:51 - Implement Bootswatch
24:03 - Copy over _variables.scss file
24:47 - Copy over _bootswatch.scss file
26:48 - Turn on twig debug
28:04 - Override navbar
37:47 - Bootstrap Carousel
40:35 - Create Carousel block type
41:04 - Download Paragraphs
41:50 - Create Carousel item paragraph type
42:11 - Carousel item paragraph fields
45:37 - Create carousel block
47:54 - Configure Preview view mode on carousel item
50:04 - Add carousel block to frontend
51:51 - Create carousel.twig file
55:00 - Override block template for carousel
1:04:31 - Modify the carousel.twig
1:07:25 - Download and Install Twig Tweak
1:12:39 - Override paragraph carousel item template
1:15:27 - Add paragraph twig code for carousel item
1:21:30 - Install Layout Builder
1:21:46 - Enable Layout Builder on Basic Page
1:26:18 - Download and Install Layout Builder Iframe Modal
1:30:28 - Create test carousel page
1:30:38 - Create carousel on page
1:32:34 - Override inline block template
1:34:29 - Bootstrap Accordion
1:35:07 - Create accordion item paragraph type
1:35:51 - Create accordion paragraph type
1:37:03 - Create accordion test page
1:38:18 - Add paragraph field into page
1:39:32 - Override accordion paragraph template
1:45:29 - Download and install Devel
1:46:17 - Generate Test Content
1:46:56 - Create Latest Articles view
1:49:15 - Implement Bootstrap Grids in Views
1:49:54 - Create "Homepage" page
1:51:26 - Create custom image style
1:52:54 - Adjust grid settings
1:55:25 - Radix Layouts
Subscribe to our newsletter for updates: https://www.webwash.net/newsletter
Connect with us:
https://www.webwash.net/
/ webwashnet
/ webwashnet
/ webwashnet
/ webwashnet
/ webwash
/ webwash
#drupal #bootstrap
Watch video Getting Started with Bootstrap 5 using Radix in Drupal 10 (2024) online without registration, duration hours minute second in high quality. This video was added by user WebWash 01 January 1970, don't forget to share it with your friends and acquaintances, it has been viewed on our site 9,195 once and liked it 142 people.