{"id":2188,"date":"2017-04-01T07:11:02","date_gmt":"2017-04-01T07:11:02","guid":{"rendered":"http:\/\/myprojects.advchaweb.com\/?p=2188"},"modified":"2019-07-22T04:14:50","modified_gmt":"2019-07-22T04:14:50","slug":"magento-2-module-development","status":"publish","type":"post","link":"https:\/\/myprojects.advchaweb.com\/index.php\/2017\/04\/01\/magento-2-module-development\/","title":{"rendered":"Magento 2 Module Development"},"content":{"rendered":"<p>Ref: <a href=\"https:\/\/www.mageplaza.com\/magento-2-module-development\/\">https:\/\/www.mageplaza.com\/magento-2-module-development\/<\/a><\/p>\n<p>The module is a directory that contains <span style=\"color: #ffff00;\">blocks, controllers, models, helper<\/span>, etc &#8211; that are related to a specific business feature. In Magento 2, modules will be live in <span style=\"color: #ffff00;\">app\/code<\/span> directory of a Magento installation, with this format: <span style=\"color: #ffff00;\">app\/code\/&lt;Vendor&gt;\/&lt;ModuleName&gt;<\/span>. I use Magento 2.1.5 CE. Here is the <a href=\"http:\/\/myprojects.advchaweb.com\/index.php\/2017\/03\/18\/magento-ce-2-1-5-with-sample-data-installation\/\" target=\"_blank\" rel=\"noopener noreferrer\">installation steps<\/a>.<\/p>\n<p><span style=\"background-color: #0000ff;\">Create Hello World module for Magento 2<\/span><\/p>\n<p><span style=\"background-color: #0000ff;\">Step 1: Create a directory for the module like above format.<\/span><br \/>\nHere I use <span style=\"color: #ffff00;\">Advcha<\/span> as a Vendor name and <span style=\"color: #ffff00;\">HelloWorld<\/span> as a ModuleName.<br \/>\nSo create a directory: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld<\/span>.<\/p>\n<p><span style=\"background-color: #0000ff;\">Step 2: Declare module by using configuration file module.xml<\/span><br \/>\nCreate a new file <span style=\"color: #ffff00;\">module.xml<\/span> in <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/etc\/<\/span> directory. Here is the full path: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/etc\/module.xml<\/span><br \/>\nHere is the file content:<\/p>\n<pre class=\"lang:default decode:true\">&lt;?xml version=\"1.0\"?&gt;\r\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:Module\/etc\/module.xsd\"&gt;\r\n    &lt;module name=\"Advcha_HelloWorld\" setup_version=\"1.0.0\" \/&gt;\r\n&lt;\/config&gt;<\/pre>\n<p>Here I register a module with name <span style=\"color: #ffff00;\">Advcha_HelloWorld<\/span> and the version is <span style=\"color: #ffff00;\">1.0.0<\/span>.<\/p>\n<p><span style=\"background-color: #0000ff;\">Step 3: Register module by registration.php<\/span><br \/>\nMagento 2 module must be registered in the Magento system through the <span style=\"color: #ffff00;\">magento ComponentRegistrar<\/span> class. This file will be placed in module root directory. Create a new file <span style=\"color: #ffff00;\">registration.php<\/span> (beware the file name case-sensitive, it must be registration.php NOT Registration.php) in <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/<\/span> directory. Here is the full path: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/registration.php<\/span><br \/>\nHere is the file content:<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\n\\Magento\\Framework\\Component\\ComponentRegistrar::register(\r\n    \\Magento\\Framework\\Component\\ComponentRegistrar::MODULE,\r\n    'Advcha_HelloWorld',\r\n    __DIR__\r\n);\r\n<\/pre>\n<p><span style=\"background-color: #0000ff;\">Step 4: Enable the module<\/span><br \/>\nBefore enable the module, we must check to make sure Magento has recognize our module or not by enter the following at the command line: <span style=\"color: #ffff00;\">php bin\/magento module:status<\/span><\/p>\n<pre class=\"lang:default decode:true \">www-data@teddy-K43SJ:\/home\/teddy\/Documents\/works\/magentoce215$ php bin\/magento module:status\r\n...\r\nList of disabled modules:\r\nAdvcha_HelloWorld<\/pre>\n<p>Run this command <span style=\"color: #ffff00;\">php bin\/magento module:enable Advcha_HelloWorld<\/span> to enable it:<\/p>\n<pre class=\"lang:default decode:true\">www-data@teddy-K43SJ:\/home\/teddy\/Documents\/works\/magentoce215$ php bin\/magento module:enable Advcha_HelloWorld\r\nThe following modules have been enabled:\r\n- Advcha_HelloWorld\r\n\r\nTo make sure that the enabled modules are properly registered, run 'setup:upgrade'.\r\nCache cleared successfully.\r\nGenerated classes cleared successfully. Please run the 'setup:di:compile' command to generate classes.\r\nInfo: Some modules might require static view files to be cleared. To do this, run 'module:enable' with the --clear-static-content option to clear them.<\/pre>\n<p>Magento require to check and upgrade module database. We need to run this command <span style=\"color: #ffff00;\">php bin\/magento setup:upgrade<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">www-data@teddy-K43SJ:\/home\/teddy\/Documents\/works\/magentoce215$ php bin\/magento setup:upgrade\r\nCache cleared successfully\r\n...\r\nUpdating modules:\r\nSchema creation\/updates:\r\nModule 'Advcha_HelloWorld':\r\n...\r\nSchema post-updates:\r\nModule 'Advcha_HelloWorld':\r\n...\r\nData install\/update:\r\nModule 'Advcha_HelloWorld':\r\n...\r\nData post-updates:\r\nModule 'Advcha_HelloWorld':\r\n...\r\nPlease re-run Magento compile command<\/pre>\n<p>Now you can check under Stores -&gt; Configuration -&gt; Advanced -&gt; Advanced that the module is present.<a href=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_enable_module.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-2196\" src=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_enable_module-1024x502.png\" alt=\"\" width=\"840\" height=\"412\" srcset=\"https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_enable_module-1024x502.png 1024w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_enable_module-300x147.png 300w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_enable_module-768x376.png 768w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_enable_module.png 1082w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/a><span style=\"background-color: #0000ff;\">Step 5: Create a Routers for the module.<\/span><br \/>\nA request URL has the following format:<\/p>\n<pre class=\"lang:default decode:true\">http:\/\/magentoce215.dev\/&lt;router_id&gt;\/&lt;controller_name&gt;\/&lt;action_name&gt;<\/pre>\n<p>NOTE: Here I replaced <span style=\"color: #ffff00;\">&lt;router_name&gt;<\/span> to <span style=\"color: #ffff00;\">&lt;router_id&gt; <\/span>after I read this article <a href=\"http:\/\/alanstorm.com\/magento_2_advanced_routing\/\">Magento 2: Advanced Routing<\/a>.<br \/>\n<span style=\"background-color: #008000;\">&#8220;The id identifies the route node uniquely in the Magento system, and the frontName defines the first segment of your URL.&#8221;<\/span><br \/>\nAt first I thought it was &lt;router_name&gt; before I found the article. But I confused because this tutorial is working even if I didn&#8217;t change the id from &#8216;advcha&#8217; to &#8216;helloworld.??? So the url would be http:\/\/magentoce215.dev\/helloworld\/*<br \/>\nIn this module, we need to create a route for frontend area. So we need to add this file: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/etc\/frontend\/routes.xml<\/span>.<br \/>\nHere is the content:<\/p>\n<pre class=\"lang:default decode:true\">&lt;?xml version=\"1.0\"?&gt;\r\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:App\/etc\/routes.xsd\"&gt;\r\n    &lt;router id=\"standard\"&gt;\r\n        &lt;route id=\"advcha\" frontName=\"helloworld\"&gt;\r\n            &lt;module name=\"Advcha_HelloWorld\" \/&gt;\r\n        &lt;\/route&gt;\r\n    &lt;\/router&gt;\r\n&lt;\/config&gt;<\/pre>\n<p>After define the route, the URL path to our module will be: http:\/\/magentoce215.dev\/helloworld\/*<br \/>\nSo our <span style=\"color: #ffff00;\">&lt;router_name&gt;<\/span> is <span style=\"color: #ffff00;\">helloworld ???<br \/>\n<\/span><\/p>\n<p><span style=\"background-color: #0000ff;\">Step 6: Create controller and action.<\/span><br \/>\nwe will create controller and action to display &#8216;Hello World&#8217;. Our <span style=\"color: #ffff00;\">&lt;controller_name&gt;<\/span> would be <span style=\"color: #ffff00;\">index<\/span> and <span style=\"color: #ffff00;\">&lt;action_name&gt;<\/span> would be <span style=\"color: #ffff00;\">display<\/span>. We need to create a new php file: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/Controller\/Index\/Display.php<\/span><br \/>\nHere is the file content:<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Controller\\Index;\r\n\r\nclass Display extends \\Magento\\Framework\\App\\Action\\Action\r\n{\r\n    public function __construct(\\Magento\\Framework\\App\\Action\\Context $context){\r\n        return parent::__construct($context);\r\n    }\r\n    \r\n    public function execute(){\r\n        echo 'Hello World!';\r\n        exit;\r\n    }\r\n}<\/pre>\n<p>Now we can open the url to show &#8216;Hello World!&#8217; from our module: http:\/\/magentoce215.dev\/helloworld\/index\/display<br \/>\nNote: If there is no change, please flush the cache with this command: <span style=\"color: #ffff00;\">php bin\/magento cache:flush<\/span>.<\/p>\n<p><span style=\"background-color: #0000ff;\">Step 7: Add to github.<\/span><br \/>\nIt&#8217;s a good way to store also our code in github. Here is how to\u00a0 do it:<br \/>\nExit from &#8216;www-data&#8217; user then Go into \/app\/code\/Advcha\/HelloWorld\/ directory:<\/p>\n<pre class=\"lang:default decode:true \">www-data@teddy-K43SJ:\/home\/teddy\/Documents\/works\/magentoce215\/app\/code\/Advcha\/HelloWorld\/$ exit\r\nexit\r\nteddy@teddy-K43SJ:~\/Documents\/works\/magentoce215$ cd app\/code\/Advcha\/HelloWorld\/<\/pre>\n<p>Initialize with <span style=\"color: #ffff00;\">git init<\/span>:<\/p>\n<pre class=\"lang:default decode:true \">teddy@teddy-K43SJ:~\/Documents\/works\/magentoce215\/app\/code\/Advcha\/HelloWorld$ git init\r\nInitialized empty Git repository in \/home\/teddy\/Documents\/works\/magentoce215\/app\/code\/Advcha\/HelloWorld\/.git\/<\/pre>\n<p>Go into your github account and create a new repository. I created a new repo &#8216;magento2-sample-module&#8217; (https:\/\/github.com\/advcha\/magento2-sample-module). Then use <span style=\"color: #ffff00;\">git remote add origin https:\/\/github.com\/advcha\/magento2-sample-module.git<\/span> and <span style=\"color: #ffff00;\">git push -u origin master<\/span> to update the remote reposity.<\/p>\n<pre class=\"lang:default decode:true \">teddy@teddy-K43SJ:~\/Documents\/works\/magentoce215\/app\/code\/Advcha\/HelloWorld$ git remote add origin https:\/\/github.com\/advcha\/magento2-sample-module.git\r\nteddy@teddy-K43SJ:~\/Documents\/works\/magentoce215\/app\/code\/Advcha\/HelloWorld$ git push -u origin master\r\nUsername for 'https:\/\/github.com': advcha\r\nPassword for 'https:\/\/advcha@github.com': \r\nCounting objects: 10, done.\r\nDelta compression using up to 4 threads.\r\nCompressing objects: 100% (7\/7), done.\r\nWriting objects: 100% (10\/10), 1.08 KiB | 0 bytes\/s, done.\r\nTotal 10 (delta 1), reused 0 (delta 0)\r\nremote: Resolving deltas: 100% (1\/1), done.\r\nTo https:\/\/github.com\/advcha\/magento2-sample-module.git\r\n * [new branch]      master -&gt; master\r\nBranch master set up to track remote branch master from origin.<\/pre>\n<p>Then we can use git add command to prepare our files or use git GUI to make it easier. I use gitcola. First, stage the files, then commit and push. Done!<\/p>\n<p><span style=\"background-color: #0000ff;\">Create Controllers in Magento 2<\/span><br \/>\nref: <a href=\"https:\/\/www.mageplaza.com\/magento-2-module-development\/how-to-create-controllers-magento-2.html\">https:\/\/www.mageplaza.com\/magento-2-module-development\/how-to-create-controllers-magento-2.html<\/a><br \/>\nIn Magento 2 Controller has one or more files in Controller folder of module, it includes actions of class which contain <span style=\"color: #ffff00;\">execute()<\/span> method. There are 2 different controllers, they are <span style=\"color: #ffff00;\">frontend<\/span> controller and <span style=\"color: #ffff00;\">backend<\/span> controller. They are generally similar of workflow, but admin controller is a little different. There is a checking permission method in admin controller.<br \/>\nHere for the first step, we follow the same step as above like create <span style=\"color: #ffff00;\">routes.xml<\/span> in <span style=\"color: #ffff00;\">\/app\/Advcha\/HelloWorld\/etc\/frontend\/ <\/span>directory. But we change the id to &#8216;helloworld&#8217;.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?xml version=\"1.0\"?&gt;\r\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:App\/etc\/routes.xsd\"&gt;\r\n    &lt;router id=\"standard\"&gt;\r\n        &lt;route id=\"helloworld\" frontName=\"helloworld\"&gt;\r\n            &lt;module name=\"Advcha_HelloWorld\" \/&gt;\r\n        &lt;\/route&gt;\r\n    &lt;\/router&gt;\r\n&lt;\/config&gt;<\/pre>\n<p>Then create controller file <span style=\"color: #ffff00;\">Index.php<\/span> in <span style=\"color: #ffff00;\">\/app\/Advcha\/HelloWorld\/Controller\/Index\/<\/span> directory.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?php \r\nnamespace Advcha\\HelloWorld\\Controller\\Index;\r\n\r\nclass Index extends \\Magento\\Framework\\App\\Action\\Action\r\n{\r\n    protected $resultPageFactory;\r\n    \r\n    \/**\r\n        * Constructor\r\n        * \r\n        * @param \\Magento\\Framework\\App\\Action\\Context  $context\r\n        * @param \\Magento\\Framework\\View\\Result\\PageFactory $resultPageFactory\r\n        *\/\r\n    public function __construct(\r\n        \\Magento\\Framework\\App\\Action\\Context $context,\r\n        \\Magento\\Framework\\View\\Result\\PageFactory $resultPageFactory) \r\n    {\r\n        $this-&gt;resultPageFactory = $resultPageFactory;\r\n        parent::__construct($context);\r\n    }\r\n\r\n    \/**\r\n        * Execute view action\r\n        * \r\n        * @return \\Magento\\Framework\\Controller\\ResultInterface\r\n        *\/\r\n    public function execute() {\r\n        \/\/echo 'Hello Advcha!';\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/exit;\r\n        return $this-&gt;resultPageFactory-&gt;create();\r\n    }\r\n\r\n}<\/pre>\n<p>All controller must extend from <span style=\"color: #ffff00;\">\\Magento\\Framework\\App\\Action\\Action<\/span> class which has dispatched method which will call <span style=\"color: #ffff00;\">execute<\/span> method in action class. In this <span style=\"color: #ffff00;\">execute()<\/span> method, we will write all of our controller logic and will return response for the request.<br \/>\nThen create layout file <span style=\"color: #ffff00;\">helloworld_index_index.xml<\/span> in <span style=\"color: #ffff00;\">\/app\/Advcha\/HelloWorld\/view\/frontend\/layout\/<\/span> directory. the layout filename has a pattern <span style=\"color: #ffff00;\">&lt;router_name&gt;_&lt;controller_name&gt;_&lt;action_name&gt;.xml<\/span>. Therefore <span style=\"color: #ffff00;\">&lt;router_name&gt;<\/span> is <span style=\"color: #ffff00;\">helloworld<\/span>, <span style=\"color: #ffff00;\">&lt;controller_name&gt;<\/span> is <span style=\"color: #ffff00;\">index<\/span> and <span style=\"color: #ffff00;\">&lt;action_name&gt;<\/span> is <span style=\"color: #ffff00;\">index<\/span> (the classname). The <span style=\"color: #ffff00;\">Frontend<\/span> <span style=\"color: #ffff00;\">layout<\/span> <span style=\"background-color: #008000;\">always<\/span> in <span style=\"color: #ffff00;\">\/view\/frontend\/layout\/<\/span> directory.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?xml version=\"1.0\" ?&gt;\r\n&lt;page layout=\"1column\" xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\"&gt;\r\n    &lt;body&gt;\r\n        &lt;referenceContainer name=\"content\"&gt;\r\n            &lt;block class=\"Advcha\\HelloWorld\\Block\\Index\\Index\" name=\"index.index\" template=\"Advcha_HelloWorld::index\/index.phtml\"\/&gt;\r\n        &lt;\/referenceContainer&gt;\r\n    &lt;\/body&gt;\r\n&lt;\/page&gt;<\/pre>\n<p>For the <span style=\"color: #ffff00;\">block<\/span> &#8220;<span style=\"color: #ffff00;\">Advcha\\HelloWorld\\Block\\Index\\Index<\/span>&#8220;, create a new file <span style=\"color: #ffff00;\">Index.php<\/span>. The full path is in <span style=\"color: #ffff00;\">\/app\/code\/Advcha\/HelloWorld\/Block\/Index\/Index.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Block\\Index;\r\n\r\nclass Index extends \\Magento\\Framework\\View\\Element\\Template{\r\n    public function _prepareLayout() {\r\n        return parent::_prepareLayout();\r\n    }\r\n}<\/pre>\n<p>For the <span style=\"color: #ffff00;\">template<\/span> is &#8220;<span style=\"color: #ffff00;\">Advcha_HelloWorld::index\/index.phtml<\/span>&#8220;. The full path is in <span style=\"color: #ffff00;\">\/app\/code\/Advcha\/HelloWorld\/view\/frontend\/templates\/index\/index.phtml<\/span>. The <span style=\"color: #ffff00;\">Frontend<\/span> <span style=\"color: #ffff00;\">template<\/span> <span style=\"background-color: #008000;\">always<\/span> in <span style=\"color: #ffff00;\">\/view\/frontend\/templates\/<\/span> directory. Create a new file <span style=\"color: #ffff00;\">index.phtml<\/span> and here is the content:<\/p>\n<pre class=\"lang:default decode:true\">&lt;h1&gt;Welcome Advcha.&lt;\/h1&gt;<\/pre>\n<p>Okay. It&#8217;s time to test but first flush magento cache with command: <span style=\"color: #ffff00;\">php bin\/magento cache:flush<\/span>. Then open this url: http:\/\/magentoce215.dev\/helloworld\/index\/index. IT SHOULD SHOW <span style=\"background-color: #008000;\">Welcome Advcha.<\/span><br \/>\nIF IT SHOW EMPTY PAGE, Please flush the magento cache or check again the id in routes.xml or make sure the &#8216;block&#8217; is exist or modify &#8216;layout=&#8221;empty&#8221;&#8216; in helloworld_index_index.xml (ref:\u00a0<a href=\"http:\/\/magento.stackexchange.com\/questions\/84370\/magento-2-sample-module-displays-blank-page\">http:\/\/magento.stackexchange.com\/questions\/84370\/magento-2-sample-module-displays-blank-page<\/a>).<br \/>\nWe can also inspect the elements with <a href=\"http:\/\/myprojects.advchaweb.com\/index.php\/2017\/04\/02\/installing-msp-devtools-magento-devtools-by-magespecialist\/\">Magento DevTools<\/a>.<a href=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magentoce215_devtools.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2226\" src=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magentoce215_devtools.jpg\" alt=\"\" width=\"634\" height=\"654\" srcset=\"https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magentoce215_devtools.jpg 634w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magentoce215_devtools-291x300.jpg 291w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/><\/a><span style=\"background-color: #0000ff;\">CRUD<\/span><br \/>\nref: <a href=\"https:\/\/www.mageplaza.com\/magento-2-module-development\/how-to-create-crud-model-magento-2.html\">https:\/\/www.mageplaza.com\/magento-2-module-development\/how-to-create-crud-model-magento-2.html<\/a><br \/>\nHere I want to create a new table &#8216;<span style=\"color: #ffff00;\">advcha_post<\/span>&#8216; with these following columns:<br \/>\n<span style=\"color: #ffff00;\">post_id<\/span> &#8211; the post unique identifier<br \/>\n<span style=\"color: #ffff00;\">title<\/span> &#8211; the title of the post<br \/>\n<span style=\"color: #ffff00;\">content<\/span> &#8211; the content of the post<br \/>\n<span style=\"color: #ffff00;\">creation_time<\/span> &#8211; the date created<br \/>\nTo create a magento model, first <span style=\"background-color: #0000ff;\">setup a script<\/span> in <span style=\"color: #ffff00;\">InstallSchema.php<\/span> to create the table. Here is the full path: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/Setup\/InstallSchema.php<\/span>. Here is the file content:<br \/>\nNOTE: I updated the content from the github link: <a href=\"https:\/\/github.com\/mageplaza\/magento-2-sample-module\/blob\/master\/Setup\/InstallSchema.php\">https:\/\/github.com\/mageplaza\/magento-2-sample-module\/blob\/master\/Setup\/InstallSchema.php<\/a><\/p>\n<pre class=\"lang:default decode:true\">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Setup;\r\n\r\nuse \\Magento\\Framework\\Setup\\SchemaSetupInterface;\r\nuse \\Magento\\Framework\\Setup\\ModuleContextInterface;\r\nuse \\Magento\\Framework\\DB\\Ddl\\Table;\r\nuse \\Magento\\Framework\\DB\\Adapter\\AdapterInterface;\r\n\r\nclass InstallSchema implements \\Magento\\Framework\\Setup\\InstallSchemaInterface{\r\n    \/**\r\n        * install tables\r\n        *\r\n        * @param \\Magento\\Framework\\Setup\\SchemaSetupInterface $setup\r\n        * @param \\Magento\\Framework\\Setup\\ModuleContextInterface $context\r\n        * @return void\r\n        * @SuppressWarnings(PHPMD.ExcessiveMethodLength)\r\n        *\/\r\n    public function install(SchemaSetupInterface $setup, ModuleContextInterface $context)\r\n    {\r\n        $installer = $setup;\r\n        $installer-&gt;startSetup();\r\n        if (!$installer-&gt;tableExists('advcha_helloworld_post')) {\r\n            $table = $installer-&gt;getConnection()-&gt;newTable(\r\n                $installer-&gt;getTable('advcha_helloworld_post')\r\n            )\r\n            -&gt;addColumn(\r\n                'post_id',\r\n                Table::TYPE_INTEGER,\r\n                null,\r\n                [\r\n                    'identity' =&gt; true,\r\n                    'nullable' =&gt; false,\r\n                    'primary'  =&gt; true,\r\n                    'unsigned' =&gt; true,\r\n                ],\r\n                'Post ID'\r\n            )\r\n            -&gt;addColumn(\r\n                'name',\r\n                Table::TYPE_TEXT,\r\n                255,\r\n                ['nullable =&gt; false'],\r\n                'Post Name'\r\n            )\r\n            -&gt;addColumn(\r\n                'url_key',\r\n                Table::TYPE_TEXT,\r\n                255,\r\n                [],\r\n                'Post URL Key'\r\n            )\r\n            -&gt;addColumn(\r\n                'post_content',\r\n                Table::TYPE_TEXT,\r\n                '64k',\r\n                [],\r\n                'Post Post Content'\r\n            )\r\n            -&gt;addColumn(\r\n                'tags',\r\n                Table::TYPE_TEXT,\r\n                255,\r\n                [],\r\n                'Post Tags'\r\n            )\r\n            -&gt;addColumn(\r\n                'status',\r\n                Table::TYPE_INTEGER,\r\n                1,\r\n                [],\r\n                'Post Status'\r\n            )\r\n            -&gt;addColumn(\r\n                'featured_image',\r\n                Table::TYPE_TEXT,\r\n                255,\r\n                [],\r\n                'Post Featured Image'\r\n            )\r\n            -&gt;addColumn(\r\n                'sample_country_selection',\r\n                Table::TYPE_TEXT,\r\n                3,\r\n                [],\r\n                'Post Sample Country Selection'\r\n            )\r\n            -&gt;addColumn(\r\n                'sample_upload_file',\r\n                Table::TYPE_TEXT,\r\n                255,\r\n                [],\r\n                'Post Sample File'\r\n            )\r\n            -&gt;addColumn(\r\n                'sample_multiselect',\r\n                Table::TYPE_TEXT,\r\n                '64k',\r\n                [],\r\n                'Post Sample Multiselect'\r\n            )\r\n            -&gt;addColumn(\r\n                'created_at',\r\n                Table::TYPE_TIMESTAMP,\r\n                null,\r\n                [],\r\n                'Post Created At'\r\n            )\r\n            -&gt;addColumn(\r\n                'updated_at',\r\n                Table::TYPE_TIMESTAMP,\r\n                null,\r\n                [],\r\n                'Post Updated At'\r\n            )\r\n            -&gt;setComment('Post Table');\r\n            $installer-&gt;getConnection()-&gt;createTable($table);\r\n\r\n            $installer-&gt;getConnection()-&gt;addIndex(\r\n                $installer-&gt;getTable('advcha_helloworld_post'),\r\n                $setup-&gt;getIdxName(\r\n                    $installer-&gt;getTable('advcha_helloworld_post'),\r\n                    ['name','url_key','post_content','tags','featured_image','sample_upload_file'],\r\n                    AdapterInterface::INDEX_TYPE_FULLTEXT\r\n                ),\r\n                ['name','url_key','post_content','tags','featured_image','sample_upload_file'],\r\n                AdapterInterface::INDEX_TYPE_FULLTEXT\r\n            );\r\n        }\r\n        $installer-&gt;endSetup();\r\n    }\r\n}<\/pre>\n<p>Then run <span style=\"color: #ffff00;\">php bin\/magento setup:upgrade<\/span><br \/>\nThis should create a new table &#8216;<span style=\"color: #ffff00;\">advcha_helloworld_post<\/span>&#8216; in your magento database. If it didn&#8217;t create it, please check &#8216;<span style=\"color: #ffff00;\">setup_module<\/span>&#8216; table, then find &#8216;Advcha_HelloWorld&#8217; record and remove it. Then run again <span style=\"color: #ffff00;\">php bin\/magento setup:upgrade<\/span>.<br \/>\nIf you find this error<\/p>\n<pre class=\"lang:default decode:true \">[Zend_Db_Exception]                                                          \r\n  There is no field \"sample_upload_file\" that you are trying to create an index on \"advcha_helloworld_post\"<\/pre>\n<p>This mean you haven&#8217;t define &#8216;sample_upload_file&#8217; field in InstallSchema.php file above. Please look again the above file carefully or see the file from the github: <a href=\"https:\/\/github.com\/mageplaza\/magento-2-sample-module\/blob\/master\/Setup\/InstallSchema.php\">https:\/\/github.com\/mageplaza\/magento-2-sample-module\/blob\/master\/Setup\/InstallSchema.php<\/a>.<br \/>\n<span style=\"background-color: #0000ff;\">Create Model<\/span><br \/>\nFirst create an interface in <span style=\"color: #ffff00;\">PostInterface.php<\/span> file in <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/Model\/Api\/Data\/<\/span> directory.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?php\r\n\r\nnamespace Advcha\\HelloWorld\\Model\\Api\\Data;\r\n\r\ninterface PostInterface {\r\n    public function getId();\r\n    public function setId();\r\n    \r\n    public function getName();\r\n    public function setName();\r\n    \r\n    public function getPostContent();\r\n    public function setPostContent();\r\n}<\/pre>\n<p>This interface has defined the set and get method to table data which we would use when interacting with the model. This interface plays an important role when it comes time to exporting CRUD models to Magento service contracts based API.<br \/>\nNow create a model <span style=\"color: #ffff00;\">Post<\/span> in <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/Model\/Post.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Model;\r\n\r\nuse Magento\\Framework\\Model\\AbstractModel;\r\nuse Magento\\Framework\\DataObject\\IdentityInterface;\r\nuse Advcha\\HelloWorld\\Model\\Api\\Data\\PostInterface;\r\n\r\nclass Post extends AbstractModel implements IdentityInterface,PostInterface {\r\n    const CACHE_TAG = 'advcha_helloworld_post';\r\n\r\n    protected $_cacheTag = 'advcha_helloworld_post';\r\n\r\n    protected $_eventPrefix = 'advcha_helloworld_post';\r\n    \r\n    protected function __construct() {\r\n        $this-&gt;_init('Advcha\\HelloWorld\\Model\\ResourceModel\\Post');\r\n    }\r\n\r\n    public function getIdentities(){\r\n        return [self::CACHE_TAG . '_' . $this-&gt;getId()];\r\n    }\r\n    \r\n    public function getDefaultValues(){\r\n        $values = [];\r\n        \r\n        return $values;\r\n    }\r\n}<\/pre>\n<p><span style=\"color: #ffff00;\">$_eventPrefix<\/span> &#8211; a prefix for events to be triggered<br \/>\n<span style=\"color: #ffff00;\">$_eventObject<\/span> &#8211; a object name when access in event<br \/>\n<span style=\"color: #ffff00;\">$_cacheTag<\/span> &#8211; a unique identifier for use within caching<br \/>\n<span style=\"background-color: #0000ff;\">Create a Resource Model<\/span><br \/>\nthe model file contain overall database logic, it do not execute sql queries. The resource model will do that. Now we will create the Resource Model for this table: <span style=\"color: #ffff00;\">Advcha\\HelloWorld\\Model\\ResourceModel\\Post.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Model\\ResourceModel;\r\n\r\nuse Magento\\Framework\\Model\\ResourceModel\\Db\\AbstractDb;\r\nuse Magento\\Framework\\Stdlib\\DateTime\\DateTime;\r\nuse Magento\\Framework\\Model\\ResourceModel\\Db\\Context;\r\nuse Magento\\Framework\\Model\\AbstractModel;\r\n\r\nclass Post extends AbstractDb {\r\n    \/**\r\n        * Date model\r\n        * \r\n        * @var \\Magento\\Framework\\Stdlib\\DateTime\\DateTime\r\n        *\/\r\n    protected $_date;\r\n\r\n    \/**\r\n        * constructor\r\n        * \r\n        * @param \\Magento\\Framework\\Stdlib\\DateTime\\DateTime $date\r\n        * @param \\Magento\\Framework\\Model\\ResourceModel\\Db\\Context $context\r\n        *\/\r\n    protected function __construct(DateTime $date, Context $context) {\r\n        $this-&gt;_date = $date;\r\n        parent::__construct($context);\r\n    }\r\n    \/**\r\n        * Initialize resource model\r\n        *\r\n        * @return void\r\n        *\/\r\n    public function _construct(){\r\n        $this-&gt;_init('advcha_helloworld_post', 'post_id');\r\n    }\r\n    \/**\r\n        * Retrieves Post Name from DB by passed id.\r\n        *\r\n        * @param string $id\r\n        * @return string|bool\r\n        *\/\r\n    public function getPostNameById($id){\r\n        $adapter = $this-&gt;getConnection();\r\n        $select = $adapter-&gt;select()\r\n                -&gt;from($this-&gt;getMainTable(), 'name')\r\n                -&gt;where('post_id = :post_id');\r\n        $binds = ['post_id' =&gt; (int)$id];\r\n        return $adapter-&gt;fetchOne($select, $binds);\r\n    }\r\n    \/**\r\n        * before save callback\r\n        *\r\n        * @param \\Magento\\Framework\\Model\\AbstractModel|\\Mageplaza\\HelloWorld\\Model\\Post $object\r\n        * @return $this\r\n        *\/\r\n    protected function _beforeSave(AbstractModel $object) {\r\n        $object-&gt;setUpdateAt($this-&gt;_date-&gt;date());\r\n        if($object-&gt;isObjectNew()){\r\n            $object-&gt;setCreatedAt($this-&gt;_date-&gt;date());\r\n        }\r\n        return parent::_beforeSave($object);\r\n    }\r\n}<\/pre>\n<p><span style=\"background-color: #0000ff;\">Resource Model Collection &#8211; Get Model Collection<\/span><br \/>\nThe collection model is considered a resource model which allow us to filter and fetch a collection table data. The collection model will be placed in: <span style=\"color: #ffff00;\">Advcha\\HelloWorld\\Model\\ResourceModel\\Post\\Collection.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Model\\ResourceModel\\Post;\r\n\r\nuse Magento\\Framework\\Model\\ResourceModel\\Db\\Collection\\AbstractCollection;\r\n\r\nclass Collection extends AbstractCollection\r\n{\r\n    protected $_idFieldName = 'post_id';\r\n    protected $_eventPrefix = 'advcha_helloworld_post_collection';\r\n    protected $_eventObject = 'post_collection';\r\n\r\n    \/**\r\n     * Define resource model\r\n     *\r\n     * @return void\r\n     *\/\r\n    protected function _construct()\r\n    {\r\n        $this-&gt;_init('Advcha\\HelloWorld\\Model\\Post', 'Advcha\\HelloWorld\\Model\\ResourceModel\\Post');\r\n    }\r\n\r\n    \/**\r\n     * Get SQL for get record count.\r\n     * Extra GROUP BY strip added.\r\n     *\r\n     * @return \\Magento\\Framework\\DB\\Select\r\n     *\/\r\n    public function getSelectCountSql()\r\n    {\r\n        $countSelect = parent::getSelectCountSql();\r\n        $countSelect-&gt;reset(\\Zend_Db_Select::GROUP);\r\n        return $countSelect;\r\n    }\r\n    \/**\r\n     * @param string $valueField\r\n     * @param string $labelField\r\n     * @param array $additional\r\n     * @return array\r\n     *\/\r\n    protected function _toOptionArray($valueField = 'post_id', $labelField = 'name', $additional = [])\r\n    {\r\n        return parent::_toOptionArray($valueField, $labelField, $additional);\r\n    }\r\n}<\/pre>\n<p><span style=\"background-color: #0000ff;\">Factory Object and create Block Post<\/span><br \/>\nCreate a Post block: <span style=\"color: #ffff00;\">Advcha\\HelloWorld\\Block\\Post.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Block;\r\n\r\nuse Magento\\Framework\\View\\Element\\Template;\r\nuse Magento\\Framework\\View\\Element\\Template\\Context;\r\nuse Advcha\\HelloWorld\\Model\\PostFactory;\r\n\r\nclass Post extends Template\r\n{\r\n    protected $_postFactory;\r\n    public function _construct(Context $context, PostFactory $postFactory){\r\n        $this-&gt;_postFactory = $postFactory;\r\n        parent::_construct($context);\r\n    }\r\n\r\n    public function _prepareLayout()\r\n    {\r\n        $post = $this-&gt;_postFactory-&gt;create();\r\n        $collection = $post-&gt;getCollection();\r\n        foreach($collection as $item){\r\n                var_dump($item-&gt;getData());\r\n        }\r\n        exit;\r\n    }\r\n}<\/pre>\n<p>Then how to run this CRUD?<\/p>\n<p><span style=\"background-color: #0000ff;\">Create View: Block, Layouts, Templates<\/span><br \/>\nref: <a href=\"https:\/\/www.mageplaza.com\/magento-2-module-development\/view-block-layout-template-magento-2.html\">https:\/\/www.mageplaza.com\/magento-2-module-development\/view-block-layout-template-magento-2.html<\/a><br \/>\nHere we want to create a module to show\/display a text on the magento frontend.<br \/>\nA View will be use to output representation of the page. In Magento 2, View is built by three path: <span style=\"color: #ffff00;\">block, layout and template<\/span>.<br \/>\n<span style=\"background-color: #0000ff;\">Call view in controller<\/span><br \/>\nIn the previous Hello World Module topic, we have build a simple module and show the Hello World message on the screen directly by controller. Now we will edit it to call view to render page. File: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/Controller\/Index\/Display.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Controller\\Index;\r\n\r\nuse Magento\\Framework\\App\\Action\\Action;\r\nuse Magento\\Framework\\App\\Action\\Context;\r\nuse Magento\\Framework\\View\\Result\\PageFactory;\r\n\r\nclass Display extends Action\r\n{\r\n    protected $_pageFactory;\r\n    public function __construct(Context $context, PageFactory $pageFactory){\r\n        $this-&gt;_pageFactory = $pageFactory;\r\n        return parent::__construct($context);\r\n    }\r\n    \r\n    public function execute(){\r\n        \/\/echo 'Hello World!';\r\n        \/\/exit;\r\n        return $this-&gt;_pageFactory-&gt;create();\r\n    }\r\n}<\/pre>\n<p><span style=\"background-color: #0000ff;\">Create layout file .xml<\/span><br \/>\nThe Layout is the major path of view layer in Magento 2 module. The layout file is a XML file which will define the page structure and will be locate in <span style=\"color: #ffff00;\">{module_root}\/view\/{area}\/layout\/<\/span> directory. The Area path can be <span style=\"color: #ffff00;\">frontend<\/span> or <span style=\"color: #ffff00;\">adminhtml<\/span> which define where the layout will be applied.<br \/>\nThere is a special layout file name <span style=\"color: #ffff00;\">default.xml<\/span> which will be applied for all the page in it\u2019s area. Otherwise, the layout file will have name as format: <span style=\"color: #ffff00;\">{router_id}_{controller_name}_{action_name}.xml<\/span>. We can find the frontend <span style=\"color: #ffff00;\">{router_id} is helloworld<\/span> in <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/etc\/frontend\/routes.xml<\/span>. The\u00a0<span style=\"color: #ffff00;\">{controller_name}<\/span> is <span style=\"color: #ffff00;\">index<\/span> and <span style=\"color: #ffff00;\">{action_name}<\/span> is <span style=\"color: #ffff00;\">display (from Display.php where Action exist: Magento\\Framework\\App\\Action\\Action)<\/span>. We will create a layout handle file for this module: File: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/view\/frontend\/layout\/helloworld_index_display.xml<\/span>.<\/p>\n<pre class=\"lang:default decode:true\">&lt;?xml version=\"1.0\"?&gt;\r\n&lt;page xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" layout=\"1column\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\"&gt;\r\n    &lt;referenceContainer name=\"content\"&gt;\r\n        &lt;block class=\"Advcha\\HelloWorld\\Block\\Display\" name=\"helloworld_display\" template=\"Advcha_HelloWorld::sayhello.phtml\" \/&gt;\r\n    &lt;\/referenceContainer&gt;\r\n&lt;\/page&gt;<\/pre>\n<p>Block class: <span style=\"color: #ffff00;\">Advcha\\HelloWorld\\Block\\Display<\/span>, Template file: <span style=\"color: #ffff00;\">Advcha_HelloWorld::sayhello.phtml<\/span>.<br \/>\n<span style=\"background-color: #0000ff;\">Create block<\/span><br \/>\nThe Block file should contain all the view logic required, it should not contain any kind of html or css. Block file are supposed to have all application view logic. Create a file: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/Block\/Display.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\nnamespace Advcha\\HelloWorld\\Block;\r\n\r\nuse Magento\\Framework\\View\\Element\\Template;\r\nuse Magento\\Framework\\View\\Element\\Template\\Context;\r\n\r\nclass Display extends Template {\r\n    public function __construct(Context $context) {\r\n        parent::__construct($context);\r\n    }\r\n    \r\n    public function sayHello(){\r\n        return __('Hello World, Advcha!');\r\n    }\r\n}<\/pre>\n<p>Every block in Magento 2 must extend from <span style=\"color: #ffff00;\">Magento\\Framework\\View\\Element\\Template<\/span>. In this block we will define a method <span style=\"color: #ffff00;\">sayHello()<\/span> to show the word \u201cHello World, Advcha!\u201d. We will use it in template file.<br \/>\n<span style=\"background-color: #0000ff;\">Create template file<\/span><br \/>\nCreate a template file call <span style=\"color: #ffff00;\">sayhello.phtml<\/span>: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/view\/frontend\/templates\/sayhello.phtml<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\necho $block-&gt;sayHello();<\/pre>\n<p>In the layout file, we define the template by <span style=\"color: #ffff00;\">Advcha_HelloWorld::sayhello.phtml<\/span>. It mean that Magento will find the file name <span style=\"color: #ffff00;\">sayhello.phtml<\/span> in templates folder of module <span style=\"color: #ffff00;\">Advcha_HelloWorld<\/span>. The template folder of the module is <span style=\"color: #ffff00;\">app\/code\/{vendor_name}\/{module_name}\/view\/frontend\/templates\/<\/span>.<br \/>\nIn the template file, we can use the variable <span style=\"color: #ffff00;\">$block<\/span> for the block object. As you see, we call the method <span style=\"color: #ffff00;\">sayHello()<\/span> in Block. It\u2019s done, please access to this page again (<a href=\"http:\/\/magentoce215.dev\/helloworld\/index\/display\">http:\/\/magentoce215.dev\/helloworld\/index\/display<\/a>) and see the result.<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2235\" src=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_helloworld_display.png\" alt=\"\" width=\"614\" height=\"551\" srcset=\"https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_helloworld_display.png 614w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_helloworld_display-300x269.png 300w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/>If you find an error like this (put &#8220;<span style=\"color: #ffff00;\">ini_set(&#8216;display_errors&#8217;, &#8216;1&#8217;);<\/span>&#8221; in root index.php and \/pub\/index.php):<\/p>\n<pre class=\"lang:default decode:true \">Fatal error: Uncaught TypeError: Argument 2 passed to Advcha\\HelloWorld\\Controller\\Index\\Display::__construct() must be an instance of Magento\\Framework\\View\\Result\\PageFactory, none given, called in \/home\/teddy\/Documents\/works\/magentoce215\/var\/generation\/Advcha\/HelloWorld\/Controller\/Index\/Display\/Interceptor.php on line 14 and defined in \/home\/teddy\/Documents\/works\/magentoce215\/app\/code\/Advcha\/HelloWorld\/Controller\/Index\/Display.php on line 1<\/pre>\n<p>Then run this command:\u00a0<span style=\"color: #ffff00;\">php bin\/magento setup:upgrade<\/span> then refresh your browser.<\/p>\n<p><span style=\"background-color: #0000ff;\">The Backend &#8211; system.xml Configuration<\/span><br \/>\nref: <a href=\"https:\/\/www.mageplaza.com\/magento-2-module-development\/create-system-xml-configuration-magento-2.html\">https:\/\/www.mageplaza.com\/magento-2-module-development\/create-system-xml-configuration-magento-2.html<\/a><br \/>\n<span style=\"background-color: #0000ff;\">Create System.xml<\/span><br \/>\nIn the admin page, the magento 2 system configuration page is divided logically in few parts: <span style=\"color: #ffff00;\">Tabs, Sections, Groups, Fields<\/span>. <a href=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/system_conf_image.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-2238\" src=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/system_conf_image-1024x320.png\" alt=\"\" width=\"840\" height=\"263\" srcset=\"https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/system_conf_image-1024x320.png 1024w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/system_conf_image-300x94.png 300w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/system_conf_image-768x240.png 768w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/system_conf_image.png 1180w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/a>So let\u2019s start to create a simple configuration for the simple Module <span style=\"color: #ffff00;\">Hello World<\/span>. The <span style=\"color: #ffff00;\">system.xml<\/span> is located in <span style=\"color: #ffff00;\">etc\/adminhtml<\/span> directory of the module, we will create it a new <span style=\"color: #ffff00;\">Tab<\/span> for our vendor \u201c<span style=\"color: #ffff00;\">Advcha<\/span>\u201d, a new <span style=\"color: #ffff00;\">Section<\/span> for our module <span style=\"color: #ffff00;\">Hello World<\/span>, a <span style=\"color: #ffff00;\">Group<\/span> to contain some simple <span style=\"color: #ffff00;\">fields<\/span>: enable module and text. File: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/etc\/adminhtml\/system.xml<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?xml version=\"1.0\"?&gt;\r\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:module:Magento_Config:etc\/system_file.xsd\"&gt;\r\n    &lt;system&gt;\r\n        &lt;tab id=\"advcha\" translate=\"label\" sortOrder=\"10\"&gt;\r\n            &lt;label&gt;Advcha&lt;\/label&gt;\r\n        &lt;\/tab&gt;\r\n        &lt;section id=\"helloworld\" translate=\"label\" sortOrder=\"130\" showInDefault=\"1\" showInWebsite=\"1\" showInStore=\"1\"&gt;\r\n            &lt;class&gt;separator-top&lt;\/class&gt;\r\n            &lt;label&gt;Hello World&lt;\/label&gt;\r\n            &lt;tab&gt;advcha&lt;\/tab&gt;\r\n            &lt;resource&gt;Advcha_HelloWorld::hello_configuration&lt;\/resource&gt;\r\n            &lt;group id=\"general\" translate=\"label\" type=\"text\" sortOrder=\"10\" showInDefault=\"1\" showInWebsite=\"0\" showInStore=\"0\"&gt;\r\n                &lt;label&gt;General Configuration&lt;\/label&gt;\r\n                &lt;field id=\"enable\" translate=\"label\" type=\"select\" sortOrder=\"1\" showInDefault=\"1\" showInWebsite=\"0\" showInStore=\"0\"&gt;\r\n                    &lt;label&gt;Module Enable&lt;\/label&gt;\r\n                    &lt;source_model&gt;Magento\\Config\\Model\\Config\\Source\\Yesno&lt;\/source_model&gt;\r\n                &lt;\/field&gt;\r\n                &lt;field id=\"display_text\" translate=\"label\" type=\"text\" sortOrder=\"1\" showInDefault=\"1\" showInWebsite=\"0\" showInStore=\"0\"&gt;\r\n                    &lt;label&gt;Display Text&lt;\/label&gt;\r\n                    &lt;comment&gt;This text will display on the frontend.&lt;\/comment&gt;\r\n                &lt;\/field&gt;\r\n            &lt;\/group&gt;\r\n        &lt;\/section&gt;\r\n    &lt;\/system&gt;\r\n&lt;\/config&gt;<\/pre>\n<p><span style=\"background-color: #0000ff;\">Set default value<\/span><br \/>\nEach field in <span style=\"color: #ffff00;\">system.xml<\/span> after create will not have any value. When you call them, you will receive \u2018null\u2019 result. So for the module, we will need to set the default value for the field and you will call the value without go to config, set value and save it. This default value will be saved in <span style=\"color: #ffff00;\">config.xml<\/span> which is located in etc folder. Let\u2019s create it for this simple configuration: File: <span style=\"color: #ffff00;\">app\/code\/Advcha\/HelloWorld\/etc\/config.xml<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?xml version=\"1.0\"?&gt;\r\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:module:Magento_Store:etc\/config.xsd\"&gt;\r\n    &lt;default&gt;\r\n        &lt;helloworld&gt;\r\n            &lt;general&gt;\r\n                &lt;enable&gt;1&lt;\/enable&gt;\r\n                &lt;display_text&gt;Hello World, Advcha!&lt;\/display_text&gt;\r\n            &lt;\/general&gt;\r\n        &lt;\/helloworld&gt;\r\n    &lt;\/default&gt;\r\n&lt;\/config&gt;<\/pre>\n<p>You can put the path to the field in the <span style=\"color: #ffff00;\">&lt;default&gt;<\/span> element to set value default for it. The format is:<\/p>\n<pre class=\"lang:default decode:true \">&lt;default&gt;\r\n    &lt;section_id&gt;\r\n        &lt;group_id&gt;\r\n            &lt;field_id&gt;{value}&lt;\/field_id&gt;\r\n        &lt;\/group_id&gt;\r\n    &lt;\/section_id&gt;\r\n&lt;\/default_id&gt;<\/pre>\n<p><a href=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_advcha_system_config.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2239\" src=\"http:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_advcha_system_config.png\" alt=\"\" width=\"1005\" height=\"389\" srcset=\"https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_advcha_system_config.png 1005w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_advcha_system_config-300x116.png 300w, https:\/\/myprojects.advchaweb.com\/wp-content\/uploads\/2017\/04\/magento2_advcha_system_config-768x297.png 768w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/a>We need to flush the cache and see the result above.<br \/>\n<span style=\"background-color: #0000ff;\">Get value from configuration<\/span><br \/>\nFirst all of let\u2019s save value and flush cache, then you can get saved value from database. In the <span style=\"color: #ffff00;\">system.xml<\/span>, we have added 2 fields: <span style=\"color: #ffff00;\">enable<\/span> and <span style=\"color: #ffff00;\">display_text<\/span>. So the path should be: <span style=\"color: #ffff00;\">helloworld\/general\/enable<\/span> and <span style=\"color: #ffff00;\">helloworld\/general\/display_text<\/span>. We can call them through simple calling or use helper (recommended). Also please read for more samples:\u00a0 <a href=\"http:\/\/magento.stackexchange.com\/questions\/87789\/magento2-how-to-get-data-from-system-configuration\">http:\/\/magento.stackexchange.com\/questions\/87789\/magento2-how-to-get-data-from-system-configuration<\/a><br \/>\n<span style=\"background-color: #0000ff;\">Simple calling<\/span>:<\/p>\n<pre class=\"lang:default decode:true \">$this-&gt;scopeConfig-&gt;getValue('helloworld\/general\/enable', \\Magento\\Store\\Model\\ScopeInterface::SCOPE_STORE);\r\n$this-&gt;scopeConfig-&gt;getValue('helloworld\/general\/display_text', \\Magento\\Store\\Model\\ScopeInterface::SCOPE_STORE);<\/pre>\n<p><span style=\"background-color: #0000ff;\">Create a helper file (standard)<\/span><br \/>\nCreate file: <span style=\"color: #ffff00;\">Advcha\/HelloWorld\/Helper\/Data.php<\/span>.<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\n\r\nnamespace Advcha\\HelloWorld\\Helper;\r\n\r\nuse Magento\\Framework\\App\\Helper\\AbstractHelper;\r\nuse Magento\\Store\\Model\\StoreManagerInterface;\r\nuse Magento\\Framework\\ObjectManagerInterface;\r\nuse Magento\\Framework\\App\\Helper\\Context;\r\nuse Magento\\Store\\Model\\ScopeInterface;\r\n\r\nclass Data extends AbstractHelper\r\n{\r\n    protected $storeManager;\r\n    protected $objectManager;\r\n\r\n    const XML_PATH_HELLOWORLD = 'helloworld\/';\r\n\r\n    public function __construct(Context $context,\r\n        ObjectManagerInterface $objectManager,\r\n        StoreManagerInterface $storeManager\r\n    ) {\r\n        $this-&gt;objectManager = $objectManager;\r\n        $this-&gt;storeManager  = $storeManager;\r\n        parent::__construct($context);\r\n    }\r\n\r\n    public function getConfigValue($field, $storeId = null)\r\n    {\r\n        return $this-&gt;scopeConfig-&gt;getValue(\r\n            $field, ScopeInterface::SCOPE_STORE, $storeId\r\n        );\r\n    }\r\n\r\n    public function getGeneralConfig($code, $storeId = null)\r\n    {\r\n        return $this-&gt;getConfigValue(self::XML_PATH_HELLOWORLD . $code, $storeId);\r\n    }\r\n}<\/pre>\n<p>Now we can get those value and call the helper from .phtml file like this:<\/p>\n<pre class=\"lang:default decode:true \">$helper = $this-&gt;objectManager-&gt;create('Advcha\\HelloWorld\\Helper\\Data');\r\necho $helper-&gt;getGeneralConfig('enable');\r\necho $helper-&gt;getGeneralConfig('display_text');<\/pre>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ref: https:\/\/www.mageplaza.com\/magento-2-module-development\/ The module is a directory that contains blocks, controllers, models, helper, etc &#8211; that are related to a specific business feature. In Magento 2, modules will be live in app\/code directory of a Magento installation, with this format: app\/code\/&lt;Vendor&gt;\/&lt;ModuleName&gt;. I use Magento 2.1.5 CE. Here is the installation steps. Create Hello World module &hellip; <a href=\"https:\/\/myprojects.advchaweb.com\/index.php\/2017\/04\/01\/magento-2-module-development\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Magento 2 Module Development&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71,98,13],"tags":[],"class_list":["post-2188","post","type-post","status-publish","format-standard","hentry","category-magento","category-magento-tutorial","category-tutorial"],"_links":{"self":[{"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/posts\/2188","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/comments?post=2188"}],"version-history":[{"count":25,"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/posts\/2188\/revisions"}],"predecessor-version":[{"id":4368,"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/posts\/2188\/revisions\/4368"}],"wp:attachment":[{"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/media?parent=2188"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/categories?post=2188"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/myprojects.advchaweb.com\/index.php\/wp-json\/wp\/v2\/tags?post=2188"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}