Problem/Motivation

Currently no ability to add classes to blocks in Layout Builder.
Block Class module cannot introduce this feature for Inline Blocks due to a pending core patch. See #2998114: Integration with Drupal core's new Layout Builder.

Proposed resolution

Add Layout Builder Component Attributes module to be enabled by default.
https://www.drupal.org/project/layout_builder_component_attributes
#3143804: Add support for Layout Builder Component Attributes extension integration with Layout Builder UX

Remaining tasks

  1. Add the module.
  2. Enable by default (with hook_update for existing sites)
  3. Provide default config (such as permissions ...etc.)

#3171155: Fix order of data value for allowed_block_content_attributes in layout_builder_component_attributes.settings

User interface changes

Introduced from the module.
#3143804: Add support for Layout Builder Component Attributes extension integration with Layout Builder UX

Watch Videos

https://youtu.be/FoGrKd6UDY0


API changes

None.

Data model changes

None.

RTL - Edit layout

Edit layout

RTL view

LTR view

CommentFileSizeAuthor
#25 Test Layout Builder Component Attributes extension with Layout Builder UX and custom icon - Front end - LTR.png1.61 MBrajab natshah
#25 Test Layout Builder Component Attributes extension with Layout Builder UX and custom icon - Front end - RTL.png1.65 MBrajab natshah
#25 Test Layout Builder Component Attributes extension with Layout Builder UX and custom icon - RTL.png322.36 KBrajab natshah
#18 Test Layout Builder Component Attributes extension with Layout Builder UX and custom icon.png485.06 KBrajab natshah
#17 Edit layout for Test Layout Builder Component Attributes extension with Layout Builder UX and custom icon - dev varbase8c1 varbase_layout_builder Quick.gif29.41 MBrajab natshah
#15 Test-Layout-Builder-Component-Attributes-extension-with-Layout-Builder-UX-and-custom-icon-dev-varbase8c1-varbase_layout_builder.png710.21 KBrajab natshah
#13 Test-Layout-Builder-Component-Attributes-extension-with-Layout-Builder-UX-and-custom-icon-dev-varbase8c1-varbase_layout_builder.png1007.22 KBrajab natshah
#13 Edit-layout-for-Test-Layout-Builder-Component-Attributes-extension-with-Layout-Builder-UX-and-custom-icon-dev-varbase8c1-varbase_layout_builder-after-save.png588.9 KBrajab natshah
#13 Edit-layout-for-Test-Layout-Builder-Component-Attributes-extension-with-Layout-Builder-UX-and-custom-icon-dev-varbase8c1-varbase_layout_builder-open.png410.11 KBrajab natshah
#13 Edit-layout-for-Test-Layout-Builder-Component-Attributes-extension-with-Layout-Builder-UX-and-custom-icon-dev-varbase8c1-varbase_layout_builder.png349.22 KBrajab natshah

Comments

Mohammed J. Razem created an issue. See original summary.

rajab natshah’s picture

Noted;
Based on the Schema
https://git.drupalcode.org/project/layout_builder_component_attributes/-...
I'm only having the Inline CSS styles false

layout_builder_component_attributes.settings.yml

allowed_block_attributes:
  id: true
  class: true
  style: false
  data: true
allowed_block_title_attributes:
  id: true
  class: true
  style: false
  data: true
allowed_block_content_attributes:
  id: true
  class: true
  style: false
  data: true

#3171155: Fix order of data value for allowed_block_content_attributes in layout_builder_component_attributes.settings

  • RajabNatshah committed a5de99b on 8.x-1.x
    Issue #3170980: Add Layout Builder Component Attributes module
    
rajab natshah’s picture

Permissions:

administer layout builder component attributes:
  title: 'Administer Layout Builder Component Attributes'
  description: 'Manage global settings for the Layout Builder Component Attributes module'
manage layout builder component attributes:
  title: 'Manage Layout Builder component attributes'
  description: 'Add attributes to Layout Builder components (blocks)'
rajab natshah’s picture

Assigned: Unassigned » mohammed j. razem
Status: Active » Needs review
Issue tags: +varbase-8.8.7, +varbase-9.0.0

  • RajabNatshah committed 6a14b2e on 8.x-1.x
    Issue #3170980: Add Layout Builder Component Attributes module
    
rajab natshah’s picture

Assigned: mohammed j. razem » Unassigned
Status: Needs review » Needs work

Having an integration issues

When the Layout Builder UX module is enabled
Then the "Manage attributes" block context is not showing up

rajab natshah’s picture

rajab natshah’s picture

Assigned: Unassigned » rajab natshah
Status: Needs work » Active

  • RajabNatshah committed 715017f on 8.x-1.x
    Issue #3170980: Add Varbase Layout Builder support for Layout Builder...
rajab natshah’s picture

Issue summary: View changes
rajab natshah’s picture

Issue summary: View changes
rajab natshah’s picture

rajab natshah’s picture

Assigned: rajab natshah » mohammed j. razem
Status: Active » Needs review

This feature is ready
only permissions for user roles in Varbase profile

rajab natshah’s picture

Issue summary: View changes
rajab natshah’s picture

Assigned: mohammed j. razem » Unassigned
rajab natshah’s picture

Issue summary: View changes
rajab natshah’s picture

Status: Needs review » Fixed
rajab natshah’s picture

Title: Add Layout Builder Component Attributes module » Add Layout Builder Component Attributes module and support for Layout Builder Component Attributes extension integration with Layout Builder UX
rajab natshah’s picture

Issue summary: View changes

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.