วิธีสร้างส่วนขยายของ Hello World ใน Magento 2

เรากำลังจะสร้างส่วนขยายที่ง่ายมากใน Magento 2 เมื่อเสร็จแล้ว เอาต์พุตของส่วนขยายจะบอกว่า "สวัสดี Weblizar นี่เป็นส่วนขยายแรกของ Hello world Magento! ” ในเนื้อหาบล็อกบนเส้นทางส่วนหน้าที่กำหนดเอง ให้เราเรียนรู้วิธีสร้างส่วนขยายในวีโอไอพี 2 โดยมีสวัสดีชาวโลกเป็นผลงานของเรา

ความต้องการ :

ในรายการ คุณมี Magento 2 เวอร์ชันล่าสุดซึ่งปัจจุบันเป็น 2.1 มีการติดตั้งบนระบบท้องถิ่นของคุณ

ก่อนที่เราจะเริ่มต้นการพัฒนาส่วนขยาย Magento 2 มีสองสิ่งที่คนมักจะลืมและเราแนะนำให้คุณทำ:

1. ปิดการใช้งาน Magento cache

การปิดใช้งาน Magento cache ระหว่างการพัฒนาจะช่วยคุณประหยัดเวลา เนื่องจากคุณไม่จำเป็นต้องล้างแคชด้วยตนเองทุกครั้งที่ทำการเปลี่ยนแปลงโค้ด

วิธีที่ง่ายที่สุดในการปิดการใช้งานแคชคือไปที่ Admin => System => Cache Management => เลือกประเภทแคชทั้งหมดและปิดการใช้งาน

2. ใส่ Magento ในโหมดนักพัฒนา

คุณควรตั้งค่า Magento ให้อยู่ในโหมดนักพัฒนาซอฟต์แวร์เพื่อให้แน่ใจว่าคุณจะเห็นข้อผิดพลาดทั้งหมดที่ Magento ส่งถึงคุณ

ในการดำเนินการนี้ ให้เปิดเทอร์มินัลแล้วไปที่รูทของ Magento 2 จากนั้นคุณควรรันคำสั่งต่อไปนี้:

php bin/magento ปรับใช้:โหมด:ตั้งค่านักพัฒนา

วิธีสร้างส่วนขยายใน Magento:

การสร้างไฟล์นามสกุลและโฟลเดอร์:
การตั้งค่าส่วนขยาย
ขั้นตอนแรกคือการสร้างโฟลเดอร์ส่วนขยายและไฟล์ที่จำเป็นในการลงทะเบียนส่วนขยาย Magento
1. สร้างโฟลเดอร์ต่อไปนี้:

• แอพ/รหัส/Weblizar
• แอพ/รหัส/Weblizar/Helloworld

โฟลเดอร์ Weblizar คือเนมสเปซส่วนขยาย และ Helloworld เป็น ชื่อ ส่วนขยาย
หมายเหตุ: หากคุณไม่มีโฟลเดอร์รหัสในไดเรกทอรีของแอป ให้สร้างขึ้นด้วยตนเอง

2. ตอนนี้ เรามีโฟลเดอร์ส่วนขยายแล้ว เราต้องสร้างไฟล์ module.XML ในโฟลเดอร์ app/code/Weblizar/Helloworld/etc ด้วยรหัสต่อไปนี้:

<?xml version=”1.0″?>
<config xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”urn:magento:framework:Module/etc/module.xsd”>
<ชื่อโมดูล=”Weblizar_Helloworld” setup_version=”1.0.0″></module>
</config>

3. ในการลงทะเบียนโมดูล ให้สร้างไฟล์ registration.php ในโฟลเดอร์ app/code/Weblizar/Helloworld ด้วยรหัสต่อไปนี้:

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'Weblizar_Helloworld',
__DIR__
); ?>

4. เปิดเทอร์มินัลของคุณและไปที่รูท Magento 2 เรียกใช้จากที่นั่นคำสั่งต่อไปนี้:

การตั้งค่า php bin/magento: อัปเกรด

หากคุณต้องการตรวจสอบให้แน่ใจว่าได้ติดตั้งส่วนขยายแล้ว คุณสามารถไปที่ Admin => Stores => Configuration => Advanced => Advanced และตรวจสอบว่ามีส่วนขยายอยู่ในรายการ หรือคุณสามารถเปิด app/etc/config.php และตรวจสอบอาร์เรย์สำหรับคีย์ 'Weblizar_Helloworld' ซึ่งควรตั้งค่าเป็น 1

การสร้างคอนโทรลเลอร์

1. ก่อนอื่นเราต้องกำหนดเราเตอร์ ในการดำเนินการนี้ ให้สร้างไฟล์ routes.XML ในโฟลเดอร์ app/code/Weblizar/Helloworld/etc/frontend ด้วยรหัสต่อไปนี้:

<?xml version=”1.0″?>
<config xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”urn:magento:framework:App/etc/routes.xsd”>
<รหัสเราเตอร์="มาตรฐาน">
<route id=”helloworld” frontName=”helloworld”>
<ชื่อโมดูล=”Weblizar_Helloworld” />
</route>
</router>
</config>

ที่นี่ เรากำลังกำหนดเราเตอร์ส่วนหน้าและเส้นทางด้วยรหัส ” helloworld “

แอตทริบิวต์ frontName จะเป็นส่วนแรกของ URL ของเรา

ใน Magento 2 URL ถูกสร้างขึ้นด้วยวิธีนี้:
<frontName>/<controler_folder_name>/<controller_class_name>

ในตัวอย่างของเรา URL สุดท้ายจะมีลักษณะดังนี้:

สวัสดีชาวโลก/index/index

2. ตอนนี้ เราสร้างไฟล์คอนโทรลเลอร์ Index.php ในโฟลเดอร์ app/code/Weblizar/Helloworld/Controller/Index ด้วยรหัสต่อไปนี้:

<?php

เนมสเปซ Weblizar\Helloworld\Controller\Index;

ใช้ Magento\Framework\App\Action\Context;

ดัชนีคลาสขยาย \Magento\Framework\App\Action\Action
{
ป้องกัน $_resultPageFactory;

ฟังก์ชันสาธารณะ __construct (บริบท $context, \Magento\Framework\View\Result\PageFactory $resultPageFactory)
{
$this->_resultPageFactory = $resultPageFactory;
ผู้ปกครอง ::__construct($context);
}

ฟังก์ชั่นสาธารณะดำเนินการ ()
{
$resultPage = $this->_resultPageFactory->create(); $resultPage = $นี้->_resultPageFactory->สร้าง();
ส่งคืน $resultPage;
}
}

ใน Magento 2 ทุกการกระทำมีคลาสของตัวเองซึ่งใช้เมธอด execute()

การสร้างบล็อค

เราจะสร้างคลาสบล็อกอย่างง่ายด้วยเมธอด getHelloWorldTxt() ซึ่งส่งคืนสตริง "Hello world"

1. สร้างไฟล์ Helloworld.php ในโฟลเดอร์ app/code/Weblizar/Helloworld/Block ด้วยรหัสต่อไปนี้:

<?php
เนมสเปซ Weblizar\Helloworld\Block;

คลาส Helloworld ขยาย \Magento\Framework\View\Element\Template
{
ฟังก์ชั่นสาธารณะ getHelloWorldTxt()
{
ส่งคืน 'สวัสดี Weblizar นี่คือส่วนขยาย magento โลกสวัสดีครั้งแรกของคุณ!';
}
}

การสร้างไฟล์เลย์เอาต์และเทมเพลต

ใน Magento 2 ไฟล์เค้าโครงและเทมเพลตจะอยู่ในโฟลเดอร์มุมมองภายในส่วนขยายของคุณ ภายในโฟลเดอร์ view เราสามารถมีสามโฟลเดอร์ย่อย: adminhtml, base และ frontend
โฟลเดอร์ adminhtml ใช้สำหรับผู้ดูแลระบบ โฟลเดอร์ส่วนหน้าใช้สำหรับส่วนหน้า และโฟลเดอร์ฐานใช้สำหรับทั้งไฟล์ผู้ดูแลระบบและส่วนหน้า

1. ขั้นแรก เราจะสร้างไฟล์ helloworld_index_index.XML ในโฟลเดอร์ app/code/Weblizar/Helloworld/view/frontend/layout ด้วยรหัสต่อไปนี้:

<หน้า xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”../../../../../../../lib /ภายใน/วีโอไอพี/เฟรมเวิร์ก/
ดู/เลย์เอาต์/etc/page_configuration.xsd” layout=”1column”>
<body>
<referenceContainer name="content">
<คลาสบล็อก=”Weblizar\Helloworld\Block\Helloworld” name=”helloworld” template=”helloworld.phtml” />
</referenceContainer>
</body>
</page>

ทุกหน้ามีเลย์เอาต์และสำหรับแอคชั่นคอนโทรลเลอร์ของเรา แฮนเดิลเลย์เอาต์คือ helloworld_index_index คุณสามารถสร้างไฟล์การกำหนดค่าเลย์เอาต์สำหรับแฮนเดิลเลย์เอาต์ทุกตัว

ในไฟล์เลย์เอาต์ของเรา เราได้เพิ่มบล็อกในคอนเทนเนอร์เนื้อหาและตั้งค่าเทมเพลตของบล็อกของเราเป็น helloworld.phtml ซึ่งเราจะสร้างในขั้นตอนต่อไป

2. สร้างไฟล์ helloworld.phtml ในโฟลเดอร์ app/code/Weblizar/Helloworld/view/frontend/templates ด้วยรหัสต่อไปนี้:

<h1><?php echo $this->getHelloWorldTxt(); ?></h1>

$ตัวแปรนี้อ้างอิงคลาสบล็อกของเรา และเรากำลังเรียกใช้เมธอด getHelloWorldTxt() ซึ่งส่งคืนสตริง 'Hello world!'

และนั่นแหล่ะ เปิด /helloworld/index/index URL ในเบราว์เซอร์ของคุณและคุณควรได้รับสิ่งนี้และ

คลิกที่นี่เพื่อดาวน์โหลดนามสกุล วีโอไอพี Hello world