Uploaded February 2022 | Updated September 2026, 2 weeks ago
This is the 17th video in the statelesscode.com WordPress series. In this video Mike starts working on identifying the DOM structure of the WordPress widgets in the development environment so that he can apply the correct classes in the right places to style with Tailwind.
This video covers:
00:00:10 Introduction
00:00:55 Group sidebar widget headers and content together
00:01:58 Look at the HTML structure created by the grouped elements
00:04:55 Get the structure of the sidebar widgets into CSS structure
00:12:47 Fix yarn build failure and identify new section with ugly pink directive
00:20:23 Add a vertical margin to identify the widget sections
00:21:51 Apply a directive to the sidebar header
00:23:23 Apply directives to inner container
00:27:12 Troubleshoot variance in Recent Posts
This video is CC0 - No rights reserved. (YouTube doesn't allow this option when publishing.) All code is released under the UNLICENSE. Stateless Code denies the concept of "intellectual property". Copying is not stealing.
This is the 17th video in the statelesscode.com WordPress series. In this video Mike starts working on identifying the DOM structure of the WordPress widgets in the development environment so that he can apply the correct classes in the right places to style with Tailwind.
This video covers:
00:00:10 Introduction
00:00:55 Group sidebar widget headers and content together
00:01:58 Look at the HTML structure created by the grouped elements
00:04:55 Get the structure of the sidebar widgets into CSS structure
00:12:47 Fix yarn build failure and identify new section with ugly pink directive
00:20:23 Add a vertical margin to identify the widget sections
00:21:51 Apply a directive to the sidebar header
00:23:23 Apply directives to inner container
00:27:12 Troubleshoot variance in Recent Posts
This video is CC0 - No rights reserved. (YouTube doesn't allow this option when publishing.) All code is released under the UNLICENSE. Stateless Code denies the concept of "intellectual property". Copying is not stealing.
