fbpx

Need Help?

Here are some good places you cant start.

Whats New?

Get updated about all the good stuff!

custom-cursor-elementor
google-maps-widget
age-verification-widget-for-elementor

How to Show Currency Conversion Rates for 161 Currencies on Your Elementor Website

What are the currency conversion rates?

Currency conversion rates refer to the value at which one currency can be exchanged for another. These rates are determined by the foreign exchange market, where currencies are bought and sold. The exchange rate represents the relative value of one currency compared to another. 

 

The exchange rate is expressed as a ratio, where the value of one currency is given in terms of another. For example, if the exchange rate between the US Dollar (USD) and Euro (EUR) is 1.10, it means that 1 USD is equivalent to 1.10 EUR.

currency conversion

Why show currency conversion rates on your website?

Displaying currency conversion rates on your website can significantly enhance the overall user experience and add considerable value for your visitors. Firstly, it promotes transparency and assists your audience in making more informed decisions. When users from different countries can easily understand the cost of products or services in their local currency, it eliminates confusion and ensures clarity in pricing. This transparency can lead to increased trust, as visitors appreciate the straightforwardness in presenting information, ultimately encouraging them to stay longer on your site.

Moreover, catering to a global audience is crucial in today’s interconnected world. By providing currency conversion rates, you create a more inclusive environment for international visitors. This can be particularly beneficial for e-commerce businesses, as it simplifies the purchasing process for customers worldwide. The convenience of viewing prices in their currency encourages users to explore your offerings without the hassle of manual conversions. Overall, incorporating currency conversion rates into your website not only adds value for users but also demonstrates a commitment to user-friendly practices, potentially leading to higher engagement and satisfaction among your diverse audience.
Step by Step Guide
Step #1: Install and activate Unlimited Elements Pro for Elementor

Before getting started you will need to purchase Unlimited Elements Pro from the link below to access the Currency Conversion Rates Integration.

Then follow these steps:

1

Go to Plugins → Add New → Upload Plugin.

2

Choose the zip file you downloaded, upload, and then click Activate.

3

Once activated, you’ll need to enter your license key.

Now that you have the plugin installed, it’s time to start creating your ajax search.

Step #2: How to sign up for the exchange rate API and get an API key
1. Open your web browser and navigate to the ExchangeRate API website or Click here
currency conversion

2. Sign Up for an Account: Click on the “Sign In

3. Price and Plans

Upon logging into the API Exchange Rate Dashboard, you can easily navigate to the “Manage Plan” section situated on the left side of the interface. Currently enrolled in the Free Plan, you have the flexibility to modify your subscription plan to better suit your requirements.

4. Obtain Your API Key

After registration, you will be given an API key on your dashboard. Copy that key

Step #3: Integrating ExchangeRate API Key with Unlimited Elements in Elementor
1

Go to Unlimited Elements settings in your WordPress dashboard

2

Find the "Integration" section.

3

Locate the "ExchangeRate API Key" field

4

Paste the copied API key from the ExchangeRate API website

5

Save your changes

Following these streamlined steps, you can seamlessly connect your ExchangeRate API key with Unlimited Elements.

Step #4: Adding the Multi-Source Dynamic content widget to the page

Go to the widget section and you can see the content widgets tab. In this example, We will use the Content Grid widget. This integration is compatible with all other Multi-Source Dynamic Content widgets, not just this one.

Step #5: Setting up the currency conversion rates integration

Once the widget is added, customize its settings according to your preferences. You may configure parameters such as search sources, layout, appearance, and animation effects to tailor the widget to match the design and functionality of your website.

The technique of populating dynamic content inside widgets.

Enable the show debug button to view data types and names

1

[ id ]

This is a unique identifier for the currency.

2

[ code ]

The currency code, which is a standardized three-letter code following ISO 4217.

3

[ name ]

The full name of the currency.

4

[ Symbol ]

the symbol associated with the currency.

5

[ Flag ]

An image URL representing the flag of the country associated with the currency.

6

[ rate ]

The exchange rate of the currency.

7

[ value_before ]

This field appears to represent a string concatenation of the symbol and the rate, with the symbol preceding the rate.

8

[ value_after ]

This field represents another string concatenation but with the rate preceding the symbol.

Setting up the currency conversion rates.

Follow the steps below.

  1. Change the item source to API Integrations
  2. Change the API type to currency exchange

3. Enter the currency code that you use by default. Eg: USD

4. You can specify the number of decimals for the ratio: 2 to 6. The default value is 2.

5. Add the currency codes of the currency you want to convert with commas.

Step #6: Populate dynamic currency data

a. Title Source:  Click the plus icon and select  –Text Before — and Item Field Name

b. Now you can see two new fields. Add the default currency for the title before the field.

     Then add “Code” for the Title Item Field Name.

c. Content Source: Click the plus icon and select the Item Field Name. then add “value_before” to the item field name.

d. Image Source: Select the Item Field name. then add “flag” to the item field Name.

Step #7: Adjust the layout and Style of the Widget

Fine-tune the visual aspects of the content grid Widget to integrate with your website’s overall design seamlessly. Adjust color schemes, typography, and other styling options to create a cohesive and visually appealing search experience.

Usage Example

Below is an example of the final view of how you can utilize a live currency conversion feature.

Content Grid Example

USD / NZD
$1.63
USD / CAD
$1.37
USD / GBP
£0.79
USD / AUD
$1.51

Content Grid Example 2

USD / AED
د.إ3.67
USD / EUR
€0.93
USD / ILS
₪3.72
USD / CNY
¥7.28

Content Ticker Example

Currencies

Wrapping it Up

Congratulations on successfully integrating the Dynamic Currency Conversion Rates into your Elementor-built website! With this powerful integration, you’ve enhanced the user experience by providing visitors with real-time currency conversion rates, making transactions and financial planning more accessible. Intergrating The Currency Conversion rates your website goes beyond traditional functionalities, offering advanced features that contribute to a more transparent and user-friendly environment, ultimately increasing engagement and satisfaction for your audience.

View More Related Blog Posts

Download is just a click away

Get instant access to tons of Elementor goodies, completely FREE!

Hurray!

You got FREE access to the worlds leading widgets for Elementor page builder!