How to create simple dynamic section with block in Shopify liquid in theme

add {% section 'contactpagefaq' %} on your template file

Create new section file called : contactpagefaq.liquid, and paste following code.

{% if section.settings.faqenable %}

<h2>{{ section.settings.faqtitle }}</h2>   

  {% for block in section.blocks %}  

  

  <button class="accordion">{{ block.settings.sectiontitle }}</button>

          <div class="panel">

            <p>{{ block.settings.sectiontext }}</p>

          </div>

  {% endfor %}

{% endif %}

{% schema %}

{

  "name": "Contact Page FAQ",

  "max_blocks": 5,

  "settings": [

{

          "id": "faqenable",

          "type": "checkbox",

          "label": "Enable",

          "default": true

        },

        {

          "id": "faqtitle",

          "type": "text",

          "label": "Heading",

          "default": "FAQ"

        }

      ],

  "blocks": [

    {

      "type": "select",

      "name": "Block",

      "settings": [

{

          "id": "sectiontitle",

          "type": "text",

          "label": "Title"

        },

        {

          "id": "sectiontext",

          "type": "textarea",

          "label": "Text"

        }

      ]

    }

  ]

}

{% endschema %}

{% stylesheet %}

{% endstylesheet %}

{% javascript %}

{% endjavascript %}

How to override third party vendor block file in magento 2.2

If you need to override third party or Magento file from vendor directory

Here I override Block file "/var/www/html/magento/magentoproject/vendor/onestop/image-server/Block/Product/View/Gallery.php"

FYI : You need to create new extension when you wish to override default Vendor or Magento file

1. Create new Extension - Jaydip (Namespace)

2. Create Module directory - ImagegalleryAlt (Modulename)

3. Create new file like ( /var/www/html/magento/magentoproject/app/code/Jaydip/ImagegalleryAlt/etc/di.xml )

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
  <preference for="Onestop\ImageServer\Block\Product\View\Gallery" type="Jaydip\ImagegalleryAlt\Block\Product\View\Gallery" />
</config>

4. Create new directory "etc" and create file like : /var/www/html/magento/magentoproject/app/code/Jaydip/ImagegalleryAlt/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Jaydip_ImagegalleryAlt" setup_version="0.1.1">
        <sequence>
            <module name="Magento_Catalog"/>
            <module name="Onestop_ImageServer"/>
        </sequence>
    </module>
</config>

5. Create new directory "Block/Product/View" and create file like : /var/www/html/magento/magentoproject/app/code/Jaydip/ImagegalleryAlt/Block/Product/View/Gallery.php

• Copy file from old directory and paste to : /var/www/html/magento/magentoproject/app/code/Jaydip/ImagegalleryAlt/Block/Product/View/Gallery.php

• Open : /var/www/html/magento/magentoproject/app/code/Jaydip/ImagegalleryAlt/Block/Product/View/Gallery.php

• Change namespace like : namespace Jaydip\ImagegalleryAlt\Block\Product\View;

6. Upgrade data in Magento 2
php -dmemory_limit=5G bin/magento setup:upgrade

7. Static Content Deploy data  in Magento 2
php -dmemory_limit=5G bin/magento setup:static-content:deploy -f

8. Finish!!!