Add sidebar custom menu in customize theme shopify

1. config --> data_schema.jason file add following code:

Supose you wil add text in headerbar then you will write these code for make dynamic text of headerbar
 {
    "name": "Header",
"settings": [
{
        "type": "header",
        "content": "Top bar"
      },
      {
        "type": "text",
        "id": "header_message1",
        "label": "Top bar message1",
        "info": "Max 55 characters"
      },
      {
        "type": "text",
        "id": "header_message2",
        "label": "Top bar message2",
        "info": "Max 55 characters"
      }
]
},
2. snippets --> header.liquid file add following code:

 <div class="col-md-6 col-sm-12 col-xs-12">
   <ul class="topm-social">
      {% if settings.header_message1 != blank %}
          <li>{{ settings.header_message1 }}</li>
      {% endif %}
      {% if settings.header_message2 != blank %}
          <li>{{ settings.header_message2 }}</li>
      {% endif %}
   </ul>                 
 </div>   


Comments

Post a Comment

Popular posts from this blog

Application ld json data in shopify

To implement application/ld json in your shopify theme, add following code into your theme.liquid  file.  {% if template == 'product' %}  <script type="application/ld+json">  {"@context":"https://schema.org", "@type":"Product", "name":"{{ product.title }}", "description":"{{ product.description | strip_html | escape }}", "url":"{{ shop.url | append: '/products/' | append: product.handle }}", "brand": {"@type":"Brand", "name":"{{ product.vendor }}", "image":"{{ product.featured_image.src | img_url: 'master'}}", "url":"{{collection_urls}}"}, {% if product.metafields.yotpo.reviews_count and product.metafields.yotpo.reviews_count != "0" %} "aggregateRating":       {"@type":"AggregateR...
Read more

on_sent_ok not working in Contact Form 7 version 5.0.2

Image
In Contact Form 7, there are several Additional Settings available to add extra functionality to your forms. One of these additional settings was on_sent_ok. But it is not work on version 5.0.2 Instead of this, Using Contact Form 7 Controls  plugin the task becomes fairly simple. Once you install and activate the plugin, a Customize tab will appear in each one of your Contact Form 7 forms. Then all you have to do is simply check the option for Google Analytics at the very bottom. Alternative way to use Global redirect via WordPress functions: This option will utilize a WordPress function which automatically adds the JavaScript into your WordPress footer. Simply open your function.php file then copy and paste the code below.       add_action( 'wp_footer', 'redirect_cf7' );       function redirect_cf7() { ?>       < script type = "text/javascript" >   ...
Read more

Make carousel slider in shopify

1)  In index.liquid file include following code: add css and js files {{ 'slick.css' | asset_url | stylesheet_tag }} {{ 'slick-theme.css' | asset_url | stylesheet_tag }} {{ 'slick.js' | asset_url | script_tag }} add html part of slider <!--slider start--> <div id="slider">  <!-- Wrapper for carousel items --> <div class="home_slider"> <div>           <a href="{{ settings.slide1_url }}" title="{{ settings[alt] | escape }}"> <img src="{{ 'slide1.jpg' | asset_url }}" class="img-responsive" alt="{{shop.name}}" /></a>               </div>             {% for i in (2..10) %}               {% capture show_slide %}slide-{{ i }}-check{% endcapture %}           ...
Read more