Drupal Layout Builder vs Paragraphs: Which One to Choose? ...| OPTASY

There’s no better way of telling which tool best fits your needs than by putting Drupal 8 Layout Builder and Paragraphs to the test, right?

If you were searching for an honest comparison of the 2 Drupal 8 drag and drop page builders, you’re on the right blog.

Because in this post I’ll compare Drupal Layout Builder vs Paragraphs.

What you’ll get is a straight answer to each one of your key questions regarding the 2 most popular page building tools in Drupal:

Why would you choose Drupal Paragraphs?
What are its main trade-offs?
What are its best use cases?
What are the key advantages of using Drupal 8 Layout Builder?
What are its limitations?
What are the use cases of Layout Builder vs Paragraphs?

Now, let’s get you those answers:

1. Drupal Layout Builder vs Paragraphs: Introducing the 2 Contestants

1.1. Drupal Paragraphs

The Paragraphs module was quite a revelation when it was first released.

Why? Because Drupal rocked supreme at enabling users to create template-based pages, but when it came to uniquely designed pages (i.e. landing pages) it started to show its limitations.

And this is where the Paragraphs module came in. It “seduced” Drupal developers with a new component-based approach to building a page’s layout.

Drupal Layout Builder vs Paragraphs: The Component-Based Approach

Source: Championsdigital.com

The Paragraphs layout builder would allow developers to create individual paragraph types — popup elements, plain text, code blocks — and editors to assemble those paragraphs into highly flexible pages.

Moreover, they could reuse those page components to create new and new content layouts.

For instance, they could put together a page that included one WYSIWYG Paragraph, a Slideshow Paragraph, and one paragraph with both text field and image field...

The idea of “flexible structured content” had taken over the Drupal planet...

1.2. Drupal 8 Layout Builder

The drag and drop page builder in Drupal core designed to take the content editing experience to a new level.

How? By granting editors more control over the Drupal layouts they create.

Drupal 8 Layout Builder enables non-technical users to easily mix and match nodes, fields, and other types of content via a drag-and-drop UI.

They can create their visual layouts and landing pages in no time. All they need to do is drag and drop, then rearrange site-wide blocks and content fields to their liking.

Drupal Layout Builder vs Paragraphs: Improved Editor Experience

Source: Drupal.org

Moreover, users can even create new custom “inline” blocks of their own.

Power and flexibility combined into one visual design tool aimed at improving the editor experience.

2. What Are Their Key Strengths?

2.1. Drupal Paragraphs

In a Drupal Layout Builder vs Paragraphs “battle”, why would you go with the “stacked components” approach to layout building in Drupal 8?

Drupal Layout Builder vs Paragraphs- Paragraphs

Source: Drupal.org

Because the content editing experience is intuitive: editors can use the “Add a popup” and “Add a quote” tabs and rearrange their components with drag and drop
Because it enables you to group multiple fields into new complex elements
Because it allows you to come up with an unlimited no. of ways for combining your paragraphs
Because it enables you to create reusable components that you can then use per node
Because it prevents the workflow of your nodes from becoming too cluttered by providing an entity type for your sub-page components

Drupal Layout Builder vs Paragraphs- Add section steps

Source: Drupal.org

2.2. Drupal 8 Layout Builder

What are its key selling points? Why would you choose Layout Builder over Paragraphs?

Because it requires less custom code
Because it grants you a higher level of control over the layouts you’re creating
Because it grants you lower maintenance costs
Because you get to mix field content with blocks
Because you’re free to create and populate new landing pages from the ground up: just set up your custom content blocks and arrange them to your liking within the layout
Because it provides you with an improved authoring experience
Because you can extend the default set of layout grids through custom plug-ins
Because it allows you to keep your structured data
Because it enables you to get the most of the block system for creating your Drupal layouts: custom inline blocks, programmatic blocks, custom global blocks, custom field blocks

“Blocks” that are fieldable, translatable, templatable, reusable, and part of Drupal core, as well.

Drupal Layout Builder vs Paragraphs- Using blocks with the Layout Builder

Source: Phase2Technology.com

In a nutshell, this Drupal page builder provides both:

an easy way to manage fielded content in the backend
the best drag-and-drop editor experience

3. Where Does Each Drupal Page Builder Fall Short?

3.1. Drupal Paragraphs

What could make you… hesitate before choosing the Paragraphs layout builder for creating structured content? What are its key limitations?

You (your content editors) still depend on a developer to set everything up
Managing nested paragraphs when dealing with complex layouts can get quite overwhelming

Drupal Layout Builder vs Paragraphs: Nested Paragraphs

Source: Evolvingweb.ca

And this is the biggest trade-off that could discourage you from going with Paragraphs as your page building tool:

You get to nest/add new and new elements, which carry their own sets of elements, up to the point where this “unlimited nesting” of paragraphs turns into a too confusing interface to cope with.

3.2. Drupal 8 Layout Builder

Where does it fall short?

In a Drupal Layout Builder vs Paragraphs “debate”, which drawbacks of this visual design tool could make you choose Paragraphs instead?

You might find block content not to be 100% explicitly connected to nodes
Combining template-based with custom layouts is a bit challenging
Enforcing a sitewide consistency of your custom-made layouts is quite a dare

4. When Would You Use One Layout/Editing Tool Over the Other?

4.1. Drupal Paragraphs

When you need to reuse many of the content components on your website to create new pages
When being able to reuse those components “per node” is of particular importance for your workflow
When your structured layout does call for nested paragraph bundles

4.2. Drupal 8 Layout Builder

When would you use this particular solution for creating layouts in Drupal 8?

When is Layout Builder a better choice than the paragraphs module?

When your landing page calls for a grid-like layout, including both dynamic elements (custom blocks, views) and fielded content
When you need to “juggle with” multiple columns for creating your layout
When you need to create a fully customed page from the ground up; a “special” page, that’s not connected to any structured content on your website (i.e. a single “Get a Quote” page)
When you need to custom-tune templated layouts; to override existing page layouts
When you need to set up “layout templates”, such as the layout for your product page or your blog post page

5. Final Results: Which Approach Best Fits Your Needs?

What do the results of this Drupal Layout Builder vs Paragraphs comparison tell you?

That there’s no “best” Drupal page builder. Only the one that best fits your specific layout creation needs.

It all comes down to the level of diversity in your content:

If it’s a particularly intricate page layout that you need to create, you might not want to go with Paragraphs. Its nesting feature can turn against you.
If you’re “craving” flexibility and the content on your Drupal 8 website varies a lot from page to page, yet you still want to keep a level of layout consistency, the Drupal 8 Layout Builder is your best choice

Your turn now: which of these 2 page building tools do you prefer and why?

Let me know in the comments below.

Image by 200 Degrees from Pixabay

We do Web development

Go to our Web development page!

Visit page!

Recommended Stories

Drupal Drupal 8

Drupal 9 Modules Readiness: How Hard Is It to Find Compatible Modules and Build a Website in Drupal 9?

Is it (still) too early to give Drupal 9 a try? To start fresh and build a website from scratch in the latest version of Drupal? Should you stick to Drupal 8 for... a little longer and upgrade later? How difficult will it be for you to find compatible Drupal 9 modules (and themes)? Let's find out: 1. But First: Why Drupal 9? What are the biggest benefits of Drupal 9 over Drupal 8? Why would you choose precisely this version of Drupal to build your new website with? because of the automated updates that it makes possible because of the headless support that it ships with because of the robust multilingual capabilities because of the improved performance: your web pages will load faster thanks to the BigPipe technology because it removes a lot of the legacy code because of its layout features because of its extensibility: you get to incorporated third-party systems quick and easy because of its media library and robust media functionality because of the new, Twig-based theme engine because it's easier to use: you can make the most of its in-place editing (CKEditor) And particularly because there will be no more major re-builds (aka "major pains to upgrade"). Instead, a set of new features gets released every 6 months, including new improvements and additions to be incorporated seamlessly into your Drupal 9 build. 2. Most Drupal 9 Modules Don't Change at All So, stay assured: you won't be having a hard time finding compatible modules for your new Drupal 9 website. Many of the modules on Drupal.org have been, are being made, and will be made compatible with Drupal 9. There's a collective effort coming from the Drupal community in this direction. And where do you add that the process is pretty straightforward: Same code, but without the deprecated APIs. 3. But What About Those that Do Need Changes? For there have been changes under Drupal 9's hood. Changes in coding with a direct impact on some modules and APIs. Which means that some modules have turned from Drupal core modules to... outside dependencies: this is good news, considering the performance gains you get but also a challenge if you were relying precisely on those modules for your Drupal 9 website Luckily, you have at least 2 helpful tools at hand that you can use to: identify the Drupal modules that still need to get updated apply the fixes needed to make those modules compatible with Drupal 9 3.1. The Upgrade Status Module Why use it? Because it offers you a view of all that has been changed in Drupal. Source: Drupal.org You have links to the modules' pages there, that you can access to review those changes. 3.2. The Upgrade Rector Module The great thing about this tool is that it provides you with automated code fix suggestions to help you make your target modules Drupal 9 compatible. Source: Drupal.org 4. Some Module Get Removed from Drupal 9 Now, there are a few Drupal modules that didn't get the chance to grow into Drupal 9 modules. And I'm talking here about: Simple Test, that's now replaced by PHPUnit Place Blocks, now replaced by the Layout Builder As you can see, in both cases you get to use better alternatives. So, it's just a matter of favoring more powerful solutions. Good to know! Expect other modules and themes (i.e. the Classy theme, the Stable theme) to get deprecated and removed by the time we reach Drupal 10. 5. What About the Contributed Modules? What if you need more than the out-of-the-box Drupal 9 modules to build your new website? What if you depend on particular contributed modules? Or on... many contributed modules? Well, then things get a little more challenging... Because many of the contributed Drupal modules still need to be made compatible with Drupal 9. They need some time to catch up with the new version of Drupal. Take for instance: updating tests to PHPUnit or updating deprecated API usages. Now, what you can do is give a helping hand to accelerate the updating of these modules. And the steps/best practices to follow are pretty simple, as suggested in this guide on Drupal.org : use the patch referred to here, create an issue in the module project (first, make sure it doesn't exist already), and choose a title suggestive enough to let the maintainer know that it needs to be tested for Drupal 9 deprecations add an explanation for the signaled issue ... and follow all the other steps suggested in that Drupal.org guide. Tip! Ask that contributed module's maintainer how he/she would like to address the issues you're signaling. Because the guidelines available for Drupal core aren't always relevant for addressing contributed module issues, as well. The END! Now, assuming that: you only need a limited no. of contributed modules for your new Drupal 9 build it's not a heavily customized website that you're building ... how do you get it up and running in? We're here to help. Just drop us a line! We've been building Drupal websites since... Drupal 5. Image by Siggy Nowak from Pixabay ... Read more

Adriana Cacoveanu / Aug 28'2020

Drupal Drupal 8 Tips Web Design

5 tips to pass your Acquia Site Studio (Cohesion) Certification Exam

A few weeks ago, I had the chance to take the Acquia Site Studio (formerly Cohesion) Certification exam. In this post we are going to discuss why I took this exam and more importantly, how I passed it and became an Acquia Certified Site Studio Site Builder. Optasy and its commitment to quality through knowledge You already know that quality is part of the corporate culture of Optasy. For us quality is a key factor to protect our clients' investments and guarantee them a high ROI. But having a good QA department is not enough. Actually, it's often too late when the QA team detects an issue. At Optasy we prefer to ensure quality at the early stages of our projects, analyzing deeply the needs of our clients and transform them into effective digital experiences but we also know that the quality of the code we produce comes from the experience and the skills of our developers. That's why Optasy has an internal 'skill knowledge acquisition program' to help its employees (optasians) to acquire new skills or improve them. This program gives to each optasian one day off per month (paid by the company) to study a particular field. As a way to ensure knowledge acquisition and validation, optasians also receive paid leave to study and give their Acquia certification exams. This includes the exam cost too, that’s why many of the optasian developers are actually Acquia Certified developers or Acquia Certified site builders All things considered, it was a pretty easy choice for me to take the exam, not only do I get to improve my skills, but I get paid for it too! What are the Acquia certification programs? Acquia is a preferred Optasy partner that delivers a cloud-based digital experience platform built on Drupal that enables organizations to build experiences that scale. Acquia is committed to facilitating certification programs allowing developers to validate their Drupal skills year after year. Acquia certification exams are administered at Kryterion Testing Centers in more than 750 locations across the globe. Exams are also available as online-proctored tests and are often offered at DrupalCons across the world. What is Acquia Site Studio? Acquia Site Studio (formerly Cohesion) is a low-code solution for building and editing Drupal sites. As an Acquia partner, our team got the chance to become an early adopter of the technology. Acquia Site Studio is a sort of layout builder on steroids without writing any line of code. Not only can you build layouts or templates, but also you can build whole websites from the headers to the footers, and everything in between, like components and widgets, just by using the interface. No code required! It's a kind of atomic design system (like Pattern Lab) where you can create and preview CSS style guides, components, template layouts, page layouts or view layout from a visual user interface with simple “drag and drop”. And all of this within your Drupal site! To be fair, Acquia Site Studio is an amazing tool allowing designers and marketers to create and modify any layout component without calling the development team. If you’re a designer with no coding knowledge you’ll be able to create totally unique layouts based on your designs using intuitive drag and drop layout builder. If you're an editor, you may choose the layout you want to use and add all the pre-designed components you wish. Want to add a slider or a 'Related Articles' block? You drag and drop it in your layout! 5 tips to successfully pass your Acquia Certified Site Studio exam As other Acquia Certification exams, the Certified Site Studio exam requires both experience and knowledge. Though the test is not difficult, it’s not something you want to run into unprepared. From my experience, the questions ranged from a very low to medium range of difficulty, there were barely any difficult questions. This exam validates your ability to: Understand the features and functionality provided by Site Studio Install and configure Site studio environment on new or existing websites. Build a website using Site Studio style builder, components and website structure design elements. The official description of this exam can be found on Acquia's certification overview page. But in short: The tests are all multiple choice. They don't require that you actually configure a Drupal site or write any code. They are available in person at a testing center, or at home by installing the exam software on your computer. The price was $155 (In my case, Optasy paid for the test) Get a good understanding of Drupal Layout Builder As I mentioned earlier, Acquia Site Studio is a Layout Builder on steroids and many concepts are the same, so having some experience with this Drupal module will help you a lot, like the inline editing tools or the concept of drawing element into the layout. This is not mandatory, but I felt really comfortable with Site Studio having this previous experience. Read carefully the contents of the exam On Acquia's certification overview page you'll find the blueprint of the exam like the following: But below it, you'll find the content itself. Read it carefully and repeatedly. This should be your guideline during your study. This will help you focus on what really matters but also to recap and structure your notes. Read and study the documentation While there are really good videos on the Acquia Academy site about Site Studio, watching all of them won't be enough. If you don't have prior experience with Site Studio, it's a good starting point. But it definitively won't give all the knowledge you need to pass the exam. Reading the documentation should sound obvious, but you'll really need to read and study all the documentation in depth. Don't leave anything behind cause the exam covers all the aspects of Site Studio, from the basics to more advanced topics. This will also give you the right vocabulary to understand the questions of the exam, since sometimes they can try to trick you changing just one word. So the technical vocabulary has an important role, and that's where the documentation comes into play. Write down some notes after reading each section. This will help you a lot during the recap! Train on the Acquia Site Studio demo environment You can request an online demo environment for free at the bottom of this page The main benefit is that you won't need an API key or an Agency key, so you can test Site Studio for free, the environment acts just like a normal Drupal website. and the site will be all yours to experiment on. This site will be your friend during your study, you should test everything you learned in the documentation here. Do it several times and try different cases. The night before the exam, after reading back your notes, try to build a site from scratch in this environment to recap all the main concepts. This is key! Don't forget the 'Miscellaneous concepts and features' part These three concepts are not placed in one section, they are dispersed in the documentation. Study and practice all of them because you'll have a question about each one. They are only three, it doesn’t sound like a lot but they are worth 15% of the exam! That is a quick and easy win! A bonus tip What really worked for me was to read a section, practice the concepts of this section in the demo environment, read again the same section and take some notes. The day after, read all the notes of the previous day, do the same 7 days later, reading back your notes and practicing again on the demo site. That way, 80% of what you studied will stay forever in your memory. Conclusions Acquia Certification Site Studio Site Builder can be a good way to validate your skills and knowledge There are barely any difficult questions Study all the documentation because the exam is based on it, but also because the exam will cover all of it. Practice a lot, recap a lot. ... Read more

Karim Boudjema / Aug 27'2020

Drupal Drupal 8

10 Best Tools for Conducting a Drupal 8 Site Audit (to evaluate its performance, security, and stability)

You want to audit your Drupal website's infrastructure, SEO, best practices, security, stress, overall performance... And you ask yourself: Are there tools that help you run a Drupal 8 site audit? ... and generate the reports you need? There are quite a few, actually. To narrow down your too many options, we've made a list of 10 tools and Drupal modules that you can use to test your website's performance, security, and stability. 1. 3 Best Tools to Run a Website Security Audit 1.1. Coder What does it do? it checks your code to see whether it meets the industry standards it checks your text, so you'll know whether i's properly sanitized or not quite In short, a Drupal 8 audit module you'll want to have in your toolbox when conducting a website security audit. 1.2. Qualys SSL Server Test Another tool that you'll want to use during your Drupal 8 security audit process. Why? Because it performs a thorough analysis of a public SSL certificate and generates a grade for you. 1.3. Security Kit How does it work? It provides you with a set of security-hardening options, that strengthen the shield around your site against CSRF, XSS, and clickjacking attacks. 2.3 Best Tools to Run a Drupal 8 Site Audit Focused on Its Performance 2.1. PageSpeed Insight, YSlow, GTMetrix Take these 3 website performance audit tools as your the "swiss army knife" in your toolbox. They run multiple tests on your website and generate a whole set of practical recommendations on how you can boost its front-end performance. Here are just some examples of recommendations: cut down on the number of elements the browser's forced to parse by simplifying the DOM cut down on the number of requests by aggregating your JS files or using image sprites 2.2. New Relic An all-into-one Drupal site audit module that helps you monitor different sections on your website: from infrastructure to server, to browser and application. Now, here's precisely why you'll want to keep it close at hand while assessing your website's performance: it allows you to set up multiple customized dashboards that show graphs and charts of your website's performance data it enables you to keep an eye on your website's traffic and performance in real-time it allows you to isolate bottlenecks and set up alerts for key events 2.3. Performance Monitor Let's say you've just moved your Drupal website to another hosting and you now feel that it has slowed down. And that the new server needs to be optimized for Drupal. This is precisely where this module comes in handy: It gives you a clear picture of how your website's performing now, while comparing different servers/hostings. Here are some of the features you'll love: it checks the Mysql status and variables (and provides recommendations) it tests the overall system performance (it runs database, CPU, and file operations performance tests) it evaluates the "Performance score" 3. 4 Best Tools to Evaluate Your Website's Stability 3. 1. Behat, PHPUnit, Nightwatch Or you can put together your own "combo" of unit and functional testing tools. Automated testing will improve your website's stability... in the long-term (and nothing can beat the peace of mind that you'll get). 3.2. Code Sniffer Whenever you need to assess your code's quality, just reach out for this Drupal 8 audit tool. It will... "sniff on" your code and signal you if it doesn't meet the coding standards. Also, while testing your code's stability, you'll want to have a look at: the quality of your links the cycles of peer review for codes the factors that influence the SEO the access and breadth of documentation the modules you have on your website: are there any outdated ones? 3.3. Tugboat You save time and money using Tugboat (or an alternative continuous integration tool). Here's how: it runs the automated and linting tests that you will have set up and generates a report to your developer before even merging or reviewing the code it builds a completely working website that incorporates that new feature you've added or has that specific bug fixed before it gets merged A true time-saver that you'll definitely want to have in your toolkit when testing newly added code for stability. 3.4. Linting Tools How do they help you increase the stability of your Drupal website? they get all the developers in your team on the same page when it comes to the code format to be used they (i.e. Drupal Code Sniffer) enforce the Drupal coding standards once integrated to your developers' text editors Tip! Make sure you incorporate your linting tools into your automated testing routine, the one that gets performed on each pull request. The END! These are your best options when it comes to the Drupal 8 site audit tools to include in your toolkit. But what if you dread the idea of digging deep into your code, checking every single one of your Drupal modules, evaluating the CPU performance... What if you could still get a clear picture of how you're website's performing without the dread of going through all these tedious, time-consuming tasks? Just shift the burden to us! Drop us a line and let's get your Drupal website checked for all the issues and bottlenecks affecting its performance, security level, and stability! Image by Free-Photos from Pixabay ... Read more

Adriana Cacoveanu / Aug 06'2020

Drupal Layout Builder vs Paragraphs: Which Drupal Page Builder Should You Use?