Guide to Magento 2 CMS Pages: How to Create & Import CMS Pages, Blocks & Widgets
Magento 2 CMS pages are a key part of creating a unique and attractive store. Homepage, news blocks, promotions, and other content types – you can do everything with CMS pages. Including pages composed with Magento 2 Page Builder. In the following article, we explain what a Magento CMS page is. You will also learn how to create CMS pages in Magento 2. The good news is that you are no longer tied to the store’s backend for editing purposes with the Improved Import and Export extension. Below, we will teach you how to import CMS pages to Magento 2. So, what are Magento 2 CMS pages?
Table of contents
- 1 What Is CMS Page in Magento?
- 2 How to Create CMS Page in Magento 2?
- 3 Another Way to Create CMS Pages in Magento 2
- 4 Magento 2 CMS Page Import
- 4.1 Magento 2 CMS Page Attributes
- 4.2 Magento 2 CMS Page Import Job
- 4.3 General Settings: Automate Magento 2 CMS Page Import
- 4.4 Import Settings: Choose Your Magento 2 CMS Entity
- 4.5 Import Behavior: Add New or Update Existing CMS Pages
- 4.6 Import Source: Provide Magento 2 CMS Page File
- 4.7 Map Attributes: Import Any Third-Party CMS Pages
- 5 Final Words
What Is CMS Page in Magento?
A Magento CMS page is an editable HTML page that can contain text, images, blocks of content, variables, and widgets and has a unique URL identifier. For instance, your store’s contact page is an example of a CMS page in Magento 2. “About Us” and “Meet the Team” are also CMS pages. Magento 2 CMS, however, is something a little bit more complicated.
The Content Management System of Magento represents a set of tools used for creating not only pages but also blocks and widgets. By combining those 3 elements, you create CMS pages in Magento 2. Such custom static pages display parts of your catalog or other books of customer-oriented information. Let’s see how to create CMS pages in Magento 2.
How to Create CMS Page in Magento 2?
We divide a Magento CMS page creation into these three steps:
- Add a new CMS Page to Magento 2;
- Add a new CMS Block to Magento 2;
- Add a new CMS Widget to Magento 2.
How to Add Magento CMS Pages
Follow these steps to create a new CMS page in Magento 2:
- Navigate to Admin -> Content ->Pages.
- Click the Add New Page button.
- Activate and name your new CMS page.
- Specify the content heading for your Magento CMS page and add content elements. You can use templates.
- Configure your Magento 2 CMS page SEO. Specify a URL key and metadata.
- Choose websites to display your CMS page.
- Configure page hierarchy.
- Configure other design parameters.
- When ready with the configuration, click on the Save button to create a new CMS page in Magento 2.
Now you can add your new Magento 2 CMS page to other pages with the help of a link widget. Let’s assume you want to add this page as a link to the home page. Proceed to your Home Page’s edit menu, select the content tab, and click on the insert widget button. Add your new CMS page as a widget and configure other parameters. Save the page and refresh the page cache if necessary. That’s it!
How to Add Magento CMS Block
In Magento 2, CMS blocks are snippets of HTML that can be used to add repeating content patterns to pages and other blocks.
Follow these steps to create a new CMS block in Magento 2:
- Navigate to Admin -> Content ->Blocks.
- Click the Add New Block button.
- Activate your new Magento 2 CMS block.
- Specify its name.
- Create a unique identifier for the CMS block. The identifier is used for implementing this block into other pages.
- Choose a store view to display the block.
- Specify the content elements used in the CMS block. You can use templates.
- When done, click on the Save button.
You can use Magento 2 CMS blocks for different purposes, for instance, to separate different categories of your products when featuring them on the home page.
How to Add Magento CMS Widget
In Magento 2, widgets are reusable CMS components that allow adding static/dynamic content to CMS pages and blocks.
Follow these steps to create a new CMS widget in Magento 2:
- Navigate to Admin -> Content ->Widgets.
- Click the Add New Widget button.
- Select your widget type and choose a design theme for it. Click Continue.
- Now, provide a widget title, assign a widget to store views, and specify its sort order. You can also add layout updates.
- In Widget Options, type the widget’s anchor custom text and title and select a CMS page to display the widget.
- When done, click Save.
Congratulations! Now, you can fully manage your Magento 2 CMS pages. But what if there is another way to create CMS pages in Magento 2?
Another Way to Create CMS Pages in Magento 2
You probably know that the native Magento 2 import procedure is limited to products, advanced pricing, and customers, so importing CMS pages is not an option. That’s why the FireBear team offers a solution for importing all the main and complementary Magento 2 entities. With the Improved Import and Export extension, you can easily create CMS pages in Magento 2 by importing the corresponding data. Just like products or categories, CMS pages can be added to the store in bulk using CSV or XML tables.
Magento 2 CMS Page Import
You can import CMS pages to Magento 2 in a CSV or XML file which is properly formatted for Magento 2. The formatting includes:
Character set | Unicode (UTF-8) |
Field separator | Comma, Tab |
Text delimiter | ” |
These are basic formatting requirements. As for more advanced demands, they are related to attributes. Let’s see.
Magento 2 CMS Page Attributes
Below, we explore what CMS page attributes are required in Magento 2. You can find a sample CMS page import table in our
If you still want to compose the table manually please refer to the following table:
Attribute Name | Reference | Values | Value Example |
creation_time | Created (in the CMS pages grid) | The date should be in the following format:
yy/mm/dd |
17/05/10 |
title | Page Title | Any text and symbol value | Sample page title |
identifier | URL Key | Lowercase letters and numerals, underscores and dashes allowed | sample_page_url |
store_view_code | Store view | The codes of the store views separated by commas.
Use ‘All’ to assign a CMS page to All Store Views. You can get the code of the store view at Stores > All Stores > click the required entity in the Store Views column and find the ‘Code’ field. The value in the ‘code’ field is the store view. |
All,default |
is_active | Enable Page | 1 – the CMS page is enabled
0 – the CMS page is disabled |
1 |
content_heading | Content Heading | Any text and symbol value | Sample content heading |
content | Content | Any text and symbol value. Simple HTML is allowed as when creating CMS pages. | <p>Hello, world</p> |
page_layout | Layout | 1column – 1 column layout
2columsn-left – 2 columns with left bar layout 2columns-right – 2 columns with right bar layout 3columns – 3 columns leave empty for empty layout |
2columns-left |
meta_title | Meta Title | Any text and symbol value | Sample page meta title |
meta_keywords | Meta Keywords | Any text and symbol value | sample,meta,keywords,of,the,CMS,page |
meta_description | Meta Description | Any text and symbol value | Sample page meta description |
layout_update_xml | Layout Update XML | XML | <referenceContainer name=right”>
<action method=”unsetChild”><argument name=”alias” xsi:type=”string”>right.reports.product.viewed</argument></action> <action method=”unsetChild”><argument name=”alias” xsi:type=”string”>right.reports.product.compared</argument></action> </referenceContainer> |
custom_theme | Custom Design Update > New Theme | The path to the theme which can be found under Content > Themes > Theme Path (in the grid) | Magento/luma
3 |
custom_root_template | Custom Design Update > New Layout | 1column – 1 column layout
2columns-left – 2 columns with left bar layout 2columns-right – 2 columns with right bar layout 3columns – 3 columns leave empty for empty layout |
3columns |
custom_theme_from | Custom Design Update > From | The date should be in the following format:
mm/dd/yy |
3/2/19 |
custom_theme_to | Custom Design Update > To | The date should be in the following format:
mm/dd/yy |
3/29/19 |
Now, that you have every attribute reference, you can manually compose the Magento 2 CMS page import table.
NOTE: pages composed with Page Builder have the same attribute formatting. The content is stored in the ‘content’ column and has the same formatting as a CMS page you compose manually. It means that the Improved Import and Export extension supports pages composed with Page Builder.
Magento 2 CMS Page Import Job
Now that you have your import table ready you can start creating an import job. To do this, log in to your Magento 2 admin panel and navigate to System > Improved Import / Export > Import Jobs.
Here, at the Import Jobs grid, you need to click the ‘Add New Job’ button.
General Settings: Automate Magento 2 CMS Page Import
General Settings are the very first section you see while configuring a new Magento 2 CMS page import job.
Here you need to specify a Job Title and decide on the job’s schedule if you need to automate the import of Magento 2 CMS pages.
Import Settings: Choose Your Magento 2 CMS Entity
Next comes the Import Settings section where you need to select an import entity. You can import Magento 2 CMS pages, blocks, and widgets separately:
For instance, choose CMS pages from the Entity dropdown.
Import Behavior: Add New or Update Existing CMS Pages
Then, scroll down to the Import Behavior section.
In this section, you need to specify the behavior of the job: it is possible to add new and update the existing CMS pages or replace the existing content with the provided update.
Then, decide what Validation Strategy the job should stick to.
Import Source: Provide Magento 2 CMS Page File
Now, you are in the Import Source section.
Specify the file type you will be using to import CMS pages to Magento 2. Our extension supports CSV, XML, XLSX, ODS, and JSON.
Next, select the source you will be importing from. You can provide your update manually, over FTP/SFTP, download it from Dropbox, or import the corresponding data straight from Google Sheets.
Click the ‘Validate file’ button – the extension will check the import table for proper formatting.
Map Attributes: Import Any Third-Party CMS Pages
The last section to pay attention to is Map Attributes.
Here, you can map custom attributes to the ones required in Magento 2. Just choose a system attribute and specify a corresponding column name from your import table. Also, you can use default values for empty rows in your Magento 2 CMS page import table.
You can also select the platform you are importing CMS pages from in the Select A Platform field. The extension will load the attribute mapping list automatically.
Note, that you can freely import pages created with Magento 2 Page Builder. The Improved Import and Export extension for Magento 2 supports Page Builder data. Use the same attributes that we described above.
That’s it for the import job. You can now hit the big orange ‘Save and Run’ button at the top-right corner of the screen to the Magento 2 CMS page import. Improved Import and Export extension will take care of everything else.
Final Words
Magento 2 CMS pages are an inevitable part of every e-commerce website. You can easily create and manage them. And if you need to import the corresponding data, the Improved Import & Export extension is at your disposal. The module lets you import and export pages, blocks, and widgets used in Magento CMS. You can find more tips on data transfers in our Magento 2 import/export guide list. For more information about our Magento 2 importer, follow this link:
Get Improved Import Magento 2 Extension