Aelia - Support

Customising the look of the widgets to adapt to a specific site is outside the scope of our support service. 

Please note that a basic knowledge of CSS styles, and how to add them to your site is required. If you are not familiar with CSS and how to use it, we suggest contact your developer to have the changes applied, or to learn about CSS, by starting with the following article: WP Beginner - How to add custom CSS to your site.

Should you need assistance implementing the code, please feel free to contact us to request a consultation.

1. 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:

/* Matches the container that wraps around the whole widget */
.widget_wc_aelia_customer_country_selector_widget {
}

/* Matches the widget's title */
.widget_wc_aelia_customer_country_selector_widget .widget-title {
}

/* Matches the dropdown list with the available countries */
.widget_wc_aelia_customer_country_selector_widget .countries {
}

/* Matches the button that triggers the selection of the country */
.widget_wc_aelia_customer_country_selector_widget .change_currency {
}

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-currencyswitcher/ and 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.