如何创建一个可与嵌入代码一起使用的按钮？

Question

我正在处理一个项目，需要创建一个可嵌入的按钮。我只想提供一些代码给客户，并让他们把它放在他们网站上想要显示按钮的地方。有什么最好的方法吗？请看下面的图片作为例子：

如果有人能提供一些示例代码，我将非常感激。

- aliirz

---

这个按钮应该做什么？你需要提供更多关于你在这里尝试实现的内容的细节。 - Darin Dimitrov

那你为什么不把你用来显示按钮的相同代码给他们呢？... - XCS

抱歉...我希望这个按钮只是重定向到相应客户的注册和登录页面，即客户的顾客将点击该按钮以重定向到我们系统中该客户的登录、注册页面。我希望这样能够澄清事情。 - aliirz

如果是这样，那就把它变成一个简单的链接？ - Inkbug

Answer 1

最简单的形式是提供一个超链接：

<a href="http://mysite.com/dosomething" title="DoSomething">Do Something</a>

或者您可以使用图像按钮：

<a href="http://mysite.com/dosomething" title="DoSomething">
    <img src="http://mysite.com/images/a.jpg" alt="DoSomething" />
</a>

这两个都减少了对CSS和JS的依赖。

或者您可以按照您问题中提出的建议进行操作。

<script src="http://mysite.com/scripts/embedbutton.js">
    document.write('<link rel="stylesheet" href="http://mysite.com/css/embedbutton.css" />');
    document.write('<div id="mybutton" onclick="DoSomething(event);">DoSomething</div>');

    function DoSomething()
    {
        /* action code here */
    }
</script>

- Paul Fleming

Answer 2

我认为JavaScript解决方案是你需要的。 创建一个JavaScript代码，用于编写您的按钮的HTML。例如，将代码放置在public/js/mybutton.js中。

var link = 'http://yoursite.com';
var text = '<div><a href="' + link + '"><img src="' 
    + link 
    + '/public/images/image.png" alt="Some alt text for the image" /></a></div>';
document.write(text);

接下来，在您的页面中提供一个脚本标签，让用户嵌入您的按钮。

<script src="http://yoursite.com/public/js/mybutton.js"></script>

结果将是包含指向您的站点链接的图像，渲染在脚本之后。您也可以使用内联样式。 我认为当您想要防止按钮样式修改时，这是一个不错的选择。

- Todor Todorov

Answer 3

您可以使用一个简单的链接：

<a href="http://yoursite.com">Blah</a>

然后请您的客户将此代码嵌入其网站中。显然，根据您需要在客户网站和您的网站之间交换的信息，可能会有额外的参数、JavaScript 代码等。

- Darin Dimitrov

---

但我也想让按钮有样式。如果我在按钮的样式标签中传入样式属性，这样做可以吗？ - aliirz

你可以使用<img>标签并指向你网站上的图像，将其制作成一个图像按钮或其他东西。 - Darin Dimitrov