development

  1. List of Magento 2 Admin Panel Menu Identifiers

    Menu Title [identifier]

    Dashboard [Magento_Backend::dashboard]
    Sales [Magento_Sales::sales] Operations [Magento_Sales::sales_operation] Orders [Magento_Sales::sales_order] Invoices [Magento_Sales::sales_invoice] Shipments [Magento_Sales::sales_shipment] Credit Memos [Magento_Sales::sales_creditmemo] Billing Agreements [Magento_Paypal::paypal_billing_agreement] Transactions [Magento_Sales::sales_transactions]
    Read more »
  2. How to Add New Element to Magento 2 Admin Panel Menu?

    The etc/adminhtml/menu.xml file is used to control the Magento 2 admin panel menu and add new items to it, in particular.

    Меню адмін-панелі Magento 2

    Read more »
  3. Default Values for the Magento 2 Configuration Page

    In the previous article we described how to create your own section on the Magento 2 configuration page (Stores > Configuration).

    In order to set the default values for the configuration fields, you need to create the following file in the module folder:

    etc/config.xml

    and add this code:

    <?xml version="1.0"?>
    <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Store:etc/config.xsd">
        <default>
            <section_id>
                <group_id>
                    <field_id>default_value</field_id>
                </group_id>
            </section_id>
        </default>
    </config>

    Read more »
  4. Extend the Magento 2 Access Control List

    In the previous article 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).

    User Role Reasources in Magento 2

    You need to create ACL file (ACL - Access Control List) in your module folder:

    etc/acl.xml

    Read more »
  5. How to Create Configuration Section (system.xml) in Magento 2?

    To find the Magento 2 configuration page navigate to Magento 2 Admin Panel > Stores > Configuration.

    Налаштування Magento 2

    All tabs and forms on this page are customized using this file

    etc/adminhtml/system.xml

    Read more »
  6. Magento 2 Modes

    What are the modes in Magento 2?

    Magento 2 can work in 3 modes: default, developer and production.

    After installation, Magento 2 is in a default mode. It is aimed at users who are unaware of the possibility of changing the Magento 2 mode. Besides, it is between the developer and production state.

    Default mode is not used for the development and production environment. When in default mode, Magento 2:

      • caches static files:
      • does not display errors in the clipboard (on the screen), but in the log file (magento2_folder / var / log).

    Developer mode is ideal for developers. When in developer mode Magento 2:

    Read more »
  7. How to Move Only Some JS to the Page Bottom in Magento 2?

    Magento 2 Rocket JavaScript extension allows you to enable deferred JavaScript loading and Move JS code to the bottom of the page automatically. That way you increase the website loading speed and eliminate render-blocking.

    However, sometimes you don't need to move all JavaScripts to the bottom since there are some that aren't recommended to be moved there.

    So, in case you use the deferred JavaScripts on your Magento 2 store page and don't want to move some JavaScript to the bottom you just need to add the attribute data-rocketjavascript="false" to the <script> tag:

    Read more »
  8. Most Useful Linux Commands

    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;

    Read more »
  9. Magento 2 Blog GraphQL Queries Examples

    The examples of some GraphQL queries for the Magento 2 blog module are presented in this article. With these queries, you will be able to extract the necessary blog data for Progressive Web Application (PWA). The queries are easily tested in the ChromeiQL - Chrome Browser Extension.

    Note that Magento 2 Blog GraphQL addition should be installed first.

    To check the full Blog GraphQL schema please see the 

    Read more »
  10. GraphQL Queries Testing

    In order to easily test the GraphQL queries all you need to do is install the ChromeiQL extension for Chrome Browser by pressing the Add to Chrome.

    Chromeigl Extension

    Once you have added it you will see the extension icon in the right top corner of the browser window. Pressing it will move you to the new window where the testing is actually conducted.

    This is the example of how we test the GraphQL query for Magefan Magento 2 Blog module:

    1. Set the Endpoint URL in the corresponding field.
    2. In the left field set the query. It is also allowed to state the query parameters if needed below the
    Read more »
  11. Resize Blog Post Images Programmatically

    To get a resized post image in Magento 2 Blog you can use this code in your template files:

     <?php
       $width = 100;
       $height = 150;
       $imageHelper = $this->helper(\Magefan\Blog\Helper\Image::class);
     ?>
    <img
       src="<?php echo $imageHelper->init($_post->getFeaturedImg())->resize($width, $height); ?>"
       alt="<?php echo $block->escapeHtml($_post->getTitle()) ?>" />

    If you don't want to use the height parameter then you can execute the resize function only with the first parameter, e.g.

    <?php echo $imageHelper->init($_post->getFeaturedImg())->resize($width); ?>

    Or if you use Magefan Blog version greater equal than v2.9.8, you can use this line (it will allow you to save the image width x height file proportion and not create a square image with white borders):

    Read more »
  12. Prioritizing Plugins in Magento 2

    The sortOrder property for plugins in Magento 2 determines when to call them (before, after, or around a method), on condition more than one plugin is configured for the same method.

    <config>
        <type name="{ObservedType}">
          <plugin name="{pluginName}" type="{PluginClassName}" sortOrder="1" disabled="false" />
        </type>
    </config>

    Prioritizing rules are as follows:

    • Before executing the original method, Magento will run before plugins from the smallest to the biggest value in sortOrder.
    • The part of the plugin around code will also be executed from the smallest to the biggest value before calling the original method (callable).
    • The after plugin is called from the biggest to the smallest after calling the original method.

    Read more »
  13. Change The Layout For All Magento 2 Blog Pages

    If you use Magefan Blog Extension for Magento 2 and need to change the layout e.g. from "2 columns with a right sidebar" to "2 columns with a left sidebar" for all blog pages, please do next:

    1. Create a file

    app/design/ThemeVendor/themename/Magefan_Blog/layout/blog_default.xml

    2. Add the code into it

    <?xml version="1.0"?>
    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    </page>

    Read more »
  14. Add Custom Field To Magento 2 Blog Post

    If you need to extend Magento 2 Blog Module by Magefan and add a new custom text field to Blog Post edit page in Magento 2 Admin panel (Content  > Blog > Posts) you must to create a simple custom Magento 2 Extension.

    You can download a sample extension from our GitHub page or you can create it manually using the steps below:

    1. Create composer.json file

    app/code/Magefan/BlogCustomField/composer.json
    {
    "name": "magefan/module-blog-custom-field",
    "description": "Implements Blog functionality on Magento 2 store",
    "require": {
    "magefan/module-blog" : ">=2.8.0"
    },
    "type": "magento2-module",
    "version": "2.0.0",
    "license": [
    "OSL-3.0",
    "AFL-3.0"
    ],
    "autoload": {
    "files": [ "registration.php" ],
    "psr-4": {
    "Magefan\\BlogCustomField\\": ""
    }
    }
    }

     

    Read more »
  15. Display Tag Count In The Magento 2 Blog Tag Cloud Sidebar

    If you need to display tag count in the Magento 2 Blog tag cloud sidebar, you need to extend the tags sidebar template.

    To do this:

    1. Copy the template file from the Blog extension folder

    view/frontend/templates/sidebar/tag_claud.phtml

    to your theme folder

    app/design/frontend/ThemeVendor/themename/Magefan_Blog/templates/sidebar/tag_claud.phtml

    Read more »
  16. Remove Blog Top Link In SmartWave Porto Theme

    SmartWave Porto Theme for Magento 2 includes Magefan Blog Extension out of the box and adds the blog link to the header top links.

    If you want to remove the blog from the top links, please follow these steps:

    1. Create a new file in your child theme (ThemeVendor/theme-name) directory:

    app/design/frontend/ThemeVendor/theme-name/Magefan_Blog/layout/default.xml 
    Read more »
  17. Magento 2 Code Quality Check (Magento EQP/Magento Coding Standard)

    Have you ever wondered how easy it is to check the quality of your own code, your colleagues' code, or a third-party module you want to use on a Magento project?

    The Magento development team has created the Magento Extension Quality Program Coding Standard (Magento EQP), which allows you to check the code compliance with the standard, as well as identify the following shortcomings:

    - SQL queries execution in the loop;
    - use of dangerous functions;
    - use of super-global variables;
    - excessive code complexity;
    - Unjustified collections loads.

    Read more »
  18. Magento 2 Observer and Event

    Imagine you are cooking pasta and sit down to play some game. You listen with one ear to see if the "dish" does not boil away. In this case, you are an observer. When the pasta starts to boil away — the event "pasta_began_to_boil_away" is triggered, which causes you (the observer) to rush to the kitchen (perform an action, an algorithm).

    In Magento 2, as in real life, there are observers and events that are implemented on the basis of the "Publish-subscribe pattern". We have already described  plugins in Magento 2, which allows you to extend and change the functionality of the store. Let's see how you can do this with the help of events and observers in Magento 2.

    Events 

    Events are triggered by Magento 2 modules when an action has occurred or has to occur. Magento has many native events and also allows you to call your own event.

    Use the dispatch method of the \Magento\Framework\Event\ Manager class to call an event.

    Read more »
  19. Magento2 Ultimo Theme Blog Link in Menu

    If you have already installed Magento 2 Blog Module v2.6.2 (or later) you can easily add a blog link to the Menu on your Ultimo theme.

    Blog Link in Ultimo Theme

     

     

     

     

    Read more »
  20. Overriding and Extending JS files in Magento 2

    You often need to change the JavaScript code logic located in the .js file. The easiest way is to override the js file is by using a theme. You can learn how to override view files in the article about Overriding Magento 2 Storeftont Files. This is a quick but not an elegant way.

    To change one or more js-file methods, use the mixins available in RequireJS.

    To extend this file:

    app/code/VendorName/ModuleName/view/%area%/web/js/folder1/folder2/somefile.js

    Read more »
Posts loader
^Top
Chat