ダウンロードボタンの作り方

ビデオ: 【知ってる？】スイッチが100倍楽しめる小技・裏技・便利技11選まとめ

コンテンツ

ステップ
方法1/2：HTMLボタンを作成する
方法2/2：ボタンを画像として作成する
警告

ダウンロードボタンを使用すると、単にリンクしてダウンロードするよりも、サイトをよりプロフェッショナルに見せることができます。ボタンはすっきりとしたインターフェースを提供し、自分で何かをデザインする場合、ボタンはページデザインの不可欠な部分になる可能性があります。このチュートリアルに従って、HTMLボタンまたは独自のカスタムボタンを作成します。

ステップ

方法1/2：HTMLボタンを作成する

1 ソースエディタでボタンを作成します。 メモ帳やテキストエディットのような単純なテキストエディタで十分です。テキストエディタで、次のコードを入力します。
2 ファイルをサーバーにアップロードします。 ダウンロード用のファイルを提供する場合は、ファイルをサーバーに保存するか、ボタンをネットワーク上の別の場所にあるファイルに関連付ける必要があります。 FTPクライアントを使用して、サイトサーバーで使用できるようにするファイルをアップロードします。
3 自分が保存していないファイルにリンクする場合は、ウェブマスターの権限があることを確認してください。
4「ダウンロード場所」を実際のダウンロードURLに置き換えます。アドレスは必ず一重引用符で囲み、「window.location = 'ダウンロード場所」は二重引用符で囲んでください。HTTP：//やFTP：//などのプレフィックスを追加し、.webpや.EXEなどのファイル拡張子を追加してください。 ..
5 ボタンに書いてください。 「ボタンテキスト」をボタンに表示する単語に置き換えます。必ず二重引用符で囲んでテキストを含めてください。画面上のボタンが扱いにくくならないように、フレーズは短くしてください。
6 ページにソースコードを配置します。 ボタンのソースコードはページのどこにでも貼り付けることができ、ボタンはその場所に正確に表示されます。新しいページコードをアップロードして、新しいボタンをテストします。

方法2/2：ボタンを画像として作成する

1 ダウンロードボタンを描画します。 好きな画像エディタを使用して、サイトのスタイルに一致するボタンを描画します。ボタンは好きなだけ大きく（または小さく）することができます。
2 ボタン付きのファイルと画像をサーバーにアップロードします。 ダウンロード用のファイルを提供する場合は、ファイルをサーバーに保存するか、ボタンをネットワーク上の別の場所にあるファイルに関連付ける必要があります。 FTPクライアントを使用して、サイトサーバーで使用できるようにするファイルをアップロードします。
- このボタンを追加したページが配置されているサーバー上の同じ場所にボタンの画像をアップロードします。
3 ダウンロード用のソースコードを記述します。 画像としてレンダリングされたダウンロードボタンは、HTMLの他のすべてのリンクと同じように機能します。次のコードをエディターにコピーします。
4ファイルと画像の情報を入力します。「ダウンロード場所」を、HTTP：//またはFTP：//プレフィックスを含む実際のダウンロードURLに置き換えます。「画像ファイル」をボタン画像のファイル名に置き換えます。ファイルがサーバー上のページと同じ場所にある場合は、フルパスを指定する必要はありません。
- 「ホバーテキスト」を、ユーザーがボタンの画像にカーソルを合わせたときに表示されるテキストに置き換えます。
- 「X」と「Y」をそれぞれピクセル単位の画像の幅と高さに置き換えます。
- これらのエントリはすべて二重引用符で囲んで追加してください。
5 ページにソースコードを入力します。 ボタンが表示される場所にコードを配置します。新しいコードをアップロードしてからウェブページを開いて、ボタンが機能するかどうかを確認します。ヒントテキストがホバーに表示され、画像自体が正しいサイズであることを確認してください。

警告

著作権法に違反してファイルをアップロードしないでください。これにより、罰金が科せられたり、懲役刑が科せられたりする可能性があります。
ファイルが保存されている他のサイトに依存するよりも、ファイルを自分のサーバーにアップロードして後で共有する方がはるかに優れています。別のサイトからファイルの場所へのリンクをコピーする場合、作成したダウンロードボタンは、リンクが有効である限り機能します。ユーザーがボタンをクリックしたときにファイルをダウンロードできること、およびユーザーがボタンをクリックしたときに壊れたリンクをクリックしないことを確認するために、ボタンまたはリンクを取得したサイトのリンクの機能を定期的にチェックする必要があります。ファイルがもう存在しないという事実。