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.
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.
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:
Go to Plugins → Add New → Upload Plugin.
Choose the zip file you downloaded, upload, and then click Activate.
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
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
Go to Unlimited Elements settings in your WordPress dashboard
Find the "Integration" section.
Locate the "ExchangeRate API Key" field
Paste the copied API key from the ExchangeRate API website
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
[ id ]
This is a unique identifier for the currency.
[ code ]
The currency code, which is a standardized three-letter code following ISO 4217.
[ name ]
The full name of the currency.
[ Symbol ]
the symbol associated with the currency.
[ Flag ]
An image URL representing the flag of the country associated with the currency.
[ rate ]
The exchange rate of the currency.
[ value_before ]
This field appears to represent a string concatenation of the symbol and the rate, with the symbol preceding the rate.
[ 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.
- Change the item source to API Integrations
- 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
Content Grid Example 2
Content Ticker Example
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.
