Magentoめも

Magento2 moduleの作成

Magento2はModules, Themes, Language Packagesの3つから成り立っています。たぶん。

app/code 以下に作成することでモジュールを作成できるようです。

設定ファイルの作成

app/code/VendorName/ModuleName/ の構成になります。
VendorName = Yassujp
ModuleName = HelloWorld とします。

app/code/Yassujp/HelloWorld/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/Module/etc/module.xsd">
    <module name="Yassujp_HelloWorld" setup_version="0.0.0">
    </module>
</config>

app/code/Yassujp/HelloWorld/registration.php

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

上記2つのファイルを作成したら、コンソールから以下のコマンドを実行します。

php bin/magento setup:upgrade

ずらずら表示される中に Module 'Yassujp_HelloWorld': が確認できるはずです。

モジュールの一覧は以下で確認できます。
STORES - Configuration - ADVANCED - Advanced

Yassujp_HelloWorld.png

管理画面に設定メニューを追加する

idとfrontNameを定義します。

app/code/Yassujp/HelloWorld/etc/adminhtml/routes.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../lib/internal/Magento/Framework/App/etc/routes.xsd">
    <router id="admin">
        <route id="yassujp_helloworld" frontName="yassujp_helloworld">
            <module name="Yassujp_HelloWorld" />
        </route>
    </router>
</config>

フォームを定義します。

app/code/Yassujp/HelloWorld/etc/adminhtml/system.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../Magento/Config/etc/system_file.xsd">
    <system>
        <tab id="yassujp" translate="label" sortOrder="10">
            <label>Yassujp</label>
        </tab>
        <section id="yassujp_helloworld" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1">
            <label>Yassujp_HelloWorld</label>
            <tab>yassujp</tab>
            <resource>Yassujp_HelloWorld::yassujp_helloworld</resource>
            <group id="general" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="0" showInStore="0">
                <label>General</label>
                <field id="enable" translate="label comment" type="select" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1">
                    <label>Enable Hello World</label>
                    <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
                    <comment>
                        Comment for `Enable Hello World` setting.
                    </comment>
                </field>
                <field id="block_label" translate="label" type="text" sortOrder="20" showInDefault="1" showInWebsite="1" showInStore="1">
                    <label>Block Label</label>
                </field>
                <field id="text_align" translate="label" type="select" sortOrder="30" showInDefault="1" showInWebsite="1" showInStore="1">
                    <label>Text Align</label>
                    <source_model>Yassujp\HelloWorld\Model\Source\Align</source_model>
                </field>
            </group>
        </section>
    </system>
</config>

Yes / No の選択肢は Magento\Config\Model\Config\Source\Yesno を利用します。
vendor\magento\module-config\Model\Config\Source\Yesno.php

テキスト位置の選択肢は別途定義します。

app/code/Yassujp/HelloWorld/Model/Source/Align.php

<?php

namespace Yassujp\HelloWorld\Model\Source;

class Align implements \Magento\Framework\Option\ArrayInterface
{
    public function toOptionArray()
    {
        return [['value' => 'left', 'label' => __('Left Position')], ['value' => 'center', 'label' => __('Center Position')], ['value' => 'right', 'label' => __('Right Position')]];
    }

    public function toArray()
    {
        return ['left' => __('Left Position'), 'center' => __('Center Position'), 'right' => __('Right Position')];
    }
}

STORES - Configuration にて作成したモジュールのフォームが表示されていれば成功です。

Yassujp_HelloWorld2.png

保存した設定は core_config_data テーブルに格納されます。

参考


添付ファイル: fileYassujp_HelloWorld.png 963件 [詳細] fileYassujp_HelloWorld2.png 996件 [詳細]

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2021-09-19 (日) 19:09:24