Altering the aspect of elements via CSS

To alter the look and feel of the Country Selector widget, simply modify your theme's CSS file and use the following selectors:

  • .widget_wc_aelia_customer_country_selector_widget
    Matches the container that wraps around the whole widget.
  • .

    widget_wc_aelia_customer_country_selector_widget 

    .widget-title

    Matches the widget's title.

  • .widget_wc_aelia_customer_country_selector_widget .countries

    Matches the dropdown list with the available countries.

  • .

    widget_wc_aelia_customer_country_selector_widget 

    .change_currency

    Matches the button that triggers the selection of the country.


You can use the above to change size, font, colours and any attribute of the Country Selector, to adapt it to your needs.


Advanced customisation

The currency selector widget is rendered using template files that can be found in {your wordpress folder}/wp-content/plugins/woocommerce-aelia-currencyswitcher/views folder. The following standard templates are available:

  • customer-country-selector-widget-dropdown.php: displays "dropdown" style selector.

If you wish to alter the templates, simply copy them in your theme. They should be put in {your theme folder}/woocommerce-aelia-currencyswitcherand have the same name of the original files. The Currency Switcher plugin will then load them automatically instead of the default ones.


Adding a new, custom template

The Currency Switcher also allows you to pass new templates for its selectors. You can do so as follows:


1. Develop your custom template file (for example, my-custom-customer-country-selector.php) and save it in {your wordpress folder}/wp-content/plugins/woocommerce-aelia-currencyswitcher/views folder.


2. Add a new filter for the wc_aelia_cs_billing_country_selector_widget_types to your theme's functions.php, as follows: 

function my_custom_widget_types($widget_types) {
  $widget_types['my_custom_type'] => array(
    'name' => __('My Custom Type', 'my-text-domain'),
    'template' => 'my-custom-billing-country-selector',
    'title' => __('My Custom Type Widget', 'my-text-domain'),
  );
  return $widget_types;
}
add_filter('wc_aelia_cs_customer_country_selector_widget_types', 'my_custom_widget_types', 10, 1);

   

3. Your new widget type should now appear in the list when you edit the billing country selector widget in WordPress > Appearance > Widgets. Of course, you can also use your custom type with the shortcode: 

[aelia_cs_billing_country_selector_widget title="Widget title (optional)" widget_type="my-custom-billing-country-selector"] 

   


You can purchase the Currency Switcher from our online shop.