Magento base theme plays an important role in the market nowadays, have you ever wonder which theme should you choose for the first start?
As the whole world is heading to the Magento platform when finding a robust solution for their e-commerce stores. The next question is: how do websites in Magento 2 look like?
Magento 2 provides 2 Base themes: Luma and Blank.
In BSS Themes, we always try to help Magento 2 new users to make better choices regarding their whole website looks.
In this article, we will talk about the difference between the two themes that started them all: Luma and Blank.
As we have written in our guide to choosing a theme that fits your needs, there are three main areas of a theme that you should consider when buying a theme:
- What you see
- What you can configure
- How the theme developers support.
This article compares the two Magento 2 themes in three areas stated above.
Magento Base theme Luma and Blank: What do you see?
Obviously, the first thing you want to consider a theme is what it looks like.
Although a theme can contain how many views the developers want there are 6 pages that are critically important to any e-commerce store:
- Product Category
- Product detail
- Cart page
- Checkout page
- About page.
Each of the view stated above needs an independent layout and view, so users can identify where they are on your site.
You can have a very quick look at our website’s basic views here: our Homepage, our Product category, our Product detail, our Blog category, our Blog post, and our About page.
To examine our page’s Cart page and Checkout page, simply add any product to cart and view cart/check out.
As you can see, there is not much difference in the Homepage view of the two themes.
The design of both themes consists of Header, Footer, Main content elements.
The only difference is the top header and bottom footer element. In Luma, as a child theme of Blank, the design has been added with a little more contrast due to the grey-color top header and bottom footer.
In our opinion, the design of Blank is a little pale.
As you can see, in the product category view, the Luma theme has been improved a lot, comparing to its parent theme Blank.
The Layered Navigation on the left column has been compressed, providing a contemporary sense, making its parent theme seems so unorganized and obsolete.
Another small detail is that when you hover over a product in the Product category view, the Luma theme provides a shadow effect, while the original Blank does not.
There is also a lot of improvement in Luma in the Product detail view. Luma separates information into blocks, making the page more user-friendly.
As you can see, by just moving the Product name to the right column and the stock status to the right of that column, the product information is much more organized and easier to understand in Luma.
Luma emphasized product price, which is very important information about the product. This makes the user easier to notice and remember the product prices.
The Add to cart button is also enlarged, in our opinion, making the call to action clearer, and more appealing to click.
Lastly, Luma aligns the Add to wishlist, Add to compare and Email section into one line, with a small, elegant icon. This small detail also boosts user experience a lot.
The Cart page is also a very important page in your e-commerce store. The Cart page design does not need to have fancy effects. It just needs to function normally and has a look that synchronized with the rest of the site.
By examining the Cart page of both the Luma and Blank theme, we can see that the information on the Luma Cart page is more organized.
In comparison with Blank, Luma resizes the product name, estimated shipping, and tax, and order value text to have a stronger informational leveling system.
The previously out-of-place discount section is moved to the right column to fit in the summary block. Blank’s Edit and Remove item button is also replaced by icons to create a more visual sense.
The Checkout page is not very different in the two themes. The input name and the input field are made duel-line in Luma, while they are laid inline in Blank.
In Blank, there is not even an About page. There is only a Contact us page with almost no content but a form.
The About page view of Luma at least contains content that you can replace with your information.
There is also a boxed section, separating the content into easy-to-distinguish blocks.
Luma and Blank: What can you configure?
In short, what is configurable in these themes, stays configurable in any other Magento 2 theme.
On the other hand, there is no difference in the configurability of two Magento 2 default themes.
Let me demonstrate my point.
Firstly, because these two themes are in Magento 2 default package, they are made with demonstration purposes in mind, not configuration purposes.
Therefore, there are little-to-none configuration options for users in these themes.
Secondly, for people who doubt, let’s dive into configurability difference in two themes.
Since theme configuration is the main function of the theme, and the in Magento function files are either .php or .js, let’s look at those files difference in themes folders.
Unlike the third-party theme, the Magento 2 default themes are located in folder /vendor/magento.
The two theme folders are named theme-frondend-blank and theme-frontend-luma.
As we have looked into the two theme folders, we find only two JS and PHP files difference.
The first one is the navigation-menu.js that serves solely as the menu function of the Blank theme, located in theme-frontend-blank/web/js.
However, since Luma is Blank’s child theme, Luma can get this menu file in its parent theme, so there’s no difference in function here.
On the other hand, the only difference between registration.php in theme folder is link structure.
So as we can see, there is indeed no difference in the configurability of two themes.
Luma and Blank: What support do you get?
As we have known, Luma and Blank are the Magento base theme made for demonstration purposes.
In Magento 2 Community Edition, you can only have support from the Magento official support page.
There are 4 options:
- Browsing tech resources,
- Reading DevDocs,
- Finding in Magento Forums
- Hiring a consultation from a Magento partner.
Obviously, the theme developers provide no personalized support for this version.
In Magento 2 Enterprise Edition, you might receive support from Magento.
Magento Base Theme Comparison: In conclusion!
So that’s all we cover in today’s article. By now we hope that you have a decent understanding of like and the not-alike of the Magento base theme.
Again, for further exploration, you can always browse our cloud-based Luma theme demos and Blank theme demos right away.
Do you have any more questions about Luma and Blank? Let us know in the comment section below.
Also, if you want to add more beauty and flexibility to your new site’s design, you might want to consider a premium theme.
Premium themes are built to easily configure in the backend, beautiful in every small detail, and has great support.
Moreover, our newly launched theme provides free lifetime support for a limited number of customers.