How to Add Custom Button in Backend CMS Page Section Magento 2 - magento source24


Hello magento friends in this post im share with you to How to Add Custom Button in Backend CMS Page Section.


How to Add Custom Button in Backend CMS Page Section Magento 2 - magento source24


In Magento 2, you can add a custom button in the Backend CMS Page section by creating a custom module. Here's a step-by-step guide on how to achieve this:


Create a custom module:

First, create a new custom module in the app/code directory of your Magento installation. Replace Vendor_Module with your desired namespace and module name.


Define module registration:

In the module's root directory, create a registration.php file with the following content:


<?php

use Magento\Framework\Component\ComponentRegistrar;

ComponentRegistrar::register(

    ComponentRegistrar::MODULE,

    'Vendor_Module',

    __DIR__

);


After that Create module configuration:

Create the app/code/Vendor/Module/etc/module.xml file with the following content:


<?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="Vendor_Module" setup_version="1.0.0">

        <sequence>

            <module name="Magento_Cms"/> <!-- Ensure Magento_Cms is loaded before this module -->

        </sequence>

    </module>

</config>


After that Create a layout file for your module:

Create the layout file app/code/Vendor/Module/view/adminhtml/layout/cms_page_edit.xml with the following content:



<?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="page_actions">

            <block class="Vendor\Module\Block\Adminhtml\Page\Edit\CustomButton" after="add" name="custom_button">

                <arguments>

                    <argument translate="true" name="label" xsi:type="string">Custom Button</argument>

                    <argument name="config" xsi:type="array">

                        <item name="url" xsi:type="url" path="route/controller/action"/> <!-- Replace with your custom URL -->

                    </argument>

                </arguments>

            </block>

        </referenceBlock>

    </body>

</page>



 After that Create the Block for the custom button:

Create the block file app/code/Vendor/Module/Block/Adminhtml/Page/Edit/CustomButton.php with the following content:



<?php


namespace Vendor\Module\Block\Adminhtml\Page\Edit;


use Magento\Framework\View\Element\UiComponent\Control\ButtonProviderInterface;


class CustomButton implements ButtonProviderInterface

{

    /**

     * @return array

     */

    public function getButtonData()

    {

        return [

            'label' => __('Custom Button'), // Button label

            'class' => 'save', // CSS class to style the button (optional)

            'on_click' => "location.href = '" . $this->getUrl('route/controller/action') . "'", // Custom URL

            'sort_order' => 20, // Position of the button

        ];

    }


    /**

     * Generate URL by route and parameters

     *

     * @param string $route

     * @param array $params

     * @return string

     */

    public function getUrl($route = '', $params = [])

    {

        return $this->_urlBuilder->getUrl($route, $params);

    }

}


  1. Replace route/controller/action in the cms_page_edit.xml and CustomButton.php files with your desired custom controller action's route.
  2. Run setup upgrade and clear cache:
  3. After completing the steps above, you need to run the following commands in your Magento root directory:

php bin/magento setup:upgrade
php bin/magento cache:flush

Now, when you go to the edit page of a CMS page in the backend, you should see your custom button labeled "Custom Button" next to the "Save" button. When clicked, it will take you to the custom URL defined in the CustomButton.php block file.












Deepak Kumar Bind

Success is peace of mind, which is a direct result of self-satisfaction in knowing you made the effort to become the best of which you are capable.

Post a Comment

If you liked this post please do not forget to leave a comment. Thanks

Previous Post Next Post