Skip to content

Commit a80ff0d

Browse files
committed
Merge branch 'MC-5769' of github.com:magento-devdocs/magento2-page-builder into MC-5769
2 parents 8e21928 + 4b574a1 commit a80ff0d

File tree

3 files changed

+6
-6
lines changed

3 files changed

+6
-6
lines changed

docs/create-basic-content-type/overview.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,9 @@ The steps for creating the Quote content type are illustrated and described belo
3838
![Creating Custom Content Types](../images/content-type-overview.png)
3939

4040
1. **Add configuration**: Create an XML file to define your content type and reference the other files that control the appearance and behavior of your content type.
41-
2. **Add templates**: Create HTML templates that define the appearance of your content types on the Admin stage (preview.html) and the storefront (master.html).
42-
3. **Add component**: Create a JavaScript file that defines the behavior of your content type on the Admin stage (preview.js) and the storefront (master.js).
43-
4. **Add form**: Create a UI component form and a layout so users can edit your content type within the Page Builder editor.
41+
2. **Add templates**: Create HTML templates that define the appearance of your content types on the Admin stage (`preview.html`) and the storefront (`master.html`).
42+
3. **Add component**: Create a JavaScript file that defines the behavior of your content type on the Admin stage (`preview.js`) and the storefront (`master.js`).
43+
4. **Add form**: Create a UI component form and a layout so Admin users can edit your content type within the Page Builder editor.
4444
5. **Add styles**: Create LESS files to style your content types when rendered in the Admin UI and on the storefront.
4545
6. **Add frontend widget**: Create a JavaScript file to control the UI behavior (user interactivity) of your content type on the storefront.
4646

@@ -55,4 +55,4 @@ Before we get started, take a look at what you will be building. The directory s
5555
The `PageBuilderQuote` module structure represents an overview of the conventions used for content types. Many of these conventions are simply those defined for developing UI components. However, the conventions specific to Page Builder content types appropriately start within the directories called `content_type` or `content-type`. Page Builder instantiates a content type from the files defined within these directories. We will discuss these content type conventions within each step of the process.
5656

5757
## Next
58-
[Step 1: Add configuration](step-1-add-configuration.md)
58+
[Step 1: Add configuration](step-1-add-configuration.md)

docs/create-basic-content-type/step-1-add-configuration.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ Files referenced from the configuration include the HTML templates, the JavaScri
1313

1414
## Configuration conventions
1515

16-
By convention, Page Builder requires the configuration for a content type to be in the `adminhtml` area within a directory named `pagebuilder` and a subdirectory named `content_type` or `content-type`.
16+
By convention, Page Builder requires the configuration file to be in the `<module_name>/adminhtml/pagebuilder/content_type` or `content-type` directory.
1717

1818
The name of your configuration file should reflect the name of your content type prefixed by your module vendor name and separated by an underscore (_). For example, our module name is `Example/PageBuilderQuote` and our content type is a quote control, so we name our configuration file `example_quote.xml` and add it to our module within the following directory structure (`view/adminhtml/pagebuilder/content_type/`):
1919

docs/create-basic-content-type/step-2-add-templates.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -154,7 +154,7 @@ The `css` attribute applies CSS classes entered by users on the form to a templa
154154

155155
### class
156156

157-
Just as with any other html template, you can add your own classes to your template elements. However, you should **always add the `pagebuilder-content-type` as the first class in the top node in your `preview.html` template** as shown for the Quote. Page Builder uses the `pagebuilder-content-type` class to add visual indicators and mouseover effects to the Admin preview template, such as correctly positioning the options menu. Defining custom LESS/CSS classes for your content type is discussed in [Step 5: Add styles](step-5-add-styles.md).
157+
Just as with any other HTML template, you can add your own classes to your template elements. However, **always add the `pagebuilder-content-type` as the first class in the top node in your `preview.html` template** as shown for the Quote. Page Builder uses the `pagebuilder-content-type` class to add visual indicators and mouseover effects to the Admin preview template, such as correctly positioning the options menu. Defining custom LESS/CSS classes for your content type is discussed in [Step 5: Add styles](step-5-add-styles.md).
158158

159159
### liveEdit
160160

0 commit comments

Comments
 (0)