Magento 2 Tutorials

Magento CMS, Blocks and Widgets To Easily Customize Your Store

Magento-CMS

The time-tested fact that Content is the King is still the cornerstone of online business. As you read these words, ecommerce stores all over the world still rely heavily on content to generate leads and drive revenues.

The success of the content is dependent upon its presentation. In fact, distinguishing content from the competition is all about discussing the customers’ pain points, and thus improving the visibility of the store in search results. For Magento powered stores, you can accomplish this by using the latest Magento CMS Blocks.

To present your content in the best way possible, there should be a proper use of visual, graphics and written content, along with the proper placement and timeline to give your visitors a clear picture for better understanding.

Magento CMS offers multiple functionalities that you can use to produce rich content for your ecommerce store. It also helps in the creation of new content or incorporate new content in the existing one.

Why Should You Choose Magento CMS for Ecommerce Store

Easy of Use: With Magento CMS one can easily add basic content or perform basic customizations through Magento static blocks or Magento widgets with ease. This does not require you to be having any technical knowledge.

Support: Magento has an amazing community support. Therefore, if you have any issues or difficulty in maintaining your Magento store, you can easily find answers to it or expect to have prompt support from the members.

SEO Optimized CMS: We all know that SEO optimized sites have better visibility on search engines. Magento offers SEO optimized CMS to get stores to easily rank on search engines.

Server Performance: Magento CMS offers great server performance. It is well optimized to reduce load on server(s), so that it remain stable even during unprecedented online traffic spikes. But for that you have to ensure that your server and store is properly optimized.

More Better CMS Options: All you get is more features and formats to choose from to customize your Magento store.

Mobile Friendliness: Magento CMS can create responsive mobile pages that can enrich the customers’ experience on any device they use. This is important as visitors will not leave the website because of a bad UI.

Are Server Issues Affecting Your Magento Ecommerce Store?

With managed cloud hosting, you don’t have to worry about server and store optimization issues anymore.

Try Cloud Hosting for Free

Magento CMS Tools

Here is a list of the Magento CMS tools, you can use to enhance the look of the page.

Pages: You can use Magento CMS to create a page for your store by including text, images, blocks, widgets and links to other pages.

Static Blocks: The CMS offers a Magento static block through which you can customize the created page content, or add a new content section to your page. You can use it to display promotional activities, or make your page more appealing.

Widgets: You can use widgets to display dynamic content and add blocks, links and interactive elements anywhere in your store by means of Magento CMS.

Create New Pages with Magento CMS

Category and product pages are automatically created when you add a new category or product to the store. The pages are designed according to the selected theme. If you wish you can edit the pre build pages by adding Magento static blocks or widgets to that page. We have already defined how to edit Magento Home page by means of static block and widgets. In the same way, you can edit other pages of your store. But what if some wants to create a new page in their Magento store? Let’s go through the process explaining how to create a new page with Magento CMS.

  • Login to your Magento admin panel
  • Goto Content section and select Pages

Magento CMS 1

  • Now give a Title to your web page that you have created through Magento CMS

Magento CMS 2

Magento CMS also gives you the features to add:

Content:

  • Mention the title of your content
  • You can edit content on the page with Magento CMS editor

Magento CMS 3

OR

  • Through the widget, image or variable block

Magento CMS 4

Page SEO:

Once you have placed the content on the webpage, you must optimize your web page for search engine(s).

Magento CMS 5

  • Enter the URL key for the page based on the title you have given to your page.
  • Write the Meta Title, Meta Keywords and Meta Description to optimize your page for SEO

Define Magento CMS Page View

  • Next, you will define the Store View for your created pages like main website, MultiStore or StoreView

Magento CMS 6

Magento CMS Page Design

  • Define the page layout. The process mentioned below explains how to display content on your web page.

Magento CMS 7

Page Custom Design

  • Through this feature you can use a custom template for your page, and if you wish you can schedule the custom design for a specific time period.
  • Once you have created your page and filled up the required information, you can Save your page.

Magento Widgets

Widget is a code snippet that allows you to add different types of content to a specific block or section of the Magento store. By using widgets, you can display your interactive content to your store visitors and keep them engaged on your site through review system, video chats, voting, and subscription forms, navigation elements, image sliders, or display promotional content.

Widget Types

List of Magento widgets you can use to display content on your blog. Here is brief introduction to of all of them.

CMS Page Link: Used for displaying links to a selected page. You can define it’s custom text and title. It can also be used in content pages and blocks.

CMS Static Block: It is used to display Magento static block at a specific location on a page.

Catalog Category Link: It is used to display specific category link either display them inline or in a block style.

Catalog New Products List: Displays block of newly listed products.

Catalog Product Link: Used to display specific product on a selected catalog page.

Orders and Returns: This widget is for guest users to see the status of their orders or to return a specific product to the merchandiser.

Compared Products: Through this widget, you can compare products which are similar to the one you are viewing. You can define it for all, or for a specific product section, and display them as a product grid or list.

Magento CMS 8

Recently Viewed Products: It is used to display products which are recently viewed on your store. You can define it for all or to specific section only and display them as a product grid or list.

Create a Magento Widget

1) Login to your Magento admin panel

2) Select Content -> Widgets

3) On the top right corner click on Add Widget button

4) Now select the widget Type and Design Theme for its display. Once done, click on Continue button

Magento CMS 10

5) In Storefront Properties, set the Widget Title, select the Store View and write the Sort Order when listed with other widgets too.

Magento CMS 11

6) In the Add Layout Updates

  1. Display on section defines where you want to display the widget
  2. Select whether you want to display it everywhere or on a specific location
  3. Then select product list that you want to display

Magento CMS 12

7) In Widget Options, Select Block which you want to use to display your content

8) Once you are done, click the Save button

Magento Static Block

Magento CMS 13

Screengrab of a website showing Magento dynamic content view.

A Magento static block is either used to display dynamic content or static content in the form of text, images, videos or dynamic information. Magento offers a variety of static blocks that can make it easy to add features and functionalities to your store. Some built-in blocks are essential components of your store, while others are shopping tools that you can show or hide as per your preferences. You can also use custom static blocks for any page, group of pages, or even for another block. Simply define the static blocks with HTML and CSS.

How to Create a Magento Static Block

1) Login to your Magento admin panel

2) Select Content -> Blocks

3) On the top right corner click on Add New Block button

4) In Block Title define a title to your static block

5) Define Identifier for your block. The characters should be unique and in lowercase so that the Identifier can reference it easily

6) Select the store view for the static block and where it will be displayed

7) Place the content within the block. You can either use an editor or place the content directly in your block

8) Click on Save at the top right corner

Magento CMS 14

Difference Between Magento Widget and Magento Static Block

Most people are confused between Magento static block and Magento widget, and don’t know which Magento CMS to use and for what purpose. Here is the difference between both of them.

Magento Static BlockMagento Widget
The static blocks can only be defined for specific page types and sections.Can place different widgets in different sections of different pages using the backend UI.
You can publish custom content of any type.Has a fixed content type; cannot have custom content.
Have flexible static blocks which are used to display custom content, child blocks or widgets.Can only contain a block widget (a small script that renders a block).

 

Wrapping Up

By now you must have understood what Magento CMS block is, and when to use it.

The need of a CMS in Magento has become essential because of all the customization options the store owners need. Magento CMS Block allows you to display variety of content without the need of any technical knowledge, hence adding more value to your ecommerce store.

If you have any query, let us know through the comment box below.

Subscribe Newsletter

Subscribe to get latest Magento news

40% Off for 4 Months on Magento Hosting + 30 Free Migration