Blogs

App setting after changing Theme

    In Shopify, when an app is installed then some code is auto-injected in the theme file which needs to be added again after changing the theme.

    Below are some steps which will help you add the code manually:

    Step 1.

    Edit the theme in which you want to set up the app. For doing so, from Shopify admin go to Online Store > Themes > Actions > Edit Code.

     

    Step 2.

    Add a new snippet aio-script in the theme (app set up required).

    And copy below code and paste into the newly created aio-script file

    <script>
    var aioMeta ={
    meta_e : '{{customer.email}}',
    meta_i : '{{customer.id}}',
    meta_n : '{{customer.first_name}} {{ customer.last_name }}',
    }</script>
    <script async="async" src="https://dcdn.aitrillion.com/aio_stats_lib_v3.min.js?v=1.1"></script>
    <script async="async" src="https://d2rs7qkk6x0fuo.cloudfront.net/aio-script/stores/CTk7Al_a4GYqPrMtvEt0LQV5eStSSfpCU22-935czGV8DJF6E7obUVk4IIH_bIoe6PmzqxlUqhiIBpQ8SUeQUQ.js?shop_name=yourshopdomain.myshopify.com"></script>

    Note: Replace yourshopdomain.myshopify.com  with your store myshopify domain.

     

    This is required to run the AiTrillion app, and it enables Ai Box, and Chat in a new theme.

    To setup Loyalty Rewards in the new theme –

    Step 1. 

    Add a new snippet aio_loyalty_snippet  in the new theme (app set up required).

    And copy below code and paste into the newly created aio_loyalty_snippet file

    {% if customer %}
    <input type="hidden" name="is_customer_logged_in" value="1" class="is_customer_logged_in">
    <input type="hidden" name="referral_customer_logged_id" value="{{customer.id}}" class="referral_customer_logged_id">
    <input type="hidden" name="referral_customer_email" value="{{ customer.email }}" class="referral_customer_email">
    {% else %}
    <input type="hidden" name="is_customer_logged_in" value="0" class="is_customer_logged_in">
    <input type="hidden" name="referral_customer_logged_id" value="0" class="referral_customer_logged_id">
    {% endif %}
    <input type="hidden" name="referral_shop_currency" value="{{ shop.currency | money | replace: '0.00', ' ' | replace: '0,00', ' '}}" class="referral_shop_currency">
    <div id="master-referal-div"></div>
    <div class="aaa-noti-container"></div>

     

    To setup Reviews in the new theme –

    Step 1. 

    Add a new snippet aio_reviewform in the new theme (app set up required).

    And copy below code and paste into the newly created aio_reviewform file

    <div id="egg_review_container" class="revw_main">
    <div class="full-width headr">
    <h3 class="rvw_heading"></h3>
    <div class="rate-and-add-review">
    <div class="egg-review-left">
    <div class="egg-btn-right">
    <div class="egg_average_rating_star">
    <span class="stars"></span>
    </div>
    <p id="review-report"></p>
    </div>
    <div class="egg-btns">
    <div class="review_btn"></div>
    <div class="question_btn" style="display:none">Ask A Question</div>
    </div>
    </div>
    </div>
    <div class="revw_toggle" style="display:none;">
    <iframe src="https://app.aitrillion.com/review/form_data.php?pid={{product.id}}&shopname={{shop.permanent_domain}}" width="100%" height="600px" style="border:0px;"></iframe>
    </div>
    <div class="egg_question_form_toggle" style="display:none;">
    <iframe src="https://app.aitrillion.com/review/ask_question.php?pid={{product.id}}&shopname={{shop.permanent_domain}}" width="100%" height="380px" style="border:0px;"></iframe>
    </div>
    <div class="egg_store_question_review_tab" style="display:none">
    <ul class="egg_store_nav">
    <li>
    <a href="javascript:void(0)" class="active" data-attr-tab="egg_review">Review (<span id="egg_product_review_count"></span>)</a>
    </li>
    <li>
    <a href="javascript:void(0)" data-attr-tab="egg_question">Question (<span id="egg_product_question_count"></span>)</a>
    </li>
    </ul>
    </div>
    </div>
    </div>
    <div style="display:none;"> {% if product.metafields.EggViewsGroupProduct.ProductGrouping %}<div id="group_product_status">{{ product.metafields.EggViewsGroupProduct.ProductGrouping }}</div> {% endif %} </div>

     

    Step 2. 

    Add a new snippet aio_reviewlist  in the new theme (app set up required).

    And copy below code and paste into the newly created aio_reviewlist file

    <input type='hidden' id='aio-review-product_id' value='{{ product.id }}'>
    <div id='aio-review-product-image'></div>

    To setup Product Recommendation in the new theme –  

    Step 1. 

    Add a new snippet aio_product_recommendation in the new theme (app set up required).

    And copy below code and paste into the newly created aio_product_recommendation file

    <div class="aionewarrival" id="aionewarrival"></div>
    <div class="aiotrendingproducts" id="aiotrendingproducts"></div>
    <div class="aiorecentview" id="aiorecentview"></div>

    To setup Loyalty Reward Widgets refer this article. 

    After adding all the snippets in the theme correctly, open file theme.liquid in the new theme (app set up required) and add the below-mentioned code. This is required to run the AiTrillion app.

    • Search for closing </head> tag in the file and paste the code above it
    {% include 'aio-script' %} 

     

    Open file product.liquid under Templates and paste the below code at the end of the file and save it. This code will display the review form and list on the product page.

    {% include 'aio_reviewform' %}{% include 'aio_reviewlist' %}{% include 'aio_product_recommendation' %}
    
     

     

    Share
    Did this article answer your question?
    Share
    Book A Demo