保存と再開リンクをカスタマイズする方法

概要

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

CSSスニペットの追加

このドキュメントでは、すでにフォームを作成し、保存と再開アドオンを有効にしていると仮定します。

ただし、フォームでこのアドオンを有効にするのにサポートが必要な場合は、こちらの役立つガイドをご覧ください。

フォームが作成され、アドオンが有効になったら、このCSSをサイトに追加し、色、font-family、font-sizeなどを好きなようにカスタマイズしてください。

サイトに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;
}

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

通知が送信される際に、このアドオンのメール件名をカスタマイズすることもできますか？保存と再開メール通知の件名を変更する方法に関するチュートリアルをご覧ください。