Step-by-step guides

Integrations

Add real-time currency conversion to your WordPress site, Slack workspace, or Chrome browser in minutes.

WP
WordPress
Widget or shortcode
S
Slack
Slash command bot
C
Chrome Extension
Popup converter

WordPress Integration

Display live exchange rates on your WordPress site using an embeddable widget or a custom shortcode that fetches rates from our API.

Option 1: Embed Widget (iframe)

Add this HTML snippet to any page, post, or widget area. It embeds the USDConverter widget directly.

WordPress Widget Embed

Option 2: Custom Shortcode (PHP)

Add this code to your theme's functions.php. Then use [usd_rate to="EUR"] in any post.

functions.php
"color:#c084fc">function usd_rate_shortcode("color:var(--cyan)">$atts) {
  "color:var(--cyan)">$atts = shortcode_atts(['to' => 'EUR', 'amount' => '1'], "color:var(--cyan)">$atts);
  "color:var(--cyan)">$to = strtoupper(sanitize_text_field("color:var(--cyan)">$atts['to']));
  "color:var(--cyan)">$amount = floatval("color:var(--cyan)">$atts['amount']);

  "color:var(--text3)">// Cache for 1 hour using WP transients
  "color:var(--cyan)">$cache_key = 'usd_rates_cache';
  "color:var(--cyan)">$rates = get_transient("color:var(--cyan)">$cache_key);

  "color:#c084fc">if (!"color:var(--cyan)">$rates) {
    "color:var(--cyan)">$response = wp_remote_get('https:">//usdconverter.com/api/rates');
    "color:#c084fc">if (is_wp_error("color:var(--cyan)">$response)) "color:#c084fc">return 'Rate unavailable';
    "color:var(--cyan)">$data = json_decode(wp_remote_retrieve_body("color:var(--cyan)">$response), true);
    "color:var(--cyan)">$rates = "color:var(--cyan)">$data['rates'] ?? [];
    set_transient("color:var(--cyan)">$cache_key, "color:var(--cyan)">$rates, HOUR_IN_SECONDS);
  }

  "color:#c084fc">if (!isset("color:var(--cyan)">$rates["color:var(--cyan)">$to])) "color:#c084fc">return 'Unknown currency';
  "color:var(--cyan)">$result = number_format("color:var(--cyan)">$amount * "color:var(--cyan)">$rates["color:var(--cyan)">$to], 2);
  "color:#c084fc">return "{">$amount} USD = {">$result} {">$to}";
}
add_shortcode('usd_rate', 'usd_rate_shortcode');

Option 3: JavaScript Widget

Drop this script into a Custom HTML block. It fetches rates client-side and renders a mini converter.

Custom HTML Block
"color:var(--cyan)">id="usd-converter-widget">

Slack Integration

Build a Slack slash command that converts currencies directly in your workspace. Set up takes about 10 minutes.

Setup Steps

  1. 1. Go to api.slack.com/apps and create a new app
  2. 2. Under “Slash Commands”, create /convert
  3. 3. Set the Request URL to your server endpoint (see code below)
  4. 4. Install the app to your workspace
  5. 5. Type /convert 100 USD to EUR in any channel

Deploy this handler as a serverless function (AWS Lambda, Vercel, etc.) and set it as your slash command URL:

Slack Slash Command Handler (Node.js)
"color:">var(--text3)">// POST handler for /convert slash command
"color:#c084fc">export default "color:#c084fc">async "color:#c084fc">function handler(req, res) {
  "color:#c084fc">const text = req.body.text; "color:">var(--text3)">// e.g. "100 USD to EUR"
  "color:#c084fc">const match = text.match(/(\d+\.?\d*)\s*(\w+)\s+to\s+(\w+)/i);

  "color:#c084fc">if (!match) {
    "color:#c084fc">return res.json({ text: "Usage: /convert 100 USD to EUR" });
  }

  "color:#c084fc">const [, amount, "color:#c084fc">from, to] = match;
  "color:#c084fc">const url = `https:var(--text3)">//usdconverter.com/api/convert?from=${from}&to=${to}&amount=${amount}`;
  "color:#c084fc">const data = "color:#c084fc">await fetch(url).then(r => r.json());

  "color:#c084fc">if (!data.success) {
    "color:#c084fc">return res.json({ text: `Error: ${data.error}` });
  }

  res.json({
    response_type: "in_channel",
    text: `${data.amount} ${data.from} = ${data.result} ${data.to} (Rate: ${data.rate})`
  });
}

Chrome Extension

Build a simple Chrome extension that lets you convert currencies from a popup. Three files is all you need.

Step 1: manifest.json

manifest.json
{
  "manifest_version": 3,
  "name": "USD Converter",
  "version": "1.0",
  "description": "Convert currencies instantly with live rates",
  "action": {
    "default_popup": "popup.html",
    "default_icon": "icon.png"
  },
  "permissions": []
}

Step 2: popup.html

popup.html



  


  
USD Converter

  "color:var(--cyan)">type="number" "color:var(--cyan)">id="amount" "color:var(--cyan)">value="100" />
  
  
  
  
"color:var(--cyan)">id="result">

Step 3: popup.js

popup.js
"color:#c084fc">async "color:#c084fc">function doConvert() {
  "color:#c084fc">const amount = document.getElementById('amount').value;
  "color:#c084fc">const "color:#c084fc">from = document.getElementById('from').value;
  "color:#c084fc">const to = document.getElementById('to').value;

  "color:#c084fc">const url = `https:var(--text3)">//usdconverter.com/api/convert?from=${from}&to=${to}&amount=${amount}`;
  "color:#c084fc">const res = "color:#c084fc">await fetch(url);
  "color:#c084fc">const data = "color:#c084fc">await res.json();

  "color:#c084fc">if (data.success) {
    document.getElementById('result').textContent =
      `${data.amount} ${data.from} = ${data.result} ${data.to}`;
  } "color:#c084fc">else {
    document.getElementById('result').textContent = 'Error: ' + data.error;
  }
}

Load the Extension

  1. 1. Save all three files in a folder
  2. 2. Open Chrome and navigate to chrome://extensions
  3. 3. Enable “Developer mode” (top right toggle)
  4. 4. Click “Load unpacked” and select your folder
  5. 5. Click the extension icon to convert currencies

Need a Different Integration?

Our API works with any platform that can make HTTP requests. Check the full documentation for more examples.

Developer DocsAPI Reference