Skip to content

Commit 051f0fe

Browse files
committed
PB-480: Update content type styling concepts
WIP polishing
1 parent 5a107ce commit 051f0fe

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

docs/how-to/how-to-use-attributes-for-styling.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
Attributes in Page Builder give you a way to add a variety of interactive CSS styling options for your content types. For example, Page Builder's Heading content type provides a number of built-in styling options from its form. The Heading form gives users options to set different heading types, text alignments, border properties, margins, and paddings. It also lets users apply multiple static CSS classes.
44

5-
But what if you want to give users more interactive styling options? For example, maybe you want to add Heading color options. Or Heading text-style options. This topic will explain how to user attributes to provide more content type styling options.
5+
But what if you want to give users more interactive styling options? For example, maybe you want to add Heading color options. Or Heading text-style options. This topic will explain how to use attributes to provide these types of styling options and more.
66

77
## Install the example module
88

@@ -235,7 +235,7 @@ We will use the following snippent from the `heading.xml` configuration file (`M
235235
```
236236

237237
{: .bs-callout .bs-callout-info }
238-
The `<tag>` and `<html>` nodes are beyond the scope of this topic, but like the other nodes, they also map to form fields. In this case, the `<tag>` node maps to the Heading's `heading_type` selector field and the `<html>` node maps to the `heading_text` input field from the (`pagebuilder_heading_form.xml`) form.
238+
The `<tag>` and `<html>` nodes are beyond the scope of this topic, but like the other nodes, they also map to form fields. In this case, the `<tag>` node maps to the Heading's `heading_type` selector field and the `<html>` node maps to the `heading_text` input field from the `pagebuilder_heading_form.xml`.
239239

240240
### Understanding and using `<style>` nodes
241241

@@ -290,4 +290,4 @@ As mentioned, you can override the `<css>` node to map it to a different form fi
290290

291291
## Final thoughts
292292

293-
Using custom attributes represents one of Page Builder's best practices for adding powerful and flexible content styling options to forms. You can add these styling attributes to both existing content types (as shown in the Heading extension module) and custom content types. The CSS styling options are only limited by the CSS specs targeted by your supported browsers. So get creative and have fun!
293+
Using custom attributes represents one of Page Builder's best practices for adding powerful and flexible content styling options to forms. You can add these styling attributes to both existing content types (as shown in the [example module](https://github.com/magento-devdocs/PageBuilderStylingWithAttributes)) and custom content types. The CSS styling options are only limited by the CSS specs targeted by your supported browsers. So get creative and have fun!

0 commit comments

Comments
 (0)