<html lang="ja-jp" dir="ltr"><head></head><body>### [保存と再開リンクのカスタマイズ方法](https://wpforms.com/developers/how-to-customize-the-save-and-resume-link/)

**公開日:** 2024年1月5日
**著者:** エディトリアルチーム

**抜粋:** このCSSスニペットは、保存と再開リンクをボタンのように表示する方法を説明します。

**コンテンツ:**

## 概要

保存と再開リンクをカスタマイズしたいですか？簡単なCSSスニペットを使用すると、**保存と再開アドオン**が有効になっているときに表示されるテキストリンクを、ボタンのように表示するように簡単に変換できます。始めましょう！

## CSSスニペットの追加

このドキュメントでは、フォームが既に作成され、**保存と再開アドオン**が有効になっていることを前提とします。

ただし、このアドオンをフォームで有効にするのに支援が必要な場合は、[こちらの役立つガイドをご覧ください](https://wpforms.com/docs/how-to-install-and-use-the-save-and-resume-addon-with-wpforms/ "保存と再開アドオン")。

フォームが作成され、アドオンが有効になったら、このCSSをサイトに追加し、色、フォントファミリー、フォントサイズなどを自由にカスタマイズしてください。

CSSスニペットをサイトに追加する方法と場所について支援が必要な場合は、[こちらのチュートリアルをご覧ください](https://wpforms.com/developers/how-to-add-custom-css-styles-for-wpforms/ "WPFormsのカスタムCSSスタイルの追加方法")。

#### すべてのフォームのスタイリング

```

a.wpforms-save-resume-button {
    padding: 10px;
    text-decoration: none !important;
    background-color: #e27730;
    border-radius: 3px;
    color: #ffffff !important;
    font-family: 'Roboto' !important;
    font-size: 17px !important;
    border: 1px solid #e27730;
    transition: all 0.3s ease-out;
}

a.wpforms-save-resume-button:hover {
    color: #e27730 !important;
	background-color: #ffffff;
}
```

#### 特定のフォームのスタイリング

この変更を特定のフォームにのみ適用したい場合は、代わりにこのCSSを使用してください。

```

form#wpforms-form-999 a.wpforms-save-resume-button {
    padding: 10px;
    text-decoration: none !important;
    background-color: #e27730;
    border-radius: 3px;
    color: #ffffff !important;
    font-family: 'Roboto' !important;
    font-size: 17px !important;
    border: 1px solid #e27730;
    transition: all 0.3s ease-out;
}

form#wpforms-form-999 a.wpforms-save-resume-button:hover {
    color: #e27730 !important;
	background-color: #ffffff;
}
```

CSSのフォームIDを、ご自身のフォームIDに合わせて**999**から更新する必要があることに注意してください。フォームIDの見つけ方について支援が必要な場合は、[こちらの役立つガイドをご覧ください](https://wpforms.com/developers/how-to-locate-form-id-and-field-id/ "フォームIDとフィールドIDの見つけ方")。

これでフォームを表示すると、違いがすぐにわかります！

![このCSSを使用すると、保存と再開リンクを簡単にカスタマイズできます](https://wpforms.com/wp-content/uploads/2024/01/wpforms-customize-save-resume-link.jpg)

このアドオンで通知が送信される際、メールの件名をカスタマイズしたいですか？[保存と再開メール通知の件名を変更する方法](https://wpforms.com/developers/how-to-change-the-email-subject-on-save-and-resume-email-notifications/ "保存と再開メール通知の件名を変更する方法")に関するチュートリアルをご覧ください。

**カテゴリー:** スニペット

**タグ:** CSS, 保存と再開

---</body></html>