Create a Custom Menu for Currency Selection

Updated on 23rd July 2023 in Customisations

Creating a Custom Menu for Currency Selection in Shoprocket

In this guide, we will walk you through three different methods to implement a custom currency selection menu on your online store powered by Shoprocket. These methods will allow your customers to easily choose their preferred currency, ensuring they see prices and complete transactions in their local currency, enhancing their shopping experience.

Explanation:

  1. Method 1 (Anchor Tags): In this method, we create a custom menu using anchor tags (hyperlinks). When the customer clicks on a specific currency link, the `onclick` event triggers a JavaScript function, `Shoprocket.store.setCurrency('CurrencyCode')`, to set the chosen currency (e.g., USD, EUR, GBP) for the store.
  2. Method 2 (Dropdown Menu): This method involves a dropdown (select) menu with options for different currencies. When the customer selects a currency from the dropdown, the `change` event triggers a JavaScript function that calls `Shoprocket.store.setCurrency('CurrencyCode')` to set the chosen currency.
  3. Method 3 (URL Parameters): In this method, the custom menu consists of anchor tags with different currency options as part of the URL parameters. When the customer clicks on a currency link, it appends the corresponding currency code (e.g., ?currency=usd) to the current URL. The store can then read the currency from the URL and set it accordingly.

Please note that you need to have the Shoprocket script integrated into your website for these methods to work correctly. Additionally, ensure that the currency codes used in the examples (USD, EUR, GBP) match the supported currencies set up in your Shoprocket settings.

With these custom menu examples, your customers will have the flexibility to choose their preferred currency while shopping on your online store.

Can’t find what you’re looking for?

Chat with us 👋

or contact us on [email protected]


as featured in