Crearea unui formular de contact fără plugin

Question

Crearea unui formular de contact fără plugin

1 apr. 2018, 15:08:29

Vizualizări: 17.2K

Voturi: 3

Sunt nou în dezvoltarea WordPress și m-am săturat să mă lupt cu Contact Form 7 pentru a-l styliza așa cum doresc. Este posibil și nu este considerată o practică proastă să pun un formular HTML pe pagina mea de contact și să îl trimit către o pagină PHP care să proceseze datele? Sau pur și simplu nu se face așa ceva?

user8463989

593

formulare formular contact 7

Comentarii

ai încercat extensia Smart Grid-layout care îți permite să creezi layout-uri complexe pentru formulare folosind o interfață grid, s-ar putea să te împaci cu CF7

Aurovrata

1 apr. 2018 19:07:52

Un lucru pe care aș adăuga la orice formular codat manual este atât un câmp ascuns pentru a verifica dacă trimiterea a avut loc efectiv de pe formular, cât și un câmp ascuns CSS (precum și ARIA) pe care îl verifici să fie gol ca un "test invers de tortură"

Cedon

2 apr. 2018 01:45:41

Toate răspunsurile la întrebare

Comentarii

Unde ai pune acest cod?

user8463989

2 apr. 2018 09:38:14

Probabil aș crea un simplu plugin.

kierzniak

2 apr. 2018 09:48:46

@user8463989 - acest cod poate fi pus în fișierul functions.php din childtheme-ul tău... lucrezi cu un child theme, nu?

HPWD

11 feb. 2019 22:36:21

Destul de ciudat, după ce am găsit acest răspuns, am avut ocazia să folosesc acest cod ca punct de plecare. Foarte frumos.

HPWD

15 feb. 2019 16:21:00

Implementare frumoasă. Unde pot controla acțiunea formularului, adică unde este trimis formularul?

MontyHall

4 sept. 2019 10:02:04

Arată celelalte 1 comentarii

Toate pluginurile pentru formulare sunt groaznice, pur și simplu pentru că formularele sunt de obicei foarte complexe de codat corect, mai ales când administratorul site-ului ar trebui să le poată proiecta.

Nu este nimic greșit în a vă codifica singur un formular, doar că probabil va trebui să recreați lucruri pe care alții le-au perfecționat deja sau măcar au pus bazele bune (formatarea emailurilor, stocarea în baza de date și probabil mai multe).

Așadar, depinde cu adevărat de cerințele dumneavoastră specifice. Dacă nu este necesară flexibilitate și doar trimiterea unui email este suficientă, ar trebui să fie mai ușor să vă scrieți propriul formular decât să "luptați" cu pluginurile.

Mark Kaplun

23.7K

1 apr. 2018 16:22:54

Comentarii

Cea mai mare mea problemă este încercarea de a stiliza checkbox-urile și butoanele radio folosind Contact Form 7 sau orice alt plugin pentru formulare. Mă omoară încet, motiv pentru care m-am gândit să folosesc direct un formular HTML și apoi PHP pentru a trimite datele.

user8463989

1 apr. 2018 16:34:56

@user8463989, poate ar trebui să încerci un alt plugin. CF7, după părerea mea, este prea simplist, dar nu l-am folosit niciodată, așa că poate nu sunt suficient de familiarizat pentru a-l critica. Toate au tot felul de neajunsuri, niciunul nu este perfect cu adevărat.

Mark Kaplun

1 apr. 2018 16:46:20

Am încercat câteva care funcționează, dar am aceeași problemă. CSS-ul se strică. Poate pentru că încerc să convertesc un formular HTML la WordPress, nu știu.

user8463989

1 apr. 2018 21:09:57

Deoarece nu efectuezi operațiuni CRUD pe baza de date, nu văd de ce nu. Am mai făcut asta în trecut, folosind un șablon de pagină pentru procesarea formularului și am direcționat acțiunea <form ...> action către acesta action="<?php echo home_url( 'slugul-sablonului-paginii-de-procesare-formular' ); ?>".

Alternativ, poți folosi postul individual pentru procesare, adică action="<?php echo get_the_permalink();?>" (trebuie să fie is_single() || is_singular() pentru a folosi get_the_permalink()).

jaredrethman

198

1 apr. 2018 16:21:04

kierzniak 2.47K · Accepted Answer · 2018-04-01T21:15:03Z

Aceasta este implementarea mea simplă a unui formular de contact:

class WPSE_299521_Form {

    /**
     * Constructorul clasei
     */
    public function __construct() {

        $this->define_hooks();
    }

    public function controller() {

        if( isset( $_POST['submit'] ) ) { // Butonul de trimitere

            $full_name   = filter_input( INPUT_POST, 'full_name', FILTER_SANITIZE_STRING );
            $email       = filter_input( INPUT_POST, 'email', FILTER_SANITIZE_STRING | FILTER_SANITIZE_EMAIL );
            $color       = filter_input( INPUT_POST, 'color', FILTER_SANITIZE_STRING );
            $accessories = filter_input( INPUT_POST, 'accessories', FILTER_SANITIZE_STRING, FILTER_REQUIRE_ARRAY );
            $comments    = filter_input( INPUT_POST, 'comments', FILTER_SANITIZE_STRING );

            // Trimite un email și redirecționează utilizatorul către pagina "Mulțumim".
        }
    }

    /**
     * Afișează formularul
     */
    public function display_form() {

        $full_name   = filter_input( INPUT_POST, 'full_name', FILTER_SANITIZE_STRING );
        $email       = filter_input( INPUT_POST, 'email', FILTER_SANITIZE_STRING | FILTER_SANITIZE_EMAIL );
        $color       = filter_input( INPUT_POST, 'color', FILTER_SANITIZE_STRING );
        $accessories = filter_input( INPUT_POST, 'accessories', FILTER_SANITIZE_STRING, FILTER_REQUIRE_ARRAY );
        $comments    = filter_input( INPUT_POST, 'comments', FILTER_SANITIZE_STRING );

        // Array implicit gol
        $accessories = ( $accessories === null ) ? array() : $accessories;

        $output = '';

        $output .= '<form method="post">';
        $output .= '    <p>';
        $output .= '        ' . $this->display_text( 'full_name', 'Nume', $full_name );
        $output .= '    </p>';
        $output .= '    <p>';
        $output .= '        ' . $this->display_text( 'email', 'Email', $email );
        $output .= '    </p>';
        $output .= '    <p>';
        $output .= '        ' . $this->display_radios( 'color', 'Culoare', $this->get_available_colors(), $color );
        $output .= '    </p>';
        $output .= '    <p>';
        $output .= '        ' . $this->display_checkboxes( 'accessories', 'Accesorii', $this->get_available_accessories(), $accessories );
        $output .= '    </p>';
        $output .= '    <p>';
        $output .= '        ' . $this->display_textarea( 'comments', 'Comentarii', $comments );
        $output .= '    </p>';
        $output .= '    <p>';
        $output .= '        <input type="submit" name="submit" value="Trimite" />';
        $output .= '    </p>';
        $output .= '</form>';

        return $output;
    }

    /**
     * Afișează câmp de text
     */
    private function display_text( $name, $label, $value = '' ) {

        $output = '';

        $output .= '<label>' . esc_html__( $label, 'wpse_299521' ) . '</label>';
        $output .= '<input type="text" name="' . esc_attr( $name ) . '" value="' . esc_attr( $value ) . '">';

        return $output;
    }

    /**
     * Afișează câmp textarea
     */
    private function display_textarea( $name, $label, $value = '' ) {

        $output = '';

        $output .= '<label> ' . esc_html__( $label, 'wpse_299521' ) . '</label>';
        $output .= '<textarea name="' . esc_attr( $name ) . '" >' . esc_html( $value ) . '</textarea>';

        return $output;
    }

    /**
     * Afișează butoane radio
     */
    private function display_radios( $name, $label, $options, $value = null ) {

        $output = '';

        $output .= '<label>' . esc_html__( $label, 'wpse_299521' ) . '</label>';

        foreach ( $options as $option_value => $option_label ):
            $output .= $this->display_radio( $name, $option_label, $option_value, $value );
        endforeach;

        return $output;
    }

    /**
     * Afișează un singur buton radio
     */
    private function display_radio( $name, $label, $option_value, $value = null ) {

        $output = '';

        $checked = ( $option_value === $value ) ? ' checked' : '';

        $output .= '<label>';
        $output .= '    <input type="radio" name="' . esc_attr( $name ) . '" value="' . esc_attr( $option_value ) . '"' . esc_attr( $checked ) . '>';
        $output .= '    ' . esc_html__( $label, 'wpse_299521' );
        $output .= '</label>';

        return $output;
    }

    /**
     * Afișează checkbox-uri
     */
    private function display_checkboxes( $name, $label, $options, $values = array() ) {

        $output = '';

        $name .= '[]';

        $output .= '<label>' . esc_html__( $label, 'wpse_299521' ) . '</label>';

        foreach ( $options as $option_value => $option_label ):
            $output .= $this->display_checkbox( $name, $option_label, $option_value, $values );
        endforeach;

        return $output;
    }

    /**
     * Afișează un singur checkbox
     */
    private function display_checkbox( $name, $label, $available_value, $values = array() ) {

        $output = '';

        $checked = ( in_array($available_value, $values) ) ? ' checked' : '';

        $output .= '<label>';
        $output .= '    <input type="checkbox" name="' . esc_attr( $name ) . '" value="' . esc_attr( $available_value ) . '"' . esc_attr( $checked ) . '>';
        $output .= '    ' . esc_html__( $label, 'wpse_299521' );
        $output .= '</label>';

        return $output;
    }

    /**
     * Obține culorile disponibile
     */
    private function get_available_colors() {

        return array(
            'red' => 'Roșu',
            'blue' => 'Albastru',
            'green' => 'Verde',
        );
    }

    /**
     * Obține accesoriile disponibile
     */
    private function get_available_accessories() {

        return array(
            'case' => 'Husă',
            'tempered_glass' => 'Sticlă temperată',
            'headphones' => 'Căști',
        );
    }

    /**
     * Definește hook-urile pluginului
     */
    private function define_hooks() {

        /**
         * Adaugă acțiunea pentru trimiterea emailului
         */
        add_action( 'wp', array( $this, 'controller' ) );

        /**
         * Adaugă shortcode-ul pentru afișarea formularului
         */
        add_shortcode( 'contact', array( $this, 'display_form' ) );
    }
}

new WPSE_299521_Form();

După ce ai introdus codul, poți folosi shortcode-ul [contact] pentru a-l afișa.