Setting up Hyvä Themes – A Beginner’s Guide | Hyvä Fridays

Welcome to Week 3 of Hyvä Fridays! If you’re new here, make sure to check out our previous posts where we introduced Hyvä and why it’s faster than traditional Magento themes. Today we’ll be going over the basics of setting up Hyvä. Whether you’re a developer or store owner, this guide will take you through the process of getting Hyvä on your Magento store.

| Envisage Digital

Why Should You Use Hyvä Themes?

Before we get started, let’s quickly go over why you should set up Hyvä: .

  • Speed: Hyvä makes your site load faster, which means better user experience and SEO.
  • Simplicity: The theme is lightweight and easy to work with, so development time is reduced.
  • Flexibility: Customising your store is way easier with Hyvä’s modern structure and Tailwind CSS.

Depositphotos 184364350 L 1 | Envisage Digital

Installing Hyvä Themes

Step 1: Magento 2 Environment

Before we begin, make sure you have a clean and working Magento 2 environment. If you’re migrating from another theme (like Luma), make sure to backup your store before starting the installation process. Here’s what you’ll need:

  1. Magento 2.4.x or higher – Hyvä works best with the latest Magento.
  2. SSH access – You’ll need this to install Hyvä via Composer.
  3. Composer – Make sure your Magento instance is using Composer for package management.

Now you’re good to go.

Depositphotos 185032830 L 1 | Envisage Digital

Step 2: Buy Hyvä License

Hyvä Themes is a premium product so you need to buy a licence before installation. You can buy it from Hyvä Themes website. Once you’ve done that you’ll get access to the theme’s repository.

After you have your licence, download the files or get your Composer credentials to start the installation process.

Step 3: Install Hyvä via Composer

Now you have your Magento 2 environment and Hyvä licence, it’s time to install the theme. Here’s the installation steps via Composer:

  1. Log in to your server via SSH.
  2. Go to your Magento installation root directory.
  3. Run the following Composer command to install Hyvä:
  4. # this command adds your key to your projects auth.json file
    # replace yourLicenseAuthentificationKey with your own key
    composer config --auth http-basic.hyva-themes.repo.packagist.com token yourLicenseAuthentificationKey
    # replace yourProjectName with your project name
    composer config repositories.private-packagist composer https://hyva-themes.repo.packagist.com/yourProjectName/
    composer require hyva-themes/magento2-default-theme
    
  5. Disable core Magento features that are unsupported/not required when using Hyvä Themes:
  6. bin/magento config:set customer/captcha/enable 0
    bin/magento config:set dev/template/minify_html 0
    bin/magento config:set dev/js/merge_files 0
    bin/magento config:set dev/js/enable_js_bundling 0
    bin/magento config:set dev/js/minify_files 0
    bin/magento config:set dev/js/move_script_to_bottom 0
    bin/magento config:set dev/css/merge_css_files 0
    bin/magento config:set dev/css/minify_files 0
  7. After installation, apply the theme and clear cache:
  8. bin/magento setup:upgrade 
    bin/magento setup:static-content:deploy 
    bin/magento cache:flush
    

Note: A more comprehensive installation guide can be found on the Hyva website.

Depositphotos 82473936 Xl 1 1 | Envisage Digital

Step 4: Set Hyvä as default theme

Now Hyvä is installed, you’ll want to set it as the default theme for your store. Follow these steps in your Magento admin:

  1. Log in to Magento Admin Dashboard.
  2. Go to Content > Design > Configuration.
  3. Edit the theme configuration for your store view.
  4. In the “Applied Theme” dropdown, select Hyvä.
  5. Save.

That’s it! Hyvä is now active on your Magento store.

Depositphotos 247183752 Xl 1 1 Scaled | Envisage Digital

Step 5: Customise and Optimise

Now you can start customising your store’s design. The theme uses Tailwind CSS so it’s super easy to customise. Whether you’re adding custom branding elements or adjusting the layout, Hyvä makes it easy to do so with minimal effort.

If you’re new to Tailwind CSS, there’s plenty of resources to get you started. The best part? With Hyvä’s lightweight structure, every customisation won’t slow down your store.

Step 6: Final Checks & Go Live

Before you go live with your new Hyvä store:

  • Test your site’s speed.
  • Check all customisations on different devices.
  • Test all pages and checkout process.

Im 04 | Envisage Digital

Ready to Transform Your Store?

Installing Hyvä Themes might look technical but it’s designed to be as easy as possible – even for a Magento newbie. As Hyvä Silver Partners in the UK we’re here to help you transition your store to Hyvä smoothly.

Need help with installation or customisation? Get in touch. Visit our Hyvä Themes services page or Hyvä Themes website for more information.

Stay tuned for next week’s Hyvä Fridays, where we’ll be comparing Hyvä vs. Luma: Performance and Technical Comparison.

Depositphotos 76358643 L 1 | Envisage Digital

Our Services

Latest Posts

Google Rating
5.0
Based on 30 reviews
×
js_loader