Publicado en
October 14, 2024

Visual Headless Content Management in Magento 2 with Builder.io

Estefanía Izaguirre
Marketing Specialist

Magento is a very powerful e-commerce platform, but when it comes to content management, it has always left something to be desired. For this reason, we have been looking for alternatives that are easier to use, flexible and adapted to the future for some time. We think we hit the nail on the head with Builder.io.

A critical look at the PageBuilder of Magento

Magento includes a PageBuilder that is used to manage pages, blocks, categories and product descriptions. However, in most projects, we see that it falls short quickly. This is why Magento stores often end up using traditional CMS such as WordPress or Umbraco to manage content such as pages and blogs.

Where does the PageBuilder fail? Here we summarize it for you:

  1. Little freedom of editing
    Although it allows you to create simple designs with predefined content (text, images, videos), it becomes very limited when you want to create more personalized sections consistent with the visual identity of the brand. Without coding knowledge, it's easy for content to end up looking generic.
  2. No content preview
    Being separate from the interface, you can't see what the content will look like as you create it. It also doesn't offer a preview option before saving, so you have to be constantly saving and checking.
  3. Poorly optimized HTML
    Content created in PageBuilder is converted to HTML that is not optimized for Pagespeed. The images are not compressed, there is no deferred loading, and the videos load external JavaScript files, even if they are not playing. The more content you put on a page, the more it will affect speed.
  4. High maintenance costs
    Although you can extend PageBuilder with custom blocks, this requires technical development, which means relying on a team of developers every time you want to make adjustments or create something new. This limits the freedom of the content manager and increases costs.

In short, PageBuilder does not meet current expectations for efficient and flexible content management.

Builder.io: an alternative Headless to the CMS

After trying several alternatives, Builder.io is, without a doubt, the best option. Builder.io offers a solution Headless, where content management occurs outside of Magento, but is still connected via API. Magento still manages pages, their URLs and metadata, but you manage all the content in Builder.io.

Why do we like Builder.io so much? Here are a few reasons:

  • On-site visual editor
    Although the Builder.io editor doesn't run directly in Magento, it uses an iframe to display your site as you edit it. That way, you can see the changes in real time, without that tedious flow of creating content and then validating it on the web.


Builder.io gives you total freedom to design and organize your content using drag and drop. You can control everything: typography, colors, spacing, shadow effects, and even create your own CSS attributes or insert JavaScript if you need it.

  • Structured content models
    If you prefer a more structured approach, you can create models with predefined fields for different types of content, such as blog posts or employee profiles. This is ideal if you need a consistent structure in your content.
  • Responsive editing with real-time preview
    Builder.io lets you see what your content looks like on mobile and desktop devices at the same time. If you make changes to the desktop view, the mobile view is automatically updated.
  • HTML optimized for Pagespeed
    Builder.io takes performance very seriously. They analyze each element to ensure that the HTML output is optimized to the maximum, without you having to worry about page speed.
  • Integration with Magento data
    Through the API, you can insert and manage product and category data directly into the content. This allows you to easily create sections with featured products or links to categories.

A renewed experience for content managers

With the integration of Builder.io, we have transformed the experience of managing content in Magento. By removing the limitations of PageBuilder, content managers now have a freedom they didn't have before, without relying on a technical team for every change.

With Builder.io you can:

  1. Create advanced components such as product sliders, modals, or tabs.
  2. Design custom forms with field validation.
  3. Use AI and Figma to automatically generate content.
  4. Schedule content or content changes
  5. Constantly optimize content with A/B tests and heatmaps.
  6. Customize content for mobile and desktop, hiding elements depending on the device.
  7. Add custom animations to elements.

Benefits for your business

Builder.io not only makes content management easier, but it also provides important benefits for your business:

  • More freedom to create the content you need without relying on developers, which speeds up publishing time.
  • Continuous improvement of the content through constant testing and optimization.
  • Full control over visual design, crucial if aesthetics are important to your brand.
  • Fewer complications and costs by not having to manage a separate corporate site in another CMS.
  • Better results in Pagespeed, which can improve your search engine rankings and reduce advertising costs.

We are currently using the plan Growth, which costs $39 per user per month. If you calculate the time you save creating content, it's a worthwhile investment.

Learn more about our solution with Builder.io for Magento
If you feel that your current CMS is limiting you, contact us. We'll be happy to talk about how a solution with Builder.io can transform your business. You can also visit our page to learn more about our solutions with Magento and subscribe to our newsletter for updates.

Publicado en
This is some text inside of a div block.

Heading

No items found.
This is some text inside of a div block.
This is some text inside of a div block.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Servicios

Cómo podemos ayudarte

Consulta los servicios con los que te ayudaremos a conseguir tus objetivos digitales.

servicios

Otros artículos

Proyectos de interés