根据访问者所在国家/地区更改网页横幅图像

问题描述 投票:0回答:2

我有一个小型网站(使用 HTML、PHP 和 MySQL),并希望根据访问者所在的国家/地区显示特定的横幅图像。每个国家都有不同的横幅图像。

我在 Google 上搜索了解决方案,发现很多 API(例如 HostIP)允许根据 IP 地址返回国家/地区。这很好,但我找不到如何实现它以根据国家/地区进行图像切换...

我没有开发人员知识。谁能帮我吗?

php html geolocation ip-geolocation
2个回答
0
投票

为了完成 Avinash 的回答,这是根据国家/地区切换图像的正确解决方案吗?

function switchImage($var) {
    switch ($var)
    {
    case "United states":
      $source = '/images/US.png';
      $class = 'myClass';
      $alt = 'myAlt';
      break;
    case "United Kingdom":
      $source = '/images/UK.png';
      $class = 'myClass';
      $alt = 'myAlt';
      break;
    .
    .
    .
    default:
      return "Default"; //default case
    }
}

0
投票

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Country Specific Banner</title>
    <script>
        var endpoint = 'https://apip.cc/json';
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                var response = JSON.parse(this.responseText);
                if(response.status !== 'success') {
                    console.log('Query failed: ' + response.message);
                    return;
                }
                var banner = document.getElementById('banner');
                // Change banner based on the country code
                switch(response.CountryCode) {
                    case "GB":
                        banner.innerHTML = '<a href="https://apip.cc"><img src="https://apip.cc/banner-gb.png" alt="UK Banner"></a>';
                        break;
                    case "US":
                        banner.innerHTML = '<a href="https://apip.cc"><img src="https://apip.cc/banner-us.png" alt="US Banner"></a>';
                        break;
                    default:
                        banner.innerHTML = '<a href="https://apip.cc"><img src="https://apip.cc/banner-default.png" alt="Default Banner"></a>';
                }
            }
        };
        xhr.open('GET', endpoint, true);
        xhr.send();
    </script>
</head>
<body>
    <div id="banner">
        <!-- Default content if JavaScript fails or is disabled -->
        <a href="https://apip.cc"><img src="https://apip.cc/banner-default.png" alt="Default Banner"></a>
    </div>
</body>
</html>

来源:https://apip.cc/display- Different-banners-based-on-visitor-country.html

© www.soinside.com 2019 - 2024. All rights reserved.