Giftship Installation

Introduction

First of all, Thank you for choosing Giftship!

Before you start Make sure you have done the following.

  1. Create a backup of your theme file
  2. Install Giftship from the Shopify App Store

Be careful while editing your theme. If not edited properly, design elements may break. No support is provided for faulty customization.



Watch the installation video

Getting Started #back to top

If you haven't already done so, install Giftship on your Shopify Store and authorize Giftship to connect with your shop.

The installation process involves altering your theme files, so it's a good idea to make a backup before you begin.

You can try out Giftship for 7 days before you will be billed.

Accessing Theme Files #back to top

In order for MultiShip to function correctly, we'll need to make a few changes to your theme files. There are a few steps, which might be located in various parts of you're theme.

  1. Log in to your shopify admin by going to "yourstore.myshopify.com/admin", and entering your login details.
  2. Click on "Online Store", then click on the "Actions" button over the theme you would like to edit.
  3. Select "Edit Code".

Changes to cart.liquid #back to top

In this next step, we'll be making some changes to the cart loop.


  1. In Shopify Admin, go to Online Store -> Themes -> Actions -> Edit Code
  2. Open the "cart.liquid" file in the "Templates" folder. In this file, you should see {%for item in cart.items %}. If you find this line, great, your ready to go to the next step. If it's not there, look out for something like {% section 'cart-template' %} or {% include 'cart-template' %}. If you find either of these, you will have to find the referenced file and continue to the next step.


  3. Find the line directly below {% for item in cart.items %}. Add the following classes and data attributes to this top level element.
                                    

    Make sure to add the closing div tag in the snippet above to be at the end of the loop, so find the {% endfor %} at the bottom of the cart loop, and add the closing div tag there.

    Once complete, your the start of you loop should look like this: install start


  4. Now we'll need to edit the line item properties loop. Look for the line of code that contains: {% for p in item.properties %}. Once found you'll need to wrap the entire for loop with the following div element. Remember to close the div right before the end of the for loop like it step 1.
                                      
                                    
    Your code should now look like it does below. If you prefer, you can copy the following snippet and replace your existing line-item properties loop.
                                      
                                    

  5. Somewhere within the product loop, add the following lines of code. A good spot for these is often underneath the "remove item" link, but they can be placed anywhere you see fit, as long as it is within the cart item loop.
                                    


    install buttons


  6. Find the line in your cart template that contains {{ additional_checkout_buttons }}. Wrap this code in a div with the class "additional-checkout-buttons", or replace with the code below:
                                      
    {{ content_for_additional_checkout_buttons }}



  7. Save your changes by clicking the "Save" button in the top right corner.

Configuring Options #back to top

You may want to choose some of the options you would like to configure before going live.

multiship options

  1. In Shopify Admin, go to Online Store -> Apps -> Giftship, where you will be given some options on how the app works.

  2. Hide tax on cart page:

    Check this box if you don't want tax to show up when a visitor enters their shipping address on the cart page. Taxes will always be calculated and displayed on each checkout page.

  3. Highlight changes on cart page:

    Check this option to highlight in green changes to tax and address line item properties in the cart

  4. Animate modal window:

    This option adds a smooth animation when opening the shipping address modal window

  5. Custom Upsell:

    Enter details here to have an optional upsell to each item on the cart page. Works great for things like gift wrapping, or adding a box of chocolates! This doesn't have to be an existing product in your store, it can be whatever you like!

Configuring Email Templates #back to top

In order for your customers to see their chosen shipping address and taxes charged in the order confirmation email, we need to add a liquid snippet for each required email template in Shopify's Notification Settings.

  1. Go to Settings -> Notifications -> Order Confirmation
  2. At the very top of your file, insert the following code before everything else:
                                      {% assign ms_order = false %}
                                      {% for tag in order.tags %}
                                      {% if tag == "ms_order" %}
                                      {% assign ms_order = true %}
                                      {% endif %}
                                      {% endfor %}
                                    



  3. Find the following code snippet in the Order Confirmations template:
                                      View your order
                                      

    Replace the above line with the following code:
                                      {% if ms_order == false %}
                                      View your order
                                      {% else %}
                                      

    Further confirmation emails will be sent for each item in your cart.

    {% endif %}



  4. Near the bottom of the same file, find the following section of code:
                                        

    Order summary


    Add the following line directly above the section mentioned above:
                                        {% if ms_order == false %}
                                      

    Find this section of code near the end of the file:
                                        
                                      
    Add the following line directly above this section:
                                        {% endif %}
                                      



  5. Click Save.
  6. Repeat this step for every order email template you would like the address to show up for.

Tax Settings (USA ONLY)#back to top

In order for Giftship to be able to correctly gather tax information, a store located in the USA must manually set their tax settings.

  1. Navigate to Shopify Admin -> Settings -> Taxes.
  2. Uncheck the box that says "Calculate taxes automatically":
    multiship options

  3. Enter the amount of tax to charge for each state that you must charge taxes for:
    multiship options

  4. Click Save.

Finish #back to top

Congratulations! You have now successfully configured Giftship.

Make sure you do a test order to ensure everything is functioning correctly before using on a live website. If you have any question regarding installation, please open a support ticket and we will be happy to assist you.