How To Create Magento 2 Blocks With Blocks Builder In this post, we will show you how to create magento 2 blocks in 2 ways. The first one is to write code to test out functionality. The second one is to use magento 2 blocks builder. This tool is included in Magento 2 Page Builder extension. Learn more here.
16
Embed
How to create magento 2 blocks with blocks builder
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
How To Create Magento 2 Blocks With Blocks Builder
In this post, we will show you how to create magento 2 blocks in 2 ways. The first one is to write code to test out functionality. The second one is to use magento 2 blocks builder. This tool is included in Magento 2 Page Builder extension. Learn more here.
1. How To Create Magento 2 Blocks by writing code
1.1 Create a module.xml in in app/code/Lof/HelloWorld/etc
1.4 Lets create a block for our module. Create block
file app/code/Lof/HelloWorld/Block/HelloWorld.php
<?phpnamespace LofHelloWorldBlock; /*** Helloworld Block*/class Helloworld extends MagentoFrameworkViewElementTemplate{ public function getTitle() { return __("LOF Hello World"); }}
• 1.5 Create a template file app/code/Lof/HelloWorld/View/frontend/templates/helloworld.phtml
• 1.6 Active Lof_HelloWorld extensionWe have two ways to active Lof_Helloworld extension
1.6.1 Open Command line in folder root of magento and run commands:
php bin/magento setup:upgrade
1.6.2 Directly edit file app/etc/config.xml: In the array module, add the element: ‘Lof_Helloworld’ => 1
1.7. Run the command line refresh cache and check home page
php bin/magento cache:flush
2.How to create block with block builder.
• Ves Block Builder is one of amazing tool that let you to build any type of blocks with ease. This tool included in Magento 2 Page Builder extension
2.1 Add block profile
2.2 Design your block
– Prefix class: This class is to custom– Enable container: If you want to enable container, you can select yes and vice versa– Use backup layout: You can take use of backup layout from select box– Design in: This funtions lets you create responsive blocks on lagre screen, laptop, tablets, mobile.