Hello Devs, Today I am starting a new category blog. It’s based on the Hyva Theme. Magento 2 is very popular in the eCommerce fields. In the eCommerce field, Performance and Optimization with SEO friendly are the main things.
In this article, Today I will explain to you how to install Hyva theme in Magento 2.
Magento 2 has a default Luma theme. However, Hyva Theme is the best example for performance and optimization with SEO friendly. This theme is built from scratch using a completely blank theme. This theme is built by ViewModels, Alpine JS, & Tailwind CSS & layout.xml, require-js, knockout js, underscore js, and LESS are removed.
You may also like this :
Main things of Hyva Theme :
- To better performance
- To reduce complexity
- To reduce dependency
- To reduce render-blocking time.
Requirements of Hyva Theme :
- Magento 2.4.4 or Higher Version.
- A valid license for Hyvä Themes (Check here)
- For licensees: A Private Packagist Key
- For partners: Access to Hyvä Gitlab
- PHP 7.4, 8.1 or 8.2
Steps of How to Install Hyva Theme :
1) First, ensure you have installed Magento in your system. After that, you need to execute the below command to download Hyva theme using Composer:
composer config --auth http-basic.hyva-themes.repo.packagist.com token <YourThemeLicenceKey>
composer config repositories.private-packagist composer https://hyva-themes.repo.packagist.com/<yourProjectName>/
On the above command, you must set your theme’s license key and project name.
2) After that, Install the theme using the below command :
composer require hyva-themes/magento2-default-theme
3) Next, Run the below command :
php bin/magento s:up && php bin/magento s:s:d -f
4) After that, Go to Admin -> Content -> Design -> Configuration -> Edit your theme & Set Hyva Theme -> Save Configuration & Flush Cache.
Addition Steps :
As per the official Hyva doc recommended :
5) Please disable the default Magento Captcha using the below command :
php bin/magento config:set customer/captcha/enable 0
6) In addition, Hyva also recommends to disable Minify, merge & bundling using these below commands :
php bin/magento config:set dev/template/minify_html 0
php bin/magento config:set dev/js/merge_files 0
php bin/magento config:set dev/js/enable_js_bundling 0
php bin/magento config:set dev/js/minify_files 0
php bin/magento config:set dev/js/move_script_to_bottom 0
php bin/magento config:set dev/css/merge_css_files 0
php bin/magento config:set dev/css/minify_files 0
7) In Last, Ensure that these below modules are enabled because Hyva uses Magento default GraphQL
php bin/magento module:status Magento_BundleGraphQl Magento_CatalogCustomerGraphQl Magento_CatalogGraphQl Magento_CatalogRuleGraphQl Magento_CatalogUrlRewriteGraphQl Magento_ConfigurableProductGraphQl Magento_CustomerGraphQl Magento_DirectoryGraphQl Magento_DownloadableGraphQl Magento_EavGraphQl Magento_GraphQl Magento_GroupedProductGraphQl Magento_QuoteGraphQl Magento_GraphQlCache Magento_RelatedProductGraphQl Magento_ReviewGraphQl Magento_SalesGraphQl Magento_StoreGraphQl Magento_SwatchesGraphQl Magento_UrlRewriteGraphQl Magento_WishlistGraphQl
That’s it !!!
I hope this blog is easy to understand about how to install Hyva Theme in Magento 2. In case, I missed anything or need to add some information, always feel free to leave a comment on this blog, I’ll get back with a proper solution.
Keep liking and sharing !!!
