Mobile Redirect

Shopgate_Helper_Redirect_MobileRedirect

The Shopgate Library offers a class which already implements the mobile redirect with the HTTP header functionality in PHP.

Important

There should not be any output before the header, or the redirect will fail.

Redirecting Types

After setting the redirect target, you can call the appropriate method. For every redirecting type there is a method that instantly redirects the user if applicable (is using a smartphone, did not come back from the mobile website, …) or builds the Mobile Header and SEO optimized HTML tags (see below).

  • buildScriptShop()
    Redirecting to the Mobile Website homepage. If there is no mobile request, it returns the Mobile Header.
  • buildScriptItem($itemNumber)
    Redirecting to a product on the Mobile Website by using the passed $itemNumber. If there is no mobile request, it returns the Mobile Header. The item number from the online shop is used as the parameter here.
  • buildScriptItemPublic($itemNumberPublic)
    Redirecting to a product on the Mobile Website by using the passed $itemNumberPublic . If there is no mobile request, it returns the Mobile Header. The item number public from the online shop is used as the parameter here.
  • buildScriptCategory($categoryNumber)
    Redirecting to a category on the Mobile Website. If there is no mobile request, it returns the Mobile Header. A category number from the online shop is used as the parameter here.
  • buildScriptBrand($brandName)
    Redirecting to a brand on the Mobile Website. If there is no mobile request, it returns the Mobile Header. The name of the required brand is used as the parameter here.
  • buildScriptSearch($searchQuery)
    Redirecting to a search for a product on the Mobile Website. If there is no mobile request, it returns the Mobile Header.The search term is used as the parameter here.
  • buildScriptCms($cmsPage)
    Redirecting to a user-defined page on the Mobile Website. If there is no mobile request, it returns the Mobile Header. The internal name of the user-defined site is used as the parameter here.

Mobile Header and Meta Tags

When a smartphone user returns to the desktop site, the Mobile Header must be displayed so the user can easily switch back to the mobile website. Additionally a bunch of HTML meta tags must be displayed to hint search engine crawlers to the deeplinks on the mobile website and in the native apps, if available.

The JavaScript code and markup for this is returned by the buildScript*() methods explained above. It just needs to be inserted into an appropriate place in your template, view or layout.

Example
Inserting $shopgateJsHeader
<head>
	...
	<?php echo $shopgateJsHeader; ?>
	...
</head>

Open Graph Tags

On top of the Mobile Header and SEO meta tags Shopgate offers the integration of Open Graph tags introduced by Facebook back in 2010. These are used to give social integrations more detailed information about a web site. If enabled, the tags are generated by the buildScript*() methods mentioned above along with the Mobile Header and meta tags.

Most of the Open Graph tags need parameters to be set or otherwise they won’t be generated. To set a parameter, use the method addSiteParameter($name, $value).

Valid values for $name can be found in the Shopgate_Helper_Redirect_TagsGeneratorInterface:: SITE_PARAMETER_* constants. Please also see the list of all currently supported parameters.

Sample Application

The sample application of the class illustrates redirecting to the homepage and to the product and category levels.

Example
Redirecting for the product and category level
<?php
use Shopgate_Helper_Redirect_TagsGeneratorInterface as TagsGenerator;

$shopgateJsHeader = '';

### A method to check if the Shopgate Plugin is active
if ($shopgatePlugin->isActive()) {
    include_once DIR_FS_CATALOG.'/shopgate/shopgate_library/shopgate.php';

    // only if you use your own extended ShopgateConfig class
    include_once DIR_FS_CATALOG.'/shopgate/my_own_shopgate_config.php';
    $shopgate_config = new ShopgateConfig();

    // instantiate and set up redirect class
    $builder = new ShopgateBuilder($shopgate_config);
    $shopgateRedirector= $builder->buildMobileRedirect($_SERVER['HTTP_USER_AGENT'], $_GET, $_COOKIE);

    ##################
    # redirect logic #
    ##################
    // set global site parameters
    $shopgateRedirector->addSiteParameter(TagsGenerator::SITE_PARAMETER_SITENAME, $siteTitle);
    $shopgateRedirector->addSiteParameter(TagsGenerator::SITE_PARAMETER_TITLE, $pageTitle);
    $shopgateRedirector->addSiteParameter(TagsGenerator::SITE_PARAMETER_DESKTOP_URL, $_SERVER['SCRIPT_NAME']);

    // set redirection url and site specific parameters
    if ($product->isProduct) {
        $shopgateRedirector->addSiteParameter(TagsGenerator::SITE_PARAMETER_PRODUCT_AVAILABILITY, $product->stock);
        $shopgateRedirector->addSiteParameter(TagsGenerator::SITE_PARAMETER_PRODUCT_NAME, $product->name);
        $shopgateJsHeader = $shopgateRedirector->buildScriptItem($product->pID);
    } elseif (!empty($current_category_id)) {
        $shopgateJsHeader = $shopgateRedirector->buildScriptCategory($current_category_id);
    } elseif($site->isHomePage()) {
        $shopgateJsHeader = $shopgateRedirector->buildScriptShop();
    } else {
        $shopgateJsHeader = $shopgateRedirector->buildScriptDefault();
    }
}

?>
<html>
<head>

    [...]

    <?php echo $shopgateJsHeader; ?>
</head>
<body>
    [...]
</body>
</html>    
Example
Output
<html>
<head>

    [...]

    <!-- BEGIN SHOPGATE -->
    <link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.myshop.com/item/3132333435" />
    <link rel="alternate" href="android-app://com.example.android/http/example.com/gizmos/item/3132333435" />
    <meta property="og:title" content="My Product" />
    <meta property="og:site_name" content="My Shop" />
    <meta property="og:product:availability" content="67" />
    <meta name="twitter:app:id:googleplay" content="com.myshop.android" />

    <script type="text/javascript">
        var _shopgate = {
        shop_number: "12345",
          redirect: "item",
          is_default_redirect_disabled: true,
          item_number: "275"
        };

        (function(b,d){
          var a=("undefined"!==typeof _shopgate?_shopgate:{}).shop_number,
          e="http:"===b.location.protocol?"http:":"https:";if(a){var c=b.createElement(d);
          c.async=!/(ip(ad|od|hone)|Android)/i.test(navigator.userAgent);
          c.src=e+"//static.shopgate.com/mobile_header/"+a+".js";
          a=b.getElementsByTagName(d)[0];a.parentNode.insertBefore(c,a)}}
        )(document,"script");
    </script>
    <!-- END SHOPGATE -->
</head>
<body>
    [...]
</body>
</html>