array( array( 'key' => 'label', 'type' => 'text', 'label' => __( 'Name of the step that starts here', '2ranq-forms' ), 'help' => __( 'Shown in the progress bar.', '2ranq-forms' ), ), array( 'key' => 'next_text', 'type' => 'text', 'label' => __( 'Next button', '2ranq-forms' ), 'help' => __( 'Leave empty for "Next".', '2ranq-forms' ), ), array( 'key' => 'prev_text', 'type' => 'text', 'label' => __( 'Back button', '2ranq-forms' ), 'help' => __( 'Leave empty for "Back".', '2ranq-forms' ), ), ), 'advanced' => array( array( 'key' => 'css_class', 'type' => 'text', 'label' => __( 'CSS class', '2ranq-forms' ), ), ), ); } /** * The look of the step bar for this form. * * The choice sits in the form design, because the bar is part of the design: * it is picked in the Design tab, next to the step colours, and it travels * with the form. * * @param int $form_id The form id. * * @return string The name of the look, for example `bar`. */ private function step_look( $form_id ) { $design = Ranq_Forms_Design::get( absint( $form_id ) ); return isset( $design['step_look'] ) && '' !== $design['step_look'] ? (string) $design['step_look'] : 'line'; } /** * Prints the field. A plain marker in the flow of the form, which the script * recognises and uses to split the form. * * 🔴 The name of the bar look is printed HERE, on the break itself, and not * on the form. The bar is built by `assets/js/form.js`, which always gives it * the same class names, while the form marker is printed somewhere else. That * is why the style reaches for the look through `:has()` on the form, by this * marker. The builder preview does the same, so both places draw by the same * rules. * * @param array $field The field settings. * @param int $form_id The form id. * * @return void */ public function render( $field, $form_id ) { ?>