ウェブサイトに資料ダウンロード機能を実装する方法

SNS広告や様々な広告をクリックすると企業のLPページが立ち上がり、「資料請求はこちら」などのボタンをクリックしてお問合せフォームに情報を入力すれば資料がダウンロードできるという形式を良く見ることがあると思います。

本記事ではどのようにしてウェブサイトに資料ダウンロード機能を実装しているのかについて解説していきます。

リンクを使用する方法

ウェブページにリンクを設置し、そのリンクをクリックすることでダウンロードが開始されるようにする方法です。この方法は比較的簡単に実装できます。

例えば、以下のように<a>タグを使用して、ダウンロードリンクを作成できます。

<a href=“ファイルのURL” download>ダウンロード</a>

href属性にダウンロードしたいファイルのURLを指定し、download属性を追加することで、ダウンロードが開始されるようになります。ただし、この方法では、ダウンロードするファイルがウェブページと同じドメインにある必要があります。

フォームを使用する方法

ウェブページにフォームを設置し、ユーザーがフォームに入力した情報を元に、ダウンロードファイルを生成し、ダウンロードさせる方法です。この方法は、より複雑な処理を行うことができます。

フォームの作成

まず、ウェブページにフォームを設置します。フォームには、ユーザーが入力する情報を設定します。以下は、名前とメールアドレスの2つの項目を持つフォームの例です。

<form action=”download.php” method=”POST”>
<label for=”name”>名前：</label>
<input type=”text” name=”name” id=”name”>
<br>
<label for=”email”>メールアドレス：</label>
<input type=”email” name=”email” id=”email”>
<br>
<button type=”submit”>ダウンロード</button>
</form>

フォームの送信先の指定

フォームを送信するときには、送信先を指定する必要があります。ここでは、ダウンロードファイルを生成するためのPHPスクリプトを指定します。action属性に指定することで、フォームの送信先を設定します。以下は、フォームの送信先をdownload.phpとする例です。

<form action=”download.php” method=”POST”>
…
</form>

フォームデータの受け取り

ダウンロードファイルを生成するためには、フォームから送信されたデータを受け取る必要があります。PHPスクリプトでは、$_POST変数を使用して、フォームから送信されたデータを受け取ることができます。以下は、nameとemailの値を受け取る例です。

$name = $_POST[‘name’];
$email = $_POST[‘email’];

ダウンロードファイルの生成

受け取ったデータを元に、ダウンロードファイルを生成します。生成方法は目的やファイル形式によって異なりますが、ここでは、テキスト形式のファイルを生成する例を示します。生成したファイルをダウンロードするために、Content-TypeヘッダーとContent-Dispositionヘッダーを設定します。

$file_name = ‘sample.txt’;
$content = ‘名前：’ . $name . “\n” . ‘メールアドレス：’ . $email;
header(‘Content-Type: text/plain’);
header(‘Content-Disposition: attachment; filename=”‘ . $file_name . ‘”‘);
echo $content;

ファイルをダウンロードする

生成されたファイルをダウンロードさせるには、生成されたファイルの URL を用意し、ダウンロード用のリンクを作成します。このリンクには、ダウンロード用の属性を設定する必要があります。

以下は、HTMLでダウンロードリンクを作成する例です。

<a href=”generated_file_url” download>Download</a>

この a タグに、href 属性に生成されたファイルの URL を指定し、download 属性を追加します。download 属性は、ダウンロード時にファイル名を指定するための属性です。属性値には、ダウンロード時のファイル名を指定することができます。例えば、以下のように指定できます。

<a href=”generated_file_url” download=”generated_file_name.pdf”>Download</a>

この場合、ダウンロードされるファイル名は generated_file_name.pdf となります。

以上のように、ウェブサイトに資料ダウンロード機能を実装する方法は、目的や要件に応じて使い分けることができます。