Monthly Archives: April 2023

Hello, dear friends,  

Today we’d like to tell you more about all the latest updates we at Magefan have been working on this April.

Let's go!

Magento 2 Google Tag Manager Extension

New features of the Google Tag Manager for Magento 2!

In the latest version, we added new tracking for sign-in, creating an account and searches (features are available in GTM Extra version). Also, the extension is now compatible with the Hyva Theme.  We improved compatibility with Magento 2.3.x. 

In the last version, we also fixed the JS error on the checkout page when the module is disabled in the admin panel (in GTM Plus version). Another fix of an issue to when instead of brand name dataLayer contained just brand ID was made in the recent version.

Magento 2 POS

New features of the Magento 2 Point of Sale (POS)!

In the latest version of Magento 2 POS System Plus, we added a customer search by VAT or Company name. Also, we added the display of customer VAT and Company name on customer search results

Since it is in our nature to "follow the crowd" and do what others do, people like to read what others read, when it comes to blogs. In Shopify Blog App, except for the recent posts and featured posts widgets, you can also display popular posts. 

Unlike other posts in a blog sidebar, you can't choose what is displayed as popular posts. The app calculates the views and displays the most viewed articles as popular posts. 

Today, you'll learn how to set it up. 

To display popular blog posts in Shopify:

1. Navigate to Apps > Magefan Blog > Configuration > Sidebar, find the Popular Post Widget and enable it.
2. Choose a Template for the widget and enable the Post Image.
3. Set the Number of Posts you'd like to display in the popular posts section on the frontend. 
4. Set the Sort Order. 

Don't forget to Save the setting

Although comments are one of the best ways to engage with your audience and get feedback on your posts, there always are some irrelevant ones. Malicious actions, spam or simple typos could be the reason why you need to edit or delete comments in the Shopify blog. 

While you usually need an additional app to edit blog comments in Shopify, you can forget about this with the Shopify Blog App. It already has 3 built-in types of blog comments: Facebook, Disqus and Magefan. 

So, if you want to edit, approve or delete comments before publication, you need Magefan comments. Let's find out how you can configure and use them.

How to Enable Blog Comments in Shopify?

To use comments in your Shopify blog, you need to enable them first. For that go to Apps > Magefan Blog > Configuration > Post Page (Post View) > Comments and choose to Use Magefan Blog Comments.

Here you also need to specify the Number of Comments and the Number of Replies to comments you want to allow for a blog post. 

How to

Running a Magento 2 store may not be as easy as it seems. There are lots of things you have to take care of, such as sales, orders, clients, etc., to say nothing of the development part. You should know how to run static content deploy or reindex Magento 2, as well as be aware of some other commands.

It's impossible to keep in mind all the commands for every single situation when you just start. So, that's why we created a list of useful Magento 2 commands that will save time and lessen the possibility of any errors. 

Want to know more about Magento commands? Keep reading, this article is just what you need. 

SSH

Cache

Just like in catalogue search, the blog search bar in Shopify helps your readers to find relevant posts faster and navigate through them more easily. As you might know already, the default Shopify search bar is outdated and requires a lot of steps to modify, let alone implement in your blog.

So, for those of you who don't want to spend tons of time on development, we introduce Shopify Blog App. It allows you to add a search bar to the Shopify blog.

Today, you'll learn how to enable blog search in Shopify and how to integrate it with Shopify catalogue search.

Add Search Bar in Shopify Blog

1. Navigate to Apps > Magefan Blog > Configuration and find the Sidebar section. 

2. Unfold the Search Form section, enable the widget and set a Sort Order for it.

Don't forget to Save the settings and that's it. Nothing else is required.

Getting your Facebook Ads to work is not a piece of the pie. Without accurate insights into customers' behaviour, setting up effective Facebook campaigns is going to be challenging. 

That's why you need Facebook pixel — a small piece of code that makes a huge difference. You add Facebook pixel in Magento 2, allow it to track information about different events customers perform on your website and send it to Facebook Ads Manager. 

It is easier than it sounds! And it works perfectly together with the Facebook Conversions API.

In this guide, we'll walk you through each step you need to take to make Facebook pixel work. You'll learn how you can set up a Facebook pixel in Magento 2 with no technical skills, using only Magento 2 Facebook Pixel Extension.

1. Install Facebook Pixel Extension

Unless you don't want to implement Facebook pixel tracking code directly into the source code, you need a little help. Install Facebook Pixel extension and you'll be able to configure everything from the

While there is a multitude of Magento 2 themes available on the market, you might still want to create custom theme for your store. Why? Templates, layouts, graphics and styles offered in a theme don't always satisfy your business requirements. Besides, the default Magento 2 themes Luma and Blank won't suffice if you're starting an Ecommerce website.

So, to create custom Magento 2 theme that conveys your brand's "feel" you need to resort to custom development.

In this guide, we'll walk you through all steps you need to take to create a theme for Magento and cover the basics of how to override basic and theme layouts. 

Ready to start?

Before Custom Theme Development in Magento

The first important thing to remember before starting theme development in Magento is that you shouldn't change or edit the default Luma and Blank theme files. If you customize the default

Magento flexibility allows you to display CMS blocks in a multitude of ways. However, for those of you with technical knowledge, there are only two options.

You can either call CMS blocks in the XML layout, or call them in the PHTML file. Today we'll focus of the second one.

Call CMS Block in PHTML File

To programmatically call the CMS block in .phtml template file use this code:

<?php
    echo $this->getLayout()
        ->createBlock(\Magento\Cms\Block\Block::class)
        ->setBlockId('my_cmsblock_identifier') //replace my_cmsblock_identifier with real CMS bock identifier
        ->toHtml();
?>

Using createBlock method is fast but not ideal in terms of best practices.

So what you can do is add a CMS block into your block using layout. Use the following code in a proper layout XML handle file and don't forget to flush

 Although Magento 2 CMS blocks are managed directly from Magento admin using widgets and WYSWYG editor you can add them other ways too.

If you have some technical skills you can just call CMS block in Magento using the XML file.

Call CMS Block Using XML File

Use the following code to add CMS blocks using Magento 2 layout XML:

<referenceContainer name="content">
  <block class="Magento\Cms\Block\Block" name="unick_block_name">
    <arguments>
      <argument name="block_id" xsi:type="string">my_cmsblock_identifier</argument>
    </arguments>
  </block>
</referenceContainer>

You need to replace "my_cmsblock_identifier" with your CMS block Identifier or ID (we recommend using Identifier). 

Display CMS Blocks Dynamically (by Date)

Even if you add CMS blocks programmatically using the XML file, they will still be static. It means that you'll need to replace the identifier or disable a block manually. But not if you use the Magento 2 Dynamic Blocks.

This way, you can display your CMS blocks dynamically,

Although adding CMS blocks in Magento 2 using widgets is the most popular way, there are some other options. If you want to add CMS blocks to a CMS page or blog the best way is to add them using the WYSIWYG editor or page builder. 

Today we'll cover both cases. However, if the target page is a product category, try adding CMS blocks through category settings.

 Insert CMS Blocks Into the WYSIWYG Editor

 Before we start, you need to create a CMS block, since the WYSIWYG editor uses widgets to display them.

1. Navigate to Content > Pages, select the CMS page you want to display the CMS block on and choose Edit in the Actions.

2. Find the Widgets tool in the Content section to insert the widget.

3. Set the CMS Static Block as the Widget Type to continue.

4. Choose the widget Template and Select a Block from the list of CMS blocks. Then hit Insert Widget.

3. Don't forget to Save your page.

If you prefer the video instructions on how to insert CMS block into the WYSIWYG editor, watch

Choosing the right theme for your store is one of the first steps you take when creating an eCommerce website. It should not only represent your brand using custom layouts and templates but be user-friendly, fast and SEO-optimized.

The variety of Magento 2 themes on the market is growing. It allows you to find any theme you want on Magento Marketplace or Theme Forest. And once you make up your mind and choose the best Magento 2 Theme, you need to know how to install and apply it to your store. 

Since Magento has deprecated the WebSetup Wizard starting from Magento v2.3.6, you can now install Magento 2 theme only in the command line: via composer or archive. In the first case theme files will be located under vendor and, using the archive, you can find the theme files under app/design. 

Install Magento 2 Theme via Composer

Before you install a theme in Magento 2, it is recommended to switch to developer mode.

1. Navigate to your Magento 2 root directory, using "cd" and run the following

When it comes to purchasing decisions, customers pay attention to a lot of things in your store. Loading speed is one of the most important ones. While you can improve website speed by reducing the size of images or disabling the JS bundling,  it is not always enough. 

So, today we want to drive your attention to the page element that always gets overlooked when it comes to speed optimization — CMS block. You'll learn how to optimize the loading of CMS blocks in Magento using Dynamic Blocks.

The Uses of Ajax Requests

We've created two CMS pages with the same content: a banner and a product slider. One page contains a CMS block with default display mode, second — a CMS block with display mode Ajax load on first scroll.

Now, let's compare display modes Default and Ajax load on the first scroll.

CMS Block - Products Included In DOM

CMS Block - Products Loaded Via Ajax Request

If you decided to remove the Optimized Magento 2 Theme by Magefan, please follow the steps below. You can contact our team for a free consultation in case you have any issues with Magefan's theme.

Remove Theme Files

1. If you can find the theme files in the folder

app/code/Magefan/ThemeOptimized
app/design/frontend/Magefan/optimized

then remove these folders. Also, you can remove other Magefan modules you don't need in the app/code/Magefan.

2. If the theme was installed via the composer and its files are located in the folder

vendor/magefan/theme-frontend-optimized

then run the composer CLI command to remove it

composer remove magefan/theme-NAME
# replace NAME with:
# frontend-optimized - for Optimized Magento 2 Theme
# frontend-optimized-plus - for Optimized Magento 2 Theme Plus

Once extension files have been removed, run these Magento CLI commands:

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy

If you need to update the Optimized Magento 2 Theme by Magefan, please follow the steps below.

Update using composer

If the Optimized Magento 2 Theme was installed via the composer (check if vendor/magefan/theme-frontend-optimized folder exists), then you need to run these simple CLI commands in Magento 2 directory:

composer remove magefan/theme-NAME
composer require magefan/theme-NAME ^x.x.x
# replace NAME with:
# frontend-optimized - for Basic plan
# frontend-optimized-plus - for Plus plan
# replace x.x.x with the version you want to use
php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy

Update using archive and FTP

If the Optimized Magento 2 Theme was installed via FTP (check if app/code/Magefan/ThemeOptimized folder exists),

You can install Optimized Magento 2 Theme by Magefan, using the composer or archive installation method.

Installation via composer (recommended)

1. Open command line.
2. Using command "cd" navigate to your Magento 2 root directory.
3. Run CLI commands:

composer require magefan/theme-frontend-optimized
# Authentication required (repo.magento.com)
# Get your Magento Marketplace authentication keys or use these: 
# Username: 7c018006799466c681ad507e27904677
# Password: 289077c86e811661a8f7751828485d3a
php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy 

Displaying CMS blocks on category pages has a lot of benefits. You can drive customers' attention to special offers, discounts or news within a particular category.

Besides, it is super easy to add CMS blocks to categories in Magento. However, note that Magento categories dedicate only a certain place on the page for promo banners. 

So if you want your block somewhere other than the top main area, try adding it using widgets.

Add CMS Blocks to Categories in Magento

If you've created categories already, you've probably seen the CMS blocks on the category settings.

1. Navigate to Catalog > Categories and choose the Category you want to display the CMS block on.

2. Select the CMS block you want to add in the Content section.

3. Set the Display Mode to Static block only or Static block and products in the Display Settings. 

4. Save a category and check your CMS block on the storefront.

Add CMS Blocks to Categories Dynamically

The best promo banners (CMS blocks) target the right people

Even though you improve product page SEO and focus on getting more organic traffic, sometimes you need to change your approach to increase conversions.  While SEO will help you to drive traffic to your store, it doesn't guarantee this traffic will bring conversions.

So, if you want to improve the conversion score, since there are people who browse your website but buy nothing, you've landed on the right page.

Today we want you to learn more about Google Ads Dynamic Remarketing and help you to set it up for your store with Magento 2 Google Tag Manager.

Before we start, let's define what dynamic remarketing is and how it is different from remarketing.

What is Google Ads Dynamic Remarketing?

Google Ads dynamic remarketing is the campaign you can set up to display personalized ads to people who visited your website previously but didn't make a purchase.

Unlike remarketing, dynamic remarketing allows you to go one step further and display ads with products and services people visited. 

Magento 2 CMS blocks are a great way to drive customer's attention to certain products, offers, or services. Although creating these blocs is super easy, adding them to Magento pages poses a challenge. Why? Because there are different ways to add CMS blocks to pages in Magento. 

Today we'll cover the most popular one — widgets. This method is the most popular since it allows you to choose the exact page and location to add CMS blocks. However, if you want to add CMS blocks directly to the page content, use the WYSIWYG editor.

Should we start?

Display Magento CMS Blocks Using Widgets

1. Navigate to Content > Elements > Widgets and press the Add Widget button.

2. Choose the CMS Static Block as a Type, set the Design Theme and press Continue.

3. Fill out the Storefront Properties.

• Give your widget a Title.
• Assign it to Store Views it should be active on.
• Set the Sort Order.

Configuration of the store URLs in Magento 2 is one of the first steps you'll take while setting up eCommerce store with Magento. Once you configure base and admin URLs, it will be easier to move an entire store from one location to the other without having to update the URLs.

Besides, understanding the Magento URL structure is an advantage while developing a store. In this article, you'll find the steps on how to configure Magento store URLs, as well as some other recommendations. 

Ready? Let's begin! 

Types of URLs in Magento 2

After you install Magento, you'll get a storefront base URL and admin URL. All the internal links are then defined with the help of the variables added to the base URL. This pattern is rather convenient since it enables you to move your store to a different location without changing all the links.

In general, there are 3 types of URLs in Magento. 

If you're a Magento developer, you certainly know that effective store management often requires programming work. There are lots of tasks you need to perform — from running static content deploy and optimizing Magento 2 reindex to getting current products and media URLs. Some of these are rather time-consuming or even complicated at times.

However, it is much easier if you know the proper methods to use.

In this article, in particular, you'll learn how to get media URLs in Magento 2. 

Get Media URL Using Dependency Injection 

The dependency injection method is among the most common ones when it comes to getting media URLs in Magento.

So, to apply it, go to your phtml block file and create a _construct function:

    public function __construct
    (
        \Magento\Store\Model\StoreManagerInterface $storeManager
    ) {
    $this->_storeManager = $storeManager;
    }

After that you can get a media URL in your phtml file:

$mediaUrl = $this ->_storeManager-> getStore()->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);

The russian full-scale invasion of Ukraine began on February 24, 2022. It was a day that changed us and our way of living. We thought these terrific events would last for a few days or at least a month. Unfortunately, this horrible war that has already taken so many lives of adults and children has lasted for a year and is still not over.

Donations have become a part of Ukrainians’ ordinary lives throughout this year.

And Magefan is not an exception. Our company keeps working and donates to the humanitarian aid organizations.

Here are some main foundations we support with our monthly donations.

Comeback Alive Fundation

Comeback Alive is one of the biggest Ukrainian charitable foundations. Ukrainians and people from around the globe had donated to this fund over 140 million dollars since February 24, 2022.  The main project of this fund is Army Assitance. This is also one of the first charity funds that has been providing army assistance since 2014 when russia first invaded Ukraine.