Zahlenregler anpassen

Einleitung

Möchten Sie das Zahlenregler-Feld mit Dezimalstellen anpassen? Standardmäßig können Sie mit diesem Feld im Formularersteller Ihre Schritte anpassen, aber es ist auf ganze Zahlen beschränkt.

Wenn Sie von ganzen Zahlen zu Dezimalzahlen wechseln möchten, sind Sie hier genau richtig!

Hinzufügen des Snippets

In diesem Tutorial beginnen wir damit, das folgende Snippet zu unserer Website hinzuzufügen. Wenn Sie unsicher sind, wo oder wie Sie Snippets hinzufügen können, werfen Sie bitte einen Blick auf dieses Tutorial für Anleitungen.

/**
 * Customize the number slider
 * Apply the class "wpf-num-limit-slider" to the field to enable.
 *
 * @link https://wpforms.com/developers/how-to-customize-the-number-slider/
 */
 
function wpf_dev_num_slider_step_count() {
    ?>
    <script type="text/javascript">
        jQuery(function(){

            // Enter the step amount you would like to update. 
            // Default step count is 1 in whole numbers only 
            jQuery( '.wpf-num-limit-slider input' ).attr({ 'step': .1 } ); 
        });
 
    </script>
    <?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_num_slider_step_count', 30 );

Dieses Snippet wurde entwickelt, um jeden Zahlenregler in Ihren WPForms zu finden, der die CSS-Klasse wpf-num-limit-slider hat. Sobald es diese Felder identifiziert hat, wird der Wert Schrittweite modifiziert, sodass er in Schritten von 0,1 erhöht werden kann.

Erstellung des Formulars

Lassen Sie uns nun mit der Erstellung Ihres Formulars beginnen. Wenn Sie sich bei der Erstellung eines Formulars unsicher sind, können Sie sich zur Unterstützung an unsere umfassende Dokumentation wenden.

Fügen Sie die erforderlichen Felder zu Ihrem Formular hinzu, einschließlich mindestens eines Zahlenregler-Feldes.

Nachdem Sie das Zahlenregler-Feld hinzugefügt haben, navigieren Sie zur Registerkarte Erweitert und geben Sie wpf-num-limit-slider in das Feld CSS-Klassen ein. Dies hilft bei der Identifizierung der Felder, auf die dieses Snippet angewendet werden soll.

Sobald Sie Ihr Formular gespeichert und eine Vorschau davon angezeigt haben, werden Sie sofort feststellen, dass die Schritte beim Interagieren mit dem Regler nun reibungslos in Dezimalstellen aufsteigen. Diese Anpassung macht Ihr Zahlenregler-Feld vielseitiger.

Und das ist alles, was Sie brauchen, um das Zahlenregler-Feld anzupassen. Möchten Sie den Bereich eines Standard-Zahlen-Feldes einschränken? Werfen Sie einen Blick auf unser Tutorial So schränken Sie den zulässigen Bereich im Zahlenfeld ein.

Verwandt

Aktionsreferenz: wpforms_wp_footer_end