Shopping Cart Systems

Connect with your mobile customers using Shopgate.

WooCommerce 3.0

The following features are immediately available in your mobile shop when you connect WooCommerce to Shopgate:

 Support   Import to WooCommerce  
 Version 3.0.0+ Orders
 Customer Account   Export to Shopgate Mobile Shop  
 Login with Desktop Shop Account Products
 Login to Desktop Shop with Mobile   Account Categories
 Customer Groups/Tier Pricing ✘ / ✘ Reviews
 Show Desktop Orders on Mobile Related Products, Upsell, & Cross-sell
 Sync   Validate, upon Cart Changes   
 Delivery Status "Shipped" Coupon
 Order Status "Canceled" Shipping Method
 Stock Quantity on Product Detail Page Payment Method
 Product Tax Classes, Rates, & Rules  Product Availability

   

☞ The Shopgate plugin for WooCommerce can be installed for version 3.0 or higher. Support for connecting to an older version of WooCommerce is available in this article

Install the Shopgate plugin

To connect WooCommerce to Shopgate, you must first install the Shopgate plugin for WooCommerce.

Download the plugin

You can find the latest version of the Shopgate plugin at https://github.com/shopgate/cart-integration-woocommerce/releases. Click on "shopgate-woocommerce-integration.zip" to download the file.

Once you have downloaded the Shopgate plugin file, the next step is to upload it to WooCommerce. This can be done either via the Wordpress backend or via an FTP server - whichever you prefer.

Uploading the plugin via the Wordpress backend

  1. Log in to your Wordpress backend and go to Plugins → Add New.
  2. Next, click Upload Plugin and select the .zip file containing the native Shopgate plugin you downloaded in the previous step. Then click Upload.
  3. Once the plugin has been uploaded successfully, you will be prompted to enable it. Do this by clicking Activate Plugin.WooCommerce1.png

Uploading the plugin via an FTP server

Uploading the file via FTP is easy. First, you need an FTP tool such as FileZilla. Simply extract the zip file and place it in the Shopgate folder located in [shop root folder] / wp-content / plugins / shopgate-woocommerce-integration.

NOTE: Please make sure you have set a write permission to the [shop root folder] / wp-content / plugins / shopgate-woocommerce-integration folder. If it does not yet have a write permission, right-click on the folder and select File Permissions. Set the value to 774 and select Apply to all data and files. Click OK to complete the upload.

The plugin should now appear in the Wordpress backend.

Configure the Shopgate plugin

To get the plugin working, you'll need to enter some info in your Wordpress backend. The next step shows how to find the necessary values in your Shopgate admin area.

Shopgate access info

  1. Log in to your Shopgate admin area. 
  2. Click IntegrationShop Interface.
  3. Go to the New Connection section. Drop down the Select a system menu and search for "In-house / own implementation". Select this menu item.
  4. A pop-up window will open. If it doesn't, check your browser settings to ensure pop-ups are not being blocked. In the section "1. Configure" you will find your Customer number, Shop number, API key and Alias. These are the API credentials you need to enable the Shopgate plugin.
  5. Copy your Customer number, Shop number, API key and Alias - in the next step, you will enter this data in the WordPress backend. Leave the "Connecting to In-house / own implementation" pop-up window open, as you will need to return to it later (see Making the connection).WooCommerce_EN_01.png 

Transfer Shopgate access data to the plugin

Go to your Wordpress backend to enter the access date you collected in the previous step.

  1. Log in to your Wordpress backend.
  2. Go to PluginsInstalled Plugins and search for WooCommerce. Click on Settings.WooCommerce3.png
  3. On the page that opens, go to the Integration tab. This is where you will enter your API keyShop number, Customer number and Shop alias from the Shopgate backend. Please also tick the checkbox to Enable Shopgate Module. The remaining input fields are optional and can be reconfigured if necessary - the next section will explain these configuration options in further detail.
  4. Finally, click Save changes to save your entries.WooCommerce_EN2703.png

Optional configuration options

In addition to the basic configuration with your API access data (API key, customer number, shop number and alias), the WordPress backend also offers you optional settings for configuring your Shopgate plug-in:

Shopgate server This option should generally be set to "Live". This allows you to choose a predefined URL that communicates with the Shopgate merchant API.

API URL

You can leave this field blank. It is normally only used if the "Shopgate server" flag is set to "custom", which is only useful for debugging purposes.
Custom URL This refers to your URL, which is used for the mobile version of your shop. The URL to reach your mobile shop is usually [alias].shopgate.com or 
m.[alias].com.
Products description layout In this field, you can configure the structure of the product description as desired. The following options are available:
  • Description
  • Summary
  • Description + Summary
  • Brief Description + Description

You can edit these options at any time. If you make any modifications, please always click on Save changes to apply them.

Establish the connection

It's time to establish the connection between WooCommerce and Shopgate. To do this, enter the URL of your shop in Shopgate:

  1. Go back to the Shopgate admin panel to the pop-up window that you left open. If you have closed the window, navigate to Integration → Shop Interface and select "In-house / own implementation" as interface type again.
  2. Enter the URL of your shop in 2. Enter URL. Important: Please add /wp-content/plugins/shopgate-woocommerce-integration/api/index.php to the end of the URL.WooCommerce_EN_02.png
  3. Finally, click Connect.

That's it! The plugin is now connected to Shopgate and a full import will start automatically.

Set up mobile redirect

To redirect mobile visitors to your mobile website, add the following code block to your template.

To do so, follow the steps here:

  1. Locate your template on your FTP server. You should be able to find it in the file "/wp-content/themes/<your_theme_name>/header.php" in your WordPress.
  2. Add the following code block to your template right above the closing <?php wp_head(); ?> tag.
  3. Replace "YOUR SHOP NUMBER" (line 22) with your shop number at Shopgate. Where can I find my shop number?
<?php /* SHOPGATE MOBILE HEADER START */
if (!is_customize_preview() && class_exists('WooCommerce')) {
    $shopgateMobileHeader = '';
    if (is_product_category()) {
        $categoryId           = get_queried_object()->term_id;
        $shopgateMobileHeader = "_shopgate.redirect = 'category';\n\t\t";
        $shopgateMobileHeader .= "_shopgate.category_number = '{$categoryId}';";
    } elseif (is_product()) {
        $productId            = wc_get_product()->id;
        $shopgateMobileHeader = "_shopgate.redirect = 'item';\n\t\t";
        $shopgateMobileHeader .= "_shopgate.item_number = '{$productId}';";
    } elseif (is_front_page()) {
        $shopgateMobileHeader = "_shopgate.redirect = 'start';";
    } else {
        $shopgateMobileHeader = "_shopgate.redirect = 'default';";
    }

    if (!empty($shopgateMobileHeader)): ?>
        <!-- SHOPGATE MOBILE HEADER START -->
        <script type="text/javascript">
            var _shopgate = {};
            _shopgate.shop_number = "YOUR SHOP NUMBER";

            <?php echo $shopgateMobileHeader; ?>

            _shopgate.is_default_redirect_disabled = true;
            _shopgate.host = (("https:" == document.location.protocol) ? "https://static-ssl.shopgate.com" : "http://static.shopgate.com");
            document.write(unescape("%3Cscript src='" + _shopgate.host + "/mobile_header/" + _shopgate.shop_number + ".js' type='text/javascript' %3E%3C/script%3E"));
        </script>
        <!-- SHOPGATE MOBILE HEADER END -->
    <?php endif; ?>
<?php } /* SHOPGATE MOBILE HEADER END */ ?>

 

Frequently Asked Questions

What do the individual configuration options mean?

In the WordPress backend, you will come across various configuration options for configuring your Shopgate plug-in. Here is a brief summary of each option:

API Key Your API key is generated by Shopgate and is used for authentication between Shopgate and WooCommerce/WordPress. Where can I find my API key?
Shop Number Your shop number at Shopgate. Where can I find my shop number? 
Customer Number Your customer number at Shopgate. Where can I find my customer ID?
Shopgate server This setting allows you to choose a predefined URL that interacts with the Shopgate merchant API.
API URL This field is only needed for debugging purposes and is therefore only used if the "Shopgate server" flag is set to "custom".
Custom URL to mobile webpage (CNAME) incl. http(s):// This is your mobile shop's URL. It usually contains your shop alias and consists of the following:[alias].shopgate.com or m.[alias].com
Shop alias Your Shop Alias is created by Shopgate when you register. This will usually include the name of your shop, but may not.
Products description layout You can choose the following formats for displaying product descriptions in your mobile shop:
  • Description
  • Summary
  • Description + Summary
  • Brief Description + Description


Do I have to add "wp-content/plugins/shopgate/api/index.php" to my shop URL?

Yes. With the interface type "Internal / own implementation" it is important that you extend your URL with the path "/wp-content/plugins/shopgate-woocommerce-integration/api/index.php".

Was this article helpful?
Can't find what you're looking for?
Let us help you—submit a support ticket.
Contact Support