unofficialshopify

What is Announcement bar?

An announcement bar is a one- or two-sentence announcement space at the very top of a website. It pops into the top. You can also remove or close  if you needed.



Use of Announcement.

Now these days eCommerce websites have many announcement. So they need to notify user about announcements. Like -

unofficialshopify

These days some business have online store in different country with the same name. They have different URL for different country but they are facing a problem that how they can redirect store url based on IP address for eg.


    www.domain.us – Customers in the United States
    www.domain.ca – Customers in the Canada
    www.domain.com – Customers in rest the world


This article guide you to do that.

unofficialshopify

{% if settings.unofficialshopify_enable_effect %}
<script>

  
  var snowmax={{settings.unofficialshopify_number_of_snowflakes}};
  var snowcolor=new Array("#aaaacc","#ddddff","#ccccdd","#f3f3f3","#f0ffff");
  var snowtype=new Array("Times","Arial","Times","Verdana");
  var snowletter="*";
  var sinkspeed={{settings.unofficialshopify_speed_of_sinking}};
  var snowmaxsize={{settings.unofficialshopify_maximum_size_snowflakes}};

unofficialshopify

{% comment %} Width of results box {% endcomment %}
{% assign results_box_width = '242px' %}
{% comment %} Background color of results box {% endcomment %}
{% assign results_box_background_color = '#ffffff' %}
{% comment %} Border color of results box {% endcomment %}
{% assign results_box_border_color = '#d4d4d4' %}

<script>
$(function() {
  // Current Ajax request.

unofficialshopify

{% layout none %}
{% capture results %}
  {% for item in search.results %}
    {% assign product = item %}
    { 
      "title"    : {{ product.title | json }},
      "url"      : {{ product.url | within: product.collections.last | json }},
      "thumbnail": {{ product.featured_image.src | product_img_url: 'thumb' | json }}
    }
    {% unless forloop.last %},{% endunless %}

unofficialshopify

// for paragraph
<p class="description" id="24290057091">Description for variant 1</p>
<p class="description" id="24290057006" style="display: none;">Description for variant 2</p>
<p class="description" id="24290057089" style="display: none;">Description for variant 3</p>


// for div

<div class="description" id="24290057091">Description for variant 1</div>
<div class="description" id="24290057006" style="display: none;">Description for variant 2</div>

unofficialshopify

<form action="/search" method="get" class="input-group search-bar" role="search">
{% comment %}<input type="hidden" name="type" value="product">{% endcomment %}
<input type="search" name="q" value="{{ search.terms | escape }}" placeholder="{{ 'Search'}}" class="input-group-field" aria-label="{{ 'Search'}}">
<span class="input-group-btn">
<button type="submit" class="btn icon-fallback-text">
<span class="icon icon-search" aria-hidden="true"></span>
<span class="fallback-text">{{ 'general.search.submit' | t }}</span>
</button>
</span>
</form>

unofficialshopify

{% if product.options.size == 1 %}
  <script>
  var $addToCartForm = $('form[action="/cart/add"]');
  if (window.MutationObserver && $addToCartForm.length) {
    if (typeof observer === 'object' && typeof observer.disconnect === 'function') {
      observer.disconnect();
    }
    var config = { childList: true, subtree: true };
    var observer = new MutationObserver(function() { 
      {% for variant in product.variants %}

unofficialshopify

{% unless product.available %}
<div id="sold-out">
  {% form 'contact' %}
    {% if form.posted_successfully? %}
    <p class="accent-text">Thanks! We will notify you when this product becomes available!</p>
    {% else %}
    <p>Click <a id="notify-me" href="#"><strong>here</strong></a> to be notified by email when {{ product.title }} becomes available.</p>
    {% endif %}
    {% if form.errors %}
    <div class="error feedback accent-text">

unofficialshopify

      <div>
        <h1>From the Blog</h1>
        {% for article in blogs.news.articles limit: 6 %}
        
           <h3><span> >> {{ article.title | link_to: article.url }}</span></h3>
              <p>
              	<span>{{ article.created_at | date: "%d/%m/20%y" }}</span><span> <span> | </span> by {{ article.author }} </span>
              </p>
      </div>