埋め込み可能なボタンを作成する必要があるプロジェクトに取り組んでいます。クライアントにコードを渡して、Webサイトのボタンを表示したい場所にコードを配置するように依頼したいと思います。それへの最善のアプローチは何ですか?例として、次の画像を参照してください。
誰かがサンプルコードを提供してくれたら本当にありがたいです。
埋め込み可能なボタンを作成する必要があるプロジェクトに取り組んでいます。クライアントにコードを渡して、Webサイトのボタンを表示したい場所にコードを配置するように依頼したいと思います。それへの最善のアプローチは何ですか?例として、次の画像を参照してください。
誰かがサンプルコードを提供してくれたら本当にありがたいです。
最も単純な形式は、ハイパーリンクを提供することです。
<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>
javascriptソリューションはあなたが必要とするものだと思います。ボタンのHTMLを書き込むJavaScriptを作成します。たとえば、コードを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>
結果は、スクリプトの直後にレンダリングされた、サイトへのリンクを含む画像になります。インラインスタイリングも使用できます。ボタンのスタイルの変更を防ぎたい場合は、これが良いオプションだと思います。
簡単なリンクを使用できます。
<a href="http://yoursite.com">Blah</a>
次に、クライアントにこのコードをサイトに埋め込むように依頼します。明らかに、クライアントサイトとサイトの間で交換する必要のある情報に応じて、追加のパラメータ、javascriptコード、...が存在する可能性があります。