How to add Currency Switcher to the website

Currency Switcher provides 2 ways to add a module into the site content: with the help of widgets, shortcode and PHP code or using the Display Rules tab for each mode.

Display rules tab

width=648

Select the mode you want to add into the page and move to Display rules tab. Here you can find the next settings:

  • Show on – select the devices on which the panel should be displayed. You are able to show switcher only on mobile, on desktop or both.
  • Show on screen – if this option is enabled, the mode will be displayed only under the selected conditions, f.e: if the width of the screen is more or less than the specified width
  • Display everywhere – select Enable to display the panel on each page. Select disable and select pages from the lists on which you want to display the switcher.
  • Pages/ Product categories/ Custom post types– enable and select page or post from the list on which you want to display a switcher.

Save changes.


Shortcode and PHP code

In this tab, you can copy the shortcode and insert into the page or theme code to display a module.

You are able to add additional parameters to the shortcode:
\'currency_display\' => \'name\', (name, title)
\'show_as\' => \'dropdown\', (dropdown, flags)
\'show_flag_dropdown\' => false, (false, true)
\'width\' => \'100%\', 
\'exclude\' => array(), (CODE of Currency ex. UAH)
\'show_on\' => \'both\', (both, desktops, mobiles)
\'show_on_widths\' => 0,
\'show_on_screen_compare\' => \'less\', (less, more)
\'show_on_widths_value\' => \'\'

For example, if you need to display the converter as a dropdown with flags, add these parameters to the shortcode:

[woo -currency-switcher exclude=\'USD,GBP\' show_as=dropdown show_flag_dropdown=true]


Widgets

Move to the Appearance -> Widgets and you can find the Currency Switcher widgets:

width=845

Each widget has personal settings. Select the widget and specify a widget area or sidebar.

width=330

Currency Switcher Widget settings:

  • Title – put the title of the widget.
  • Width – set the width for a widget in %
  • Show as a Dropdown list or Flags icons.
  • Currency Dropdown Options Text – display a currency code or currency title.
  • Enable the option to show the flag in a dropdown.
  • Excluded currencies from the list. The selected currency will not be displayed in the list of switches. Press CTRL + CLICK to toggle select.
  • Specify the display rules to show switcher on mobile, desktop or both.
  • Choose the screen width in px to displayed only under the selected conditions.

Set the settings and press Save.

 

 

 

width=330

Currency Converter widget:

  • Title – put the title of the widget.
  • Width – set the width for a widget in %
  • Show as a Dropdown list or Flags icons.
  • Currency Dropdown Options Text – display a currency code or currency title.
  • Enable the option to show the flag in a dropdown.
  • Excluded currencies from the list. The selected currency will not be displayed in the list of switches. Press CTRL + CLICK to toggle select.
  • Layout – choose a vertical or horizontal type
  • Select a colour for Button Text, Button Background and Button Background Hover Color
  • Set the display rules to show switcher on mobile, desktop or both.
  • Specify the screen width in px to displayed only under the selected conditions.

Don\’t forget to Save the changes.

 

 

 

 

 

width=330

Currency Rates widget settings:

  • Title – put the title of the widget.
  • Width – set the width for a widget in %
  • Currency Dropdown Options Text – display a currency code or currency title.
  • Enable the option to show the flag in a dropdown.
  • Enable the option to show the flag in currency list.
  • Excluded currencies from the list. The selected currency will not be displayed in the list of switches. Press CTRL + CLICK to toggle select.
  • Set the display rules to show switcher on mobile, desktop or both.
  • Set the screen width in px to displayed only under the selected conditions.

 

 

 

Example of the Currency Switcher Plugin widgets:width=941

Latest Articles

Shopping Cart
Scroll to Top