VTEX Developer Portal

Managing landing pages in cross-border stores

Managing landing pages in cross-border stores

You may want to create custom landing pages to attend your store's specific needs. In this case, you must create a template and a URL path to go with it.

In a cross border environment, we suggest that you include the country code of its related binding in the path of your new landing page (e.g., /UK/about-us ).

Once you create your new custom landing page, its path will be solely available in the store related to your account's default binding.

However, in a cross border context, you may want to have specific landing pages for each region your store is present.

In this case, after creating your custom page, you must link its path to the desired binding as in the following step by step on how to link a landing page to a binding.

Finally, you may want to remove your landing page from the default binding. For that, check the following step by step on how to unlink a landing page from a specific binding.

Step by step

Before proceeding any further with this step by step, check your account's binding ids and keep the returned data with you. This information will be crucial for successfully performing the following steps.

Linking a landing page to a binding

  1. Install the [email protected] app using your terminal.
  2. In your browser, access your account's admin and go to the GraphQL IDE section.
  3. From the GraphQL IDE dropdown list, choose the vtex.rewriter app.
  4. Run the following query, adapting it to your scenario, to get the internal data related to your custom page path.
{
  internal {
    get(path: "/{URL}") {
      from
      declarer
      type
      id
      query
      binding
      endDate
      imagePath
      imageTitle
      resolveAs
      origin
      disableSitemapEntry
    }
  }
}

Remember to replace the values between the curly brackets according to your scenario.

  1. Save the returned data.
  2. Erase the previous query and fill in the main text box with the following mutation command.
mutation saveInternal($args: InternalInput!) {
  internal {
    save(route: $args) {
      id
    }
  }
}
  1. Click on Query Variables at the bottom of the page and, according to the following example and the following explanations, fill in the Query Variables section.
{
    "args": {
        "from": "/US/about-us",
        "declarer": "[email protected]",
        "type": "userRoute",
        "id": "[email protected]:store.custom::{URL}",
        "query": null,
        "binding": "7cf37a3b-efc0-4e47-8201-d8b58kd4d3fd",
        "endDate": null,
        "imagePath": null,
        "imageTitle": null,
        "resolveAs": null,
        "origin": "[email protected]",
        "disableSitemapEntry": null
    }
}
  • Replace the values inside args with the information obtained in step 4.
  • For the binding property, fill in its value with the binding id of the store you want to have your new custom landing page live.

Done! Now, your landing page will be accessible either in the default binding as in the desired binding.

If you want to link the same landing page to other stores, just repeat this process considering their respective binding ids.

If you don't want to have this landing page in the default binding, check the following section on how to unlink a landing page from a binding.

Unlinking a landing page from a binding

  1. In your browser, access your account's admin and go to the GraphQL IDE section.
  2. From the GraphQL IDE dropdown list, choose the vtex.rewriter app.
  3. Adapting it to your scenario, fill in the main text box with the following mutation command:
mutation deleteInternal($args:RouteLocator){
  internal{
    delete(path:"/{URL}",locator:$args){
      from
    }
  }
}

Remember to replace the values between the curly brackets according to your scenario.

  1. Click on Query Variables at the bottom of the page and, according to your scenario, fill in the Query Variables section as in the following:
{
  "args": {
    "from": "/{URL}",
    "binding": "{bindingId}"
  }
}

Once you run this mutation, you'll delete the custom landing page, related to the specified {URL} , from the binding related to the specified {bindingId}.

Updated 10 days ago


Managing landing pages in cross-border stores


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.