It’s hectic and time-consuming when it comes to making something that takes a long time. Yes, we are talking about CSS stylesheets. It’s not easy to design a website because it’s not ‘effortless’. 

In this blog, we will talk about the Integration of Drupal and Tailwood CSS to make this process a little bit easier for you. 

A brief About Tailwind CSS

Tailwind CSS adopts a utility-first approach rather than building a class for the component. Tailwind CSS is a utility-first approach that makes creating applications faster and easier

Tailwind CSS offers limited benefits but assures you the flexibility and power to create your unique site. 

Today we are talking about DIY Site Builders, what are the benefits over Drupal (If Any), and When using Drupal makes sense with guest Ivan Stegic. We’ll also cover Drupal 11 as our module of the week.

For show notes visit: www.talkingDrupal.com/463

Topics

• What is a DIY site builder
• Does TEN7 use DIY site builders
• How are DIY site builders better than Drupal
• Are they less expensive than Drupal
• HAve you ever suggested a site builder to a client
• What does a migration from a site builder look like
• Do you think starshot will make Drupal competitive with site builders

Resources

• Workspaces Extra
• Talking Drupal 451 - Just say Drupal
• Shopify
• Webflow
• Wix
• Squarespace
• Wordpress vip
• Cosmic.build
• Preshow:
  • Eurion constellation

Guests

Ivan Stegic - ten7.com ivanstegic

Hosts

Nic Laflin - nLighteneddevelopment.com nicxvan John Picozzi - epam.com johnpicozzi Josh Miller - joshmiller

MOTW Correspondent

Martin Anderson-Clutz - mandclu.com mandclu

• Brief description:
  • Have you been wanting a version of Drupal that can use Workspaces, Recipes, and Single Directory Components, while running all the latest versions of its underlying technologies? Drupal 11 is all of that and more
• Module name/project name:
  • Drupal 11
• Brief history
  • How old: created on Aug 2 by catch of Tag1 and Third & Grove
• Module features and usage
  • Limited additions vs 10.3: by design to make the transition easier
    • Mostly in the recipes API, e.g. new config actions
  • Recap of new features vs. 10.0
    • Workspaces
    • Revisions and workflow are possible in the UI for Blocks and Taxonomy Terms
    • UI updates for creating and reusing fields, as well as bulk content operations
    • New Access Policy API and Single Directory Components
    • New Navigation and Announcements Feed modules
  • Contrib support out of the gate: about ⅔ of the top 200 modules already support Drupal 11
    • Adding modules that Rector estimates will only need info.yml or automated fixes brings us to over 80% of the top 200, or about 75% of all Drupal 10-compatible projects on Drupal.org
  • Updated dependencies: PHP 8.3, Symfony 7, CKEditor 5 42.0,2, Twig 3.9, Yarn 4, jQuery 4.0.0-beta, jQuery UI 1.14-beta.2 and more
  • Modules moved to contrib (smaller core):
    • Actions UI
    • Activity Tracker
    • Book
    • Forum
    • Statistics
    • Tour
  • Drupal 10 will receive maintenance support until mid-2026, so the community created this release of Drupal 11 early to give sites as much time as possible to make the transition, in this case almost 2 years!

<p class="dropcaps">The Drupal Starshot Initiative, introduced at DrupalCon Portland, is making significant strides in defining its direction and goals. Recently, <a href="https://www.thedroptimes.com/42164/drupal-announces-new-track-leads-starshot-project-advancement">the initiative announced the creation of "tracks"</a> to concentrate development efforts on specific areas. This approach is set to streamline progress and ensure that each aspect of the project receives the attention it needs.</p><p>The Drupal community's response has been robust, with nearly 65 submissions for leadership roles within these tracks. Leaders have been selected, drawing expertise from a diverse set of companies. However, three tracks are still in search of leadership, and the project remains focused on evolving through community-driven collaboration.</p><p>Our founder, Anoop John, <a href="https://youtu.be/aU2Hueh6i-s">conducted an interview</a> with Dries Butyaert at the beginning of July, which we <a href="https://www.thedroptimes.com/interview/41572/chief-who-drives-and-driven-drupal-talk-with-dries-buytaert">published on July 18</a>. In it, Dries, optimistic about the path the initiative is taking, said:&nbsp;</p><blockquote><p><em>"We have been working hard on the Starshot initiative, dedicating around six hours a day to it. We have made a lot of progress."</em></p></blockquote><p>and we are witnessing that enthusiasm spreading like wildfire in the community. As detailed in Dries Buytaert's <a href="https://www.thedroptimes.com/42132/drupal-starshot-new-strategy-marketers">blog post</a>, the Starshot Initiative—currently a temporary name—targets empowering marketers and expanding Drupal's market presence. Aimed at projects with budgets between $30,000 and $120,000 USD, the initiative focuses on ease of use, flexibility, smart defaults, and strong integrations, making Drupal a gold standard for marketers. Key features include AI-assisted tools, advanced content modeling, and efficient content reuse, all designed to help marketers scale their sites without being hindered by technical limitations.</p><p><span style="box-sizing:border-box;margin:0;padding:0;text-align:left;">The&nbsp;</span><a href="https://www.thedroptimes.com/42104/drupal-starshot-initiative-introduces-new-contribution-bonuses" target="_blank"><span style="box-sizing:border-box;margin:0;padding:0;text-align:left;">Drupal Starshot Initiative has introduced new contribution bonuses</span></a><span style="box-sizing:border-box;margin:0;padding:0;text-align:left;"> to encourage community involvement further</span>. These bonuses are designed to reward those who lead and contribute to the project, leveraging Drupal's powerful contribution credit system. This includes 10 credits per issue for contributions to specific Starshot modules, 50 credits per week for organizational pledges of dedicated team members, and 1 credit per $100 invested in the innovation fund, starting from a $5,000 minimum.</p><p>Looking ahead, the impact of Drupal 11 and the Starshot Initiative on web development is expected to be profound. Drupal 11 brings innovations such as improved APIs, a revamped admin interface, and enhanced performance, making it more powerful and user-friendly. Starshot builds on this by simplifying installation and configuration, making Drupal accessible even to newcomers.</p><p>As the community continues to work hard on Starshot, anticipation is building for more updates at DrupalCon Barcelona in September. Dries hinted that they hope to showcase real progress, from marketing efforts to the first implementation of "recipes," one of the key technical components of Starshot.</p><p>Now, let's explore what <em>The Drop Times</em> has been reporting on over the past week.</p><p><a href="https://www.thedroptimes.com/41622/which-cms-powers-top-us-university-websites-comprehensive-analysis">A comprehensive study by The Drop Times</a> reveals that 35.4% of U.S. universities prefer Drupal for its flexibility and robust community support. The study highlights Drupal's growing role in academic content management.</p><p><a href="https://www.thedroptimes.com/interview/42044/resurrected-with-resilience-dallas-ramsdens-drupal-legacy">In a conversation</a> with <em><strong>Elma John</strong></em>, a former sub-editor with <em>The DropTimes</em>, <a href="/people/32359/dreambubbler" data-entity-type="node" data-entity-uuid="20d35642-6e8c-4a72-baa3-e3000e862103" data-entity-substitution="canonical">Dallas Ramsden</a>, CEO of Xequals, shares his 16-year journey with Drupal, including surviving a life-threatening accident and transitioning to teaching. His story is one of resilience and dedication to the Drupal community.</p><p><strong>Alka Elizabeth</strong>, sub-editor at The Drop Times, <a href="https://www.thedroptimes.com/42015/closer-look-at-ffws-transition-jakala">reports on JAKALA, a leading data and AI company, acquiring digital experience solutions provider FFW.</a> This deal, the largest non-public digital agency acquisition in Europe for 2023, significantly expands JAKALA's global workforce and market position.</p><p>The Drupal Association has introduced the <a href="https://www.thedroptimes.com/42169/drupals-starshot-edition-bounty-program-seeks-accelerate-contribution-and-reward-innovation">Starshot Edition of its Bounty Program</a>, offering credits to contributors for their involvement in key projects. This initiative aims to accelerate progress within the community.</p><p><a href="https://www.thedroptimes.com/42098/drupal-ai-module-alpha-6-update-released">The AI Module in Drupal has launched its Alpha 6 update,</a> including most core functionalities. A series of instructional videos has been created to help users navigate these new features.</p><p><a href="https://www.thedroptimes.com/42102/introducing-dresktop-multi-platform-tool-drupal-project-management">Jose Daniel Estrada introduces Dresktop</a>, a desktop application designed to simplify Drupal project management, inspired by Acquia Desktop and other tools.</p><p><a href="https://www.thedroptimes.com/42133/drupalorg-outage-resolved-after-brief-downtime">The Drupal.org website experienced a brief outage</a>, but thanks to swift action, the issue was promptly resolved, with insights from <a href="/people/27085/hestenet" data-entity-type="node" data-entity-uuid="a83a1737-f31e-4f40-8f7b-2d0c7228bedb" data-entity-substitution="canonical">Tim Lehnen</a>, CTO of the Drupal Association.</p><p>Acquia and other sponsors will <a href="https://www.thedroptimes.com/42031/drupal-govcon-community-party-in-college-park">host a community party for Drupal GovCon attendees on August 13</a>. The event promises an evening of relaxation and networking.</p><p><a href="https://www.thedroptimes.com/42153/last-chance-submit-sessions-twin-cities-drupal-camp-2024">Session proposals for Twin Cities Drupal Camp 2024 are open until August 15</a>. The camp, taking place at the University of Minnesota, encourages last-minute submissions.</p><p><a href="https://www.thedroptimes.com/42168/visit-droptimes-stall-at-drupal-govcon-2024">The Drop Times will participate in Drupal GovCon from August 13 to 15</a>, inviting attendees to discuss the latest trends in Drupal and digital governance at our stall.</p><p>With DrupalCon Barcelona 2024 approaching, <a href="https://www.thedroptimes.com/42079/drupalcon-barcelona-2024-register-now-regular-rate">attendees are encouraged to secure their tickets at the regular rate</a> before August 19 for significant savings.</p><p>DrupalCon Singapore 2024 will be held from December 09 to 11, <a href="https://www.thedroptimes.com/42129/drupalcon-singapore-2024-agenda-released">featuring a wide array of sessions tailored to the Drupal community</a>.</p><p><a href="https://www.thedroptimes.com/42097/drupal-tech-talk-37-be-held-in-tilburg-september-5">The 37th Drupal Tech Talk will take place on September 5, 2024</a>, at Spoorlaan 348 in Tilburg at 19:00 CEST. Hosted by <a href="/organization/14123/indicia" data-entity-type="node" data-entity-uuid="2b89aed5-bc5a-46b2-ac70-f89061095844" data-entity-substitution="canonical">Indicia</a> and organized by <a href="/organization/19104/finalist" data-entity-type="node" data-entity-uuid="c470dfbd-89db-4300-b989-4b3a1d4b26bf" data-entity-substitution="canonical">Finalist</a>, <a href="/organization/19339/react-online" data-entity-type="node" data-entity-uuid="2a5e3872-c5a2-4b50-8e22-475659cc6ad2" data-entity-substitution="canonical">React Online</a>, <a href="/organization/20011/swis" data-entity-type="node" data-entity-uuid="6546e414-fe75-40bb-acef-8d376b614fc8" data-entity-substitution="canonical">SWIS</a>, and <a href="/organization/19533/synetic" data-entity-type="node" data-entity-uuid="c3fa64e1-ea1a-4a90-8e1d-fe355452b3c9" data-entity-substitution="canonical">Synetic</a>, this meetup promises insightful sessions, networking, and community building. Dutch Drupal developers will gather to share experiences, learn from experts, and enjoy food and drinks.</p><p>We acknowledge that there are more stories to share. However, due to selection constraints, we must pause further exploration for now.</p><p>To get timely updates, follow us on <a href="https://www.linkedin.com/company/the-drop-times/">LinkedIn</a>, <a href="https://twitter.com/thedroptimes">Twitter</a> and <a href="https://www.facebook.com/thedroptimes">Facebook</a>. You can also, join us on Drupal Slack at <a href="https://drupal.slack.com/archives/C04A6AZGYF6">#thedroptimes</a>.</p><p>Thank you,<br>Sincerely<br><strong>KAZIMA ABBAS</strong><br><strong>Sub-editor, </strong><em><strong>The DropTimes</strong></em><strong>.</strong></p>

Drupal GovCon 2024 kicks off tomorrow in Washington, D.C., uniting professionals from government, non-profits, education, and the private sector for a free, three-day conference. With over 800 participants expected, this event promises rich sessions, networking opportunities, and insights from the organizers, shared exclusively with The DropTimes, the official media partner.

Scaling and Performance Optimization of Drupal Editor Mon, 08/12/2024 - 10:24

The future is not distant anymore, so what kind of "good Drupal performance and scalability" can we expect in 2024? Moreover, what implementations can be done via Drupal's features and options to impress an online audience?
Nowadays, in the era of digital content, a website should be ultramodern in both presentation and performance. Consumers prefer easy experiences. Hence, the ability of an organization to do this for them is a critical factor in service delivery. Regarding the user side of the services, sites should hold up with rapid traffic growth, constantly upgrade, and provide users with a wide range of features.
Moreover, such a growing level of cross-communication may not only meet those expectations but also go far beyond them to help organizations grow in the digital domain. 

A comprehensive study by The DropTimes (TDT) uncovers a significant preference for Drupal among U.S. universities, with 35.4% opting for this robust and flexible CMS. The findings highlight Drupal&#039;s critical role in shaping the digital landscape of higher education, as institutions increasingly favor free and open-source solutions for their adaptability and community support. Dive into the study&#039;s insights and discover how Drupal is leading the charge in academic content management

This week started with undoing the horrors that y’all were subjected to last week: TwoTerribleTextAreasWidget featured prominently. The follow-up that I mentioned landed (Ben “bnjmnm” Mullins and I collaborated on it), which with a +110,-245 diff resulted in something that still is nowhere near a final UX, but is starting to look reasonable.

The evolved component instance props form: much simpler (it looked Frankensteinish a week ago!), by using the appropriate field widgets directly. Issue #3461422.

(Next up on that front: #3462310: Component props form: make form elements match design.)

That right sidebar is overlaid on top of the canvas, which also saw a big leap forward this week — thanks to Jesse “jessebaker” Baker, Harumi “hooroomoo” Jang, Ben “bnjmnm” Mullins and Lauri — a true team effort:

Component states in action: hover and active/focus. Issue #3460783, image by Jesse.

The images you saw last week showed actual component previews … but we cheated by using inline styles :P.
This week, Ben rectified that: CSS/JS assets are now loaded inside the preview <iframe>s.

But I saved the best for last: the last MR to land this week was Ben’s Redux integration issue … which brought with it: live updates of the component’s preview:

Live updating of component previews while the props are edited in the right sidebar! Issue #3462441, image by Ben.

This currently always requires a round trip to the server, but in many cases we’d actually be able to update the preview without a round trip (better for UX obviously!). See #3453690: [META] Real-time preview: supporting back-end infrastructure, where Lee “larowlan” Rowlands intends to work on parsing a Single-Directory Component’s Twig template into an Abstract syntax tree, which would allow eliminating that round trip in typical cases.1

I omitted less interesting MRs, but there’s one more issue that landed that deserves a mention: Ted “tedbow” Bowman and Ben landed CI: use a snapshot of core’s phpcs rules as changes in Drupal core will break MRs with limited benefit to module development, which was a very welcome addition: recently, Drupal 11 development has picked up steam … and hence several coding standards were added to Drupal core. Result: XBs phpcs CI job started failing overnight, with zero changes on our end. Doing the right thing can be painful! So, Ted and Ben changed that so we’d be notified instead: far less disruptive.

In progress/where to contribute

• Experience Builder has some needs that Single-Directory Components has not had to fulfill. Lauri asked me to start developing a comprehensive plan for integrating XB with SDC: what are all the mismatches, the feature gaps, et cetera?
• Ted discovered that XB currently does not support propless SDCs — oops! This is a great first issue to contribute to XB!
• Lauri created #3463300: Implement the concept of sections within the client
• Lauri also created #3463307: Implement simplified zoom interface, which Gauravvvv quickly picked up!
• Ben created #3463610: VH units fix only works for inline styles, which seems another great first issue to contribute to XB, but this time on the front end.
• Finally, I created #3463957: “Publish” and “Share” buttons should convey they do not yet work, which was quickly picked up by fazilitehreem :)

P.S.: issues that were picked up by somebody do not exclude you from contributing too — as you can see above, almost every issue is a multi-person effort!

Missed a prior week? See all posts tagged Experience Builder.

Goal: make it possible to follow high-level progress by reading ~5 minutes/week. I hope this empowers more people to contribute when their unique skills can best be put to use!

For more detail, join the #experience-builder Slack channel. Check out the pinned items at the top!

Week 11 was July 22–28, 2024.

1. If the SDC prop value is rendered as-is, with no transformations applied, then no round trip is necessary. Otherwise, that might be needed. ↩︎

• Drupal
• Acquia
• Experience Builder

• Component states in action: hover and active/focus.
• The evolved component instance props form: much simpler, by using the appropriate field widgets directly.
• Live updating of component previews while the props are edited in the right sidebar!

The Drop Times will host a stall at Drupal GovCon 2024 from August 13th to 15th. Stop by to discuss Drupal’s impact on public sector digital transformation and explore its future potential.

Much like my last update things are going well. I am able to spend 2 full days every week on contribution and my commit activity has increased quite a lot. Many thanks to my sponsors: Palantir.net, OPTASY, and new ones who joined in the past few weeks: Vardot, OpenSense Labs, and Liip.ch.

Now some numbers, since the last update I committed 82 issues (worth 820 weighted issue credits), that’s about 33 issues per month (or 330 issue credits). That’s a few more issues per week than before. There is still room to increase the commit activity with more sponsors so don’t hesitate to check out how to sponsor my contribution in core.

1. Navigation LayoutBuilder UI has dead click zone
2. Update the Drupal logo in Drupal core with the 2024 brand evolution I like the new brand very much, it’s good to update the default icon
3. Update documentation for table.html.twig around table cells
4. Regression: The drawer in Safari is missing the drop shadow
5. Update the Drupal logo on the project page
6. Meeting notes: May 20th 2024 - Isomorphic rendering Meetings take time, I can now spend it more easily to keep updated and make sure everyone is aligned
7. Remove JavaScript from Views configuration form now that it is only CSS Removing JS code because CSS is so good now is always nice
8. Navigation overlay z-index is not defined
9. Update stylelint rule unit-allowed-list to include container query units
10. Navigation: Avoid layout builder form submit
11. Tab highlights for current/hover/click are too high up when other tabs have 2 lines of text
12. Mobile version of Navigation menu doesn’t properly reset Drupal.displace() on closing
13. core.libraries.yml mis-implements moved_files syntax
14. When configuring a field on a content type’s “manage display” tab the spinner shifts the label and format column
15. #states not working correctly when built from a logical combination of multliple fields
16. Responsive image width/height values are not used from fallback image style
17. Custom Navigation logo is disconnected from new Layout template
18. CKEditor 5 Styles dropdown broken when in off-canvas sidebar
19. [drupalMedia] Ability to mark image media as “decorative”
20. Refactor (if feasible) use of jquery parseHTML function to use vanillaJS removing jQuery one method at a time
21. drupalInstallModule nightwatch function does not work with Experimental modules
22. Prefer to use Array.prototype.includes() for some of Array.prototype.indexOf()
23. Claro: Autocomplete dropdown bleeds through sticky table header
24. Refactor Claro’s table–file-multiple-widget stylesheet
25. “Single-Directory Components” needs to be hyphenated because of English grammar and content style rules
26. Trigger a JavaScript deprecation error for dialogClass in forked dialog.js
27. Update to jquery UI 1.14.0 beta 2 Bleeding edge of web development :)
28. Implement Nightwatch tests for Navigation module
29. Visually-hidden refresh button in Field UI fails WCAG Focus Visible.
30. Olivero: Incorrect positioning of close button on mobile device when navigation module is enabled.
31. The core/drupal.message library requires a status_messages render element
32. The [0] hatch in misc/vertical-tabs.js causes issues if there are multiple forms with vertical tabs. One thing jQuery does well is handle uncertainty much better than vanilla JS, and removing jQuery exposes us to that kind of things
33. Drupal core committers team meeting - Dev Days Burgas 2024
34. Reorder checkboxes on “Development settings” page
35. Secondary tabs design is distorted on block view page
36. Drupal core committers meeting 2024-06-11
37. Remove decoupled menus and media initiatives from MAINTAINERS
38. Update Drupal’s default throbber icons Using svg instead of gifs, overdue
39. Update loading icon and use SVG
40. Layout shift on displays in views page
41. Remove documentation for readmore, logged_in and is_admin from node.html.twig
42. Remove legacy ‘metadata’ variable from node.html.twig
43. Prevent simultaneous open/close on simultaneous click/hover Navigation still needs polish, this one helped quite a bit with regular use
44. Long string breaks the layout of Claro (reapply fix)
45. Spacing issue in Home > Search page on Advanced search section
46. Autocomplete input text can visibly overflow under magnifier icon
47. Refactor Claro’s tabledrag stylesheet
48. Have a dedicated category for blocks provided by the Navigation module
49. ToolbarStoredStateTest needs wait after resizing window
50. The link on the Image tag is redirecting to an undefined page from the node preview screen
51. clarify db settings for run-tests.sh example command
52. Parameters doc for views “row” should be at the top level of the array
53. Consolidate Umami performance tests
54. Optimize TelephoneFieldTest
55. hook_local_tasks_alter() and hook_menu_local_tasks_alter() need mutual @see links
56. Update to ckeditor 42.0.2
57. Consolidate methods on FormElementsLabelsTest
58. Merge the build and lint stages in core MR pipelines Tests go faster
59. Fix Field UI tests that rely on UID1’s super user behavior
60. Single directory component CSS asset library not picked up in admin theme immediately after module install without cache clear
61. Replace t() calls inside of Controllers that do not use StringTranslationTrait
62. Render API overview should include a link to the list of elements
63. Resync .gitlab-ci.yml and .gitignore following Yarn 4 in 11.x
64. Merge test methods in FieldUIRouteTest for better performance
65. Fix File tests that rely on UID1’s super user behavior
66. Stop using a data provider in UserPasswordResetTest
67. More efficient route lookup caching
68. Update deprecation notices in ajax.js
69. Consolidate ckeditor5’s FunctionalJavascript tests More test speed
70. Drupal Displace outputs invalid value for --drupal-displace-offset-right when opening top dialog
71. Subpixel rounding issue causes dialog to resize unnecessarily That one had a funky side effect when resizing the browser window. It’s gone now :)
72. Document that Uuid::isValid() only considers lowercase UUIDs as valid
73. Menu system docs section gives wrong alter hook
74. standardize docs on how to use the 4 types of test base
75. Update to jQuery UI 1.14.0
76. Add example and sections to Block API documentation
77. FileSystemInterface::copy documentation is inaccurate
78. Use artifacts to share the eslint and styleint caches from core to MRs
79. New throbber SVG images lack xmlns attribute
80. Drupal core committers meeting 2024-08-05
81. Drupal core committers meeting 2024-07-01
82. Document the recommended ways to obtain the database connection object

There were too many to comment each one individually. Many issues on stabilizing the new navigation module, making core tests faster, and documentation.

If you’re interested in supporting my work on Drupal core and keep the frontend fixes coming, consider sponsoring me.