Magento 2 - How to Add a Custom Link in Admin Product Listing Grid Page • Dev Hooks • devhooks.in

We'll walk you through the easy steps in this article on how to add a custom link to a Magento 2 admin product listing page. In Magento 2, you must construct a custom module and use UI Components to add a custom link to the admin product listing grid page. This is a general how-to tutorial for accomplishing that.

Before we start I assume, you have already created a custom module. If you don't have it or don't know how to create it then check out our other article How To Create a Magento 2 Module.

Step 1: Create product_listing.xml at app/code/Vendor/ModuleName/view/adminhtml/ui_component/ and paste the below code. You need to change the code as per your requirement.

saveCopyzoom_out_map<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <settings>
        <buttons>
            <button name="customlink" class="Vendor\ModuleName\Block\Adminhtml\Catalog\CustomLink"/>
        </buttons>
    </settings>
</listing>

In the above code, we've used the CustomLink class to add the custom button on the admin product listing page in Magento 2. Next, we're creating a CustomLink.php class file.

Step 2: Create CustomLink.php at app/code/Vendor/ModuleName/Block/Adminhtml/Catalog/ and paste the below code. You need to change the code as per your requirement.

saveCopyzoom_out_map<?php

namespace Vendor\ModuleName\Block\Adminhtml\Catalog;

use Magento\Backend\Block\Widget\Context;
use Magento\Framework\AuthorizationInterface;
use Magento\Framework\View\Element\UiComponent\Control\ButtonProviderInterface;

class CustomLink implements ButtonProviderInterface
{
    /**
     * @var AuthorizationInterface
     */
    private $authorization;

    /**
     * @var Context
     */
    private $context;

    /**
     * CustomButton constructor.
     *
     * @param AuthorizationInterface $authorization
     * @param Context $context
     */
    public function __construct(
        AuthorizationInterface $authorization,
        Context                $context
    )
    {
        $this->authorization = $authorization;
        $this->context = $context;
    }

    /**
     * @return array
     */
    public function getButtonData()
    {
        $message = 'Are you sure you want to process?';
        return [
            'label' => __('Custom Link'),
            'on_click' => "confirmSetLocation('{$message}', '{$this->context->getUrlBuilder()->getUrl('route/controller/action/')}')",
            'class' => 'customlinkclass',
            'sort_order' => 10
        ];
    }

}

You can see we've used the 'route/controller/action/' as a controller, you need to replace it with your admin controller.

Step 3: Cache Clean

After making these changes, clear the Magento cache and refresh the admin page to see the updated product listing with the custom link column.

saveCopyzoom_out_mapphp bin/magento cache:clean

Please replace placeholders like Vendor\ModuleName with your actual namespace and module name.

Bingo!! we are done all steps.

We hope this Magento post helped you to know How to add a custom link in admin product listing page in Magento 2.

Bookmark it for your future reference. Do comment below if you have any other questions or doubts.

P.S. Do share this post with your team.

Review other articles maybe it'll help you too.