In this post, we will see how to create a simple custom module in Magento 2.
We are talking about a simple module. So no database and admin related files.
It will have basic module files, controller, block, layout and phtml files.
Let’s get started.
For this, all we need is 7 files. But yes we need it in a necessary folder structure.
Folder structure will be as below. And as you know from our rood directory we place this at app/code/
Magento 2 Simple Custom Module
Now in the image, you can see Vky which is the namespace for our module and Test is our module name.
So for me, the custom module will be Vky_Test. You can choose whatever you want.
For every custom module in Magento 2, we must require two files 1. registration.php and 2. module.xml
Create Vky/Test/registration.php
<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'Vky_Test',
__DIR__
);
Create Vky/Test/etc/module.xml
<?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="Vky_Test" setup_version="1.0.0" />
</config>
In the module.xml file, you can see setup_version="1.0.0" which is our module version.
Now we are creating a custom module for the frontend and our module name is Vky_Test. So let’s say our module URL will be www.magento2.com/test and for this, we will need a controller.
Create Vky/Test/Controller/Index/Index.php
<?php
namespace Vky\Test\Controller\Index;
class Index extends \Magento\Framework\App\Action\Action
{
public function execute()
{
$this->_view->loadLayout();
$this->_view->getLayout()->initMessages();
$this->_view->renderLayout();
}
}
Now we will need a layout file.
Create Vky/Test/view/frontend/layout/test_index_index.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="Vky\Test\Block\Test" name="test.list" template="test.phtml">
</block>
</referenceContainer>
</body>
</page>
We are using our block and a phtml file so we need to create both files.
Create Vky/Test/Block/Test.php
<?php
namespace Vky\Test\Block;
/**
* Test content block
*/
class Test extends \Magento\Framework\View\Element\Template
{
public function __construct(
\Magento\Framework\View\Element\Template\Context $context
) {
parent::__construct($context);
}
public function _prepareLayout()
{
$this->pageConfig->getTitle()->set(__('Simple Custom Module'));
return parent::_prepareLayout();
}
}
In _prepareLayout() function, we are setting our page title.
Create Vky/Test/view/frontend/templates/test.phtml
<?php echo 'This is a simple custom module and it does not include admin and database realted files.'; ?>
And in the last most important we need to create routes.xml. In which we can define our frontName so we will able to run our module URL www.magento2.com/test and render content from our test.phtml file.
Create Vky/Test/etc/frontend/routes.xml
<?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="test" frontName="test">
<module name="Vky_Test" />
</route>
</router>
</config>
See frontName="test" and because of this we can run our module URL by www.magento2.com/test
That’s it. We have created a simple custom module for Magento 2. I hope it helps.
Next:
How to add custom css and js to a custom module? Click here
Now once you know this is how it works then you don’t have to create the same files again and again for your every custom module. You can generate a custom module code from my module creator.
Click here for the Magento 2 Module Creator.
No Comments