STEP-3 Backend Configurations Settings

In this step we going to create Module backend configurations
​STEP-3​
For our implementation, we need several backend configurations
Enabled
Button Type (Rounded, Square)
Button Size
Display on Yes/No
Homepage
Category Page
Product Page
Facebook
Enable 
Enable Counter
Facebook Messenger
Enable
Messenger app ID
Telegram
Enable
Whatsapp
Enable
LinkedIn
Enable
Email
Enable
Subject Suffix
Let’s create them.
1.Create adminhtml folder in <MODULE ROOT>/etc and system folder in it
2.create system.xml in <MODULE ROOT>/etc/adminhtml
ScandiPWA/SocialShareGraphQl/etc/adminhtml/system.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
   <system>
       <tab id="scandipwa" translate="label" sortOrder="100">
           <label>Scandipwa</label>
       </tab>
       <include path="ScandiPWA_SocialShareGraphQl::system/social_share.xml"/>
   </system>
</config>
   3. Create social_share.xml in <MODULE ROOT>/etc/adminhtml/system
ScandiPWA/SocialShareGraphQl/etc/adminhtml/system/social_share.xml
<?xml version="1.0"?>
<include xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_include.xsd">
   <section id="socialshare" translate="label" type="text" sortOrder="1000" showInDefault="1" showInWebsite="0" showInStore="0">
       <label>Social Share</label>
       <tab>scandipwa</tab>
       <resource>ScandiPWA_SocialShareGraphQl::social_share</resource>
<!--        General-->
       <group id="general" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>General Settings</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
​
           <field id="rounded" translate="label" type="select" sortOrder="2" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Rounded Icons</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
​
           <field id="size" translate="label" type="text" sortOrder="3" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Icon Size</label>
               <comment>in pixel's</comment>
           </field>
​
           <field id="home_page" translate="label" type="select" sortOrder="4" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Display On HomePage</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
​
           <field id="category_page" translate="label" type="select" sortOrder="5" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Display On Product Page</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
​
           <field id="product_page" translate="label" type="select" sortOrder="6" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Display On Category Page</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
       </group>
<!--        FaceBook-->
       <group id="facebook" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>Facebook</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable Facebook</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
​
           <field id="enable_counter" translate="label" type="select" sortOrder="2" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable Facebook Counter</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
       </group>
<!--        Facebook Messenger-->
       <group id="facebook_messenger" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>Facebook Messenger</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable Facebook Messenger</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
​
           <field id="app_id" translate="text" type="text" sortOrder="2" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Facebook Messenger App ID</label>
           </field>
       </group>
<!--        Telegram-->
       <group id="telegram" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>Telegram</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable Telegram</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
       </group>
<!--        WhatsApp-->
       <group id="whatsapp" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>WhatsApp</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable WhatsApp</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
       </group>
<!--        LinkedIn-->
       <group id="linkedin" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>LinkedIn</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable LinkedIn</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
       </group>
<!--        Email-->
       <group id="email" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
           <label>Email</label>
           <field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Enable Email</label>
               <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
           </field>
           <field id="suffix" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0">
               <label>Email Subject Suffix</label>
           </field>
       </group>
   </section>
</include>
   4. Create config.xml  in <MODULE ROOT>/etc/
ScandiPWA/SocialShareGraphQl/etc/config.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Store:etc/config.xsd">
   <default>
       <socialshare>
           <general>
               <enable>0</enable>
               <rounded>1</rounded>
               <size>35</size>
               <home_page>0</home_page>
               <category_page>0</category_page>
               <product_page>1</product_page>
           </general>
           <facebook>
               <enable>0</enable>
               <enable_counter>0</enable_counter>
           </facebook>
           <facebook_messenger>
               <enable>0</enable>
           </facebook_messenger>
           <telegram>
               <enable>0</enable>
           </telegram>
           <whatsapp>
               <enable>0</enable>
           </whatsapp>
           <linkedin>
               <enable>0</enable>
           </linkedin>
           <email>
               <enable>0</enable>
               <suffix>ScandiPWA</suffix>
           </email>
       </socialshare>
   </default>
</config>
​
   5. run cache:flush
   6. Navigate to Magento backend dashboard STORE -> Settings -> Configuration, expand SCANDIPWA  you should see Social Share Option
Could not load image
STEP-1 and 2 Creating Magento 2 Module
STEP-4 Simple GraphQl and Resolver
Last modified 1yr ago