Page 3 - Ihor Vansach

In the  we explained how to configure and delimitate access rights for the Magento 2 admin panel users. In this article, you will learn how to create your own access rules (Role Resources). You need to create ACL file (ACL - Access Control List) in the folder: etc/acl.xml add the following code there: <?xml version="1.0"?><config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Acl/etc/acl.xsd">     <acl>         <resources>             <resource id="Magento_Backend::admin">                 <resource id="Magento_Backend::content">                     <resource id="VendorName_ModuleName::key1" title="Title 1" sortOrder="10">                         <resource id="VendorName_ModuleName::key2" title="Title 2" sortOrder="10" />                     </resource>                 </resource>                 <resource id="Magento_Backend::stores">                     <resource id="Magento_Backend::stores_settings">                         ihor

To find the Magento 2 configuration page navigate to Magento 2 Admin Panel > Stores > Configuration. All tabs and forms on this page are customized using this file etc/adminhtml/system.xml that the majority of  contains. Add the following code to the system.xml file in your module to create your custom section: <?xml version="1.0"?><config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">     <system>         <tab id="tab_id" translate="label" sortOrder="110">             <label>My Tab</label>         </tab>         <section id="section_id" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">             <class>separator-top</class>             <label>My Section</label>             <tab>tab_id</tab>             <resource>VendorName_ModuleName::acl_path</resource>             <group id="group_id" translate="label" type="text" sortOrder="10"ihor

To add a new table to the Magento 2 database, you need to create a file in the folder: app/code/<VendorName>/<ModuleName>/Setup/InstallSchema.php add the following code to it: <?php namespace VendorName\ModuleName\Setup; use Magento\Framework\Setup\InstallSchemaInterface;use Magento\Framework\Setup\ModuleContextInterface;use Magento\Framework\Setup\SchemaSetupInterface;use Magento\Framework\DB\Adapter\AdapterInterface; class InstallSchema implements InstallSchemaInterface{     public function install(SchemaSetupInterface $setup, ModuleContextInterface $context)     {         $installer = $setup;         $installer->startSetup();         //new table script will be there         $installer->endSetup();     }} InstallSchema.php — is a file that is responsible for modifying the database structure during module installation. When executing the CLI command php bin/magento setup:upgrade Magento 2 checks whether a new module has appeared in the system and if it contains theihor

Since you already know how to and to display the "Hello World" text on your own page, in this article we will show you how to display it in the new block. 1. Add a new PHP class block. Create this file: app/code/<VendorName>/<ModuleName>/Block/SomeName.php and add the following code to it: <?php namespace VendorName\ModuleName\Block; class SomeName extends \Magento\Framework\View\Element\Template{    public function getWelcomeText()    {        return 'Hello World';    }} where,  SomeName is a random name in CamelCase format.\Magento\Framework\View\Element\Template — a class from which you inherit your own block that interacts with the template.getWelcomeText — a public method we created to return the text "Hello World". You can create a name for it yourself. 2. Add a template file (template .phtml file) Create this file: app/code/<VendorName>/<ModuleName>/view/frontend/templates/some-name.phtml and add the following code there: <h1><?php echo $block->escapeHtml($block->getWelcomeText())ihor

To display "Hello World" on your own page in Magento 2, follow these steps: 1. Register a router for the storefront. Create this file: app/code/<VendorName>/<ModuleName>/etc/frontend/routes.xml and add the following code there: <?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd"> <router id="standard">        <route id="VendorName_ModuleName" frontName="path">            <module name="VendorName_ModuleName" />        </route>     </router></config> You can use the developer name (VendorName) associated with the module name (ModuleName) as the router id. The frontName is used in the URL to access your controllers. Both names have to be unique. 2. Create a controller. Add the new file: app/code/<VendorName>/<ModuleName>/Controller/Index/Index.php add the following code in it: <?php namespace VendorName\ModuleName\Controller\Index; class Index extends \Magento\Framework\App\Action\Action{ihor

To create basic Magento 2 module you need only 2 files: module.xml and registration.php. 1. Firstly, create the : app/code/<VendorName>/<ModuleName>/ and the folder that will contain the module configuration files: app/code/<VendorName>/<ModuleName>/etc/ If the app/code folder is missing from your Magento 2 installation, please create one. 2. Place the module.xml file with the following contents in the app/code/<VendorName>/<ModuleName>/etc/ folder <?xml version="1.0"?><config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">     <module name="VendorName_ModuleName" setup_version="2.0.0">         <sequence>             <module name="Magento_Cms"/>             <module name="Magento_Catalog"/>         </sequence>     </module></config> sequence is not a required element and is intended to define the modules which your module depends on. If the dependencies are unknown, they can be specifiedihor

As you may know extension by Magefan was integrated into the Magento 2.4.0 core, and we transferred the copyright for "Login as Customer" extension to Adobe. More about it you can read in the article about . So if you use Magento 2.4.x or greater you have 2 options: 1. and use core Magento Login As Customer 2. Disable core Login As Customer and continue using original Magefan Login as Customer. To disable core modules you can run these commands: bin/magento module:disable Magento_LoginAsCustomerbin/magento module:disable Magento_LoginAsCustomerAdminUibin/magento module:disable Magento_LoginAsCustomerApibin/magento module:disable Magento_LoginAsCustomerAssistancebin/magento module:disable Magento_LoginAsCustomerFrontendUibin/magento module:disable Magento_LoginAsCustomerLogbin/magento module:disable Magento_LoginAsCustomerPageCachebin/magento module:disable Magento_LoginAsCustomerQuotebin/magento module:disable Magento_LoginAsCustomerSales Since there are different Magento versionsihor

This year Magefan is proud to be among the Silver Sponsors of an online MageCONF that will take place on October 24, 2020. Mageconf 2020 is a must-attend online conference that allows you to dive into the world of unique shared experience presented by Magento expert agencies, service providers and developers, learn about the latest eCommerce trends and innovations. Register now for free. Don’t miss it!

In case you use one of the Amasty extensions, e.g. Amasty Layered navigation, you may face the issue of the broken blog featured images after the upload. We have found the issue in Amasty_Shopby extensions, that breaks some other extensions using image upload functionality, including our . Amasty_Shopby in this file: app/code/Amasty/Shopby/etc/adminhtml/di.xml adds the plugin to Magento\Catalog\Model\ImageUploader model. Judging from the code in the following file: app/code/Amasty/Shopby/Plugin/Catalog/Model/ImageUploaderPlugin.php it looks like some fix Amasty added for Magento 2.3.4. and the issue lies in the plugin beforeMoveFileFromTmp. The original Magento MoveFileFromTmp declaration looks like this: public function moveFileFromTmp($imageName, $returnRelativePath = false) and Amasty's plugin missing the second parameter $returnRelativePath: public function beforeMoveFileFromTmp(\Magento\Catalog\Model\ImageUploader $subject, $path) So, basically, Amasty's plugin kills the second functionihor

If you face an unexpected 301 or 302 redirect in Magento 2 and you don't know why it happens or what code causes it, you can easily find this out by temporarily editing the following files: /vendor/magento/framework/HTTP/PhpEnvironment/Response.php /vendor/magento/framework/Controller/Result/Redirect.php Open Response.php and add the following line to the beginning of the setRedirect function: var_dump($url); \Magento\Framework\Debug::backtrace(false, true, false); exit(); Example: public function setRedirect($url, $code = 302){ var_dump($url); \Magento\Framework\Debug::backtrace(false, true, false); exit(); $this->setHeader('Location', $url, true)       ->setHttpResponseCode($code); return $this;} Now open the second Redirect.php file and add this:  var_dump($this->url); \Magento\Framework\Debug::backtrace(false, true, false); exit(); after each line containing: $this->url =  Example: public function setRefererUrl(){     $this->url = $this->redirect->getRefererUrl();ihor

There are situations in Magento 2 when page keeps loading and then you get 500 fatal error, memory limit, or timeout error. This is an infinite loop in the PHP code, when the same code is executed over and over again. It is related to some core Magento issues or, most likely, third party extension. To debug an infinite loop and find the loop entrance, please follow the steps below: 1. Open the app/bootstrap.php file and add this code right after PHP open tag <?php in the next line $_SERVER['MAGE_PROFILER'] = 'html'; 2. Open the vendor/magento/framework/Profiler.php file and add this code to the beginning of "public static function start($timerName, array $tags = null)" function, e.g. private static $firsttime = null; public static function start($timerName, array $tags = null){    if (!self::$firsttime) {         self::$firsttime = time();     }    if (time() - self::$firsttime > 10) { //10 - is seconds to wait         \Magento\Framework\Debug::backtrace(falseihor

In case you work with a lot of different Magento instances as a temporary project you might want to have a nice method to check debug backtrace of some function execution in Magento 2 quickly without installing or enabling additional software on the server, e.g. Xdebug. In this case, you can use the native Magento backtrace function from \Magento\Framework\Debug class and call it whenever you need: \Magento\Framework\Debug::backtrace(false, true, false); As a result, you will get this nice HTML debug-backtrace: You can also call the exit function to stop further code execution right after the backtrace. Here is more information about the backtrace method: /** * Prints or returns a backtrace * * @param bool $return return or print * @param bool $html output in HTML format * @param bool $withArgs add short arguments of methods * @return string|bool */ public static function backtrace($return = false, $html = true, $withArgs = true) Additional Debug Backtraceihor

Having your online store secure and with fewer bugs is one of the top priorities of each merchant. You can achieve it by updating Magento and . It's a relatively easy task for the experienced developer. But updating an extension in Magento can be challenging if you perform it for the first time. So it's important to know the precise steps you have to take. Note: the update instructions usually depend on the method used to . Update Extension in Magento via Composer If the extension files are located in the folder vendor/company/module-name, then the extension was installed using the composer. So you need to use the following steps: 1. Open CLI (Command Line Interface). 2. Navigate to Magento 2 root folder. 3. Run the following commands: composer remove company/module-namecomposer require company/module-name ^x.x.x# replace x.x.x with the version you want to usephp bin/magento setup:upgradephp bin/magento setup:di:compilephp bin/magento setup:static-content:deploy Note: if you don't wantihor

If you use  with attached featured images to a blog post but these images are not displayed on the storefront, then most likely the issue is in your theme. A lot of themes provide custom blog layouts and template files that override the original view and can miss some blog functionality like featured images. To check and fix this, please follow steps below: 1. Open this file if exists (if does not exists skip steps 2-3): /app/design/frontend/[ThemeVendor]/[themename]/Magefan_Blog/templates/post/list/item.phtml 2. Check if the file has the code like "getFeaturedImage". You can find the original code here  https://github.com/magefan/module-blog/blob/master/view/frontend/templates/post/list/item.phtmlhttps://prnt.sc/tcl3sj 3. If this code is missing, add it to your custom theme file. 4. Open this file if exists (if does not exists skip steps 5-6): /app/design/frontend/[ThemeVendor]/[themename]/Magefan_Blog/templates/post/view.phtml 5. Check if it has  the codeihor

"There has been an error processing your request" is one of the most messages you can receive when working with Magento 2.  Here is an example of this message: What are the most common reasons for "There has been an error processing your request" message to appear? Installation of the new Magento 2 theme or extension. Updating Magento 2 or Magento 2 extension. Changes in the template code. Setting configuration. Overloading of the server memory. So, if any of the above-mentioned points are due you will see the default Magento error message "There has been an error processing your request". After that exception printing is disabled by default for security reasons.  Though you see this message you don't know what error is there to be fixed. In order to fix it, you need to find out the source of the problem first. Fix "There has been an error processing your request" issue  Take the following steps to fix "There has been an error processing your request" issue in Magentoihor

Basic Linux Commands pwd - displays information about the current location in the file system (the path of the directory (folder) you are in); dir, ls - shows a list of files and folders in the current directory; cd - (change the current directory) allows you to move to another folder; Example: cd ../ - will move to a folder on a higher level;cd foo - will go to the child folder "foo";cd /var - will go to the "var" folder located in the root of the file system; touch fine_name - create a new file named "fine_name"; mkdir dir_name - create a new folder "dir_name" in the current directory; rm file_name - delete the file "file_name"; rm -r dir_name - delete the folder "dir_name"; cp origin_name new_name - copy files and folders; mv old_name new_name - move files and folders; ln -s origin_name link_name - create a symbolic link; Search by Content To search for a file by content, use this command: grep -rnw 'path' -e 'some text' Use the l modifier to display onlyihor

If you already use for your HTML <img> tags and want to enable WebP for the CSS background as well, the proper way is to use multiple backgrounds in the CSS styling. For example, you have an element with .png CSS background: .minicart-wrapper .action.showcart.desktop .fa-shopping-cart:before {     background: url(../images/icon-cart.png) no-repeat;} To switch it to the WebP, you need to convert PNG/JPG/GIF image to WebP image manually using one of the free tools on the Internet. Save it in the same folder and use CSS like this: body.webp-supported .minicart-wrapper .action.showcart.desktop .fa-shopping-cart:before {    background: url(../images/icon-cart.webp) no-repeat;}body.no-webp .minicart-wrapper .action.showcart.desktop .fa-shopping-cart:before {    background: url(../images/icon-cart.png) no-repeat;} In this case, all browsers will get WebP images, except for ones that do not support WebP. They will load the .png image. Note: if you use Magento 2 with "no-webp" & "webp-supported"ihor

It is proven that information is perceived better by watching videos than reading a long one-piece text. Magento websites are not an exception. So, it's your cue to consider adding videos to your content, too. There are multiple options to add YouTube videos in Magento. Starting from the default means and moving on to the advanced tools with , you can find the best solution for your needs.  Today, we'll cover both options to make your journey easier. Their features and performance metrics vary, so there's a lot to unveil. Ready to get started? How to Add YouTube Video in Magento? You can use the WYSIWYG editor or page builder for content management. Fortunately, both of them offer a media tool to add audiovisual elements. So, to add a video in Magento: 1. Navigate to the place where you'd like to insert a video and click on the Insert/edit media icon on the editor's toolbar. 2. Enter the video's link in the Source folder and specify its Width and Height in the General tab. 3. Switchihor

If you use Magento 2 and get an error like this: Warning: file_get_contents(): SSL operation failed with code 1. OpenSSL Error messages:error:14095126:SSL routines:ssl3_read_n:unexpected eof while reading in vendor/google/recaptcha/src/ReCaptcha/RequestMethod/Post.php on line 72Trace:<pre>#1 file_get_contents() called at [vendor/google/recaptcha/src/ReCaptcha/RequestMethod/Post.php:72]#2 ReCaptcha\RequestMethod\Post->submit() called at [vendor/google/recaptcha/src/ReCaptcha/ReCaptcha.php:156]#3 ReCaptcha\ReCaptcha->verify() called at [app/code/MSP/ReCaptcha/Model/Validate.php:79]#4 MSP\ReCaptcha\Model\Validate->validate() called at [app/code/MSP/ReCaptcha/Observer/ReCaptchaObserver.php:93]#5 MSP\ReCaptcha\Observer\ReCaptchaObserver->execute() called at [vendor/magento/framework/Event/Invoker/InvokerDefault.php:72]#6 Magento\Framework\Event\Invoker\InvokerDefault->_callObserverMethod() called at [vendor/magento/framework/Event/Invoker/InvokerDefault.php:60]... when trying to login to theihor

To apply lazy load for images in your Knockout template, first, make sure that  extension is installed. Then insert an image into the HTML template (my-template.html) like this: <img data-bind="attr: {src: $parent.getPixelUrl(), 'data-original': thumbnail, alt: code_article, loading: 'lazy', width: '165', height: '165' }"/> Example: <div class="options-block" data-bind="foreach: getOptionBlocks(), afterRender: initLazyLoad()">     <div class="option-item" data-bind="attr: {'data-sku': sku}">         <div class="image-block">              <img data-bind="attr: {src: $parent.getPixelUrl(), 'data-original': thumbnail, alt: code_article, loading: 'lazy', width: '165', height: '165' }"/>         </div>      </div> </div>   Your view JS file should look like:  define([ 'jquery', 'uiComponent', 'ko',], function ($, Component, ko) { 'use strict'; return Component.extend({ defaults: { template: 'Vendor_ExtensionName/my-template' }ihor

In v2.9.3 we added the feature that many customers requested about, it is "use the default catalog related products template" instead of custom blog related product template. This helps to display related products on the blog post page in the theme design automatically. The commit related to this change can be found at GitHub. Unfortunately, there are thousands of themes for Magento 2, and some of them have specific JS and CSS (e.g. Porto Theme). That is why if you use Blog extension v2.9.3 or greater and the related products block does not look good, please try to do next: 1. Create a new file in your theme directory: app/design/frontend/ThemeVendor/themename/Magefan_Blog/layout/blog_post_view.xml 2. Add this code into it: <?xml version="1.0"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceBlock name="blog.post.relatedproducts" > <arguments> <argumentihor