この記事では、私がこのブログで実践しているブログカスタマイズのうち、 Amazon で購入するのボタン（下記のボタン）のCSSとHTMLのコードをお伝えします。
Amazonで購入
※Amazonのトップページに飛びます
Amazonで購入！ のボタンのCSS＆HTMLのコードはコレだ！
AmazonボタンのCSSは、下記のコード。
AmazonボタンのHTMLは、下記のようになります。
※ 「#」をジャンプ先のリンクに置き換えて使用してください。
Amazonボタンを自作した理由
世の中には、 Amazon や楽天の購入ページにジャンプできるカエレバなど便利なサービスがたくさんあります。
でも、カエレバは以前に自分以外のトラッキング ID が混入してしまったことがあったそうそうで、少々不安に思っていました。
設定するは面倒ですが、何か問題があっても自分で対処できるようにと思い、 CSS で作ってみました。
まだまだ CSS も HTML も学んでいる最中なので細かいところはよく分かっていないところもあるのですが、ネット上にある皆さんのお知恵をお借りしながら作りました。
参考にさせて頂いたブログ
天下のサルワカ様。 WordPress で大人気のテンプレート「Sango」の作成チームによるCSSのデザイン一覧です。
Amazonボタンのデザインを参考にさせていただきました。Webデザインにお詳しい方で、どの記事も参考になり、じっくり読ませていただいています。いつもありがとうございます✨
記事一覧
もうひとつオマケにいかがですか？ 「ご飯の用意ができました」記事一覧ページはこちらからどうぞ♬
