Forma generatorului MODX REVO de feedback. MODX - Formular de feedback (formit)

În MODX există o oportunitate interesantă - puteți schimba aspect Editarea resurselor Forme practic după cum doriți. Mai mult decât atât, puteți face diferite forme pentru diferite grupuri de utilizatori și chiar pentru diferite resurse. Puteți alege diferite profiluri de forme pentru din această resursă În funcție de șablonul, părinte sau alte proprietăți.

Și pentru asta nu trebuie să scriem o singură linie de cod!

Să vedem ce, de exemplu, puteți face cu formularele:

În primul rând, eliminați elementele de meniu top inutile la un element general - "Developer". Pentru a face acest lucru, accesați secțiunea "Sistem" -\u003e Secțiunea "Acțiuni", creați un nou element de meniu în rădăcină și trageți toate punctele inutile acolo:

Apoi intrați în secțiunea "Securitate" -\u003e "Formulare de setare" și creați un nou profil, de exemplu, "Manager de conținut". Apoi apăsați-l cu butonul din dreapta al mouse-ului și selectați "Editare", accesați fila "Grupuri de utilizatori" și adăugați un grup la care vor fi aplicate noi reguli.

Apoi, creăm un nou set de reguli. Cele două tipuri ale acestora sunt una pentru formularul de creare a resurselor, al doilea - pentru formularul de editare și actualizare (creați și actualizare, respectiv). Aceste reguli pot fi oarecum - cel puțin prin regulă pentru fiecare resursă.

După crearea regulii, veți vedea pagina de setări - există trei file: informații despre setul de reguli, regiuni, câmpuri suplimentare.

Prima filă afișează câmpurile standard de resurse. Ele pot fi dezactivate sau redenumite. Regiunile sunt tab-uri la resursă. Puteți crea o nouă regiune și puteți pune unii parametri TV acolo, apoi vor avea o resursă pe fila "Câmpurile suplimentare" și pe noua contribuție pe care o veți specifica. Aici puteți dezactiva filele standard, cum ar fi "Grupuri de resurse".

În cea de-a treia filă, specificați locația unui parametru TV.

Am făcut un pătuț mic în regiunile standard:



Deci, să eliminăm imediat toate filele pentru utilizator, cu excepția mai întâi. Îndepărtăm căpușele din regiuni: MODX-PAGE-SETTINGS, MODX-Resurse-Resource-TV, MODX-Resurse-Access-Permisiuni. Mai mult - de la câmpurile standard numai pagetitle și alias vor pleca. Restul casetelor de selectare sunt curățate. Specificați un nou nume pentru câmpul Pageritle: "Titlul știrilor" și alias: "Adresa paginii".

După aceasta, accesați fila "Câmpurile suplimentare" și indicați că parametrii TV trebuie să fie în una sau altă zonă de forme (în conformitate cu pădurile).

Rămâne să specificați, pentru ce resurse această regulă este validă - în punctul de model al paragrafelor, indicăm resursele cu care șabloanele să aplice regula. Dacă regula este pentru toate șabloanele, nu specifică nimic. Și există două elemente: "câmp limiting" și "semnificație limită". Aici puteți specifica restul câmpurilor.

Să subliniem că această regulă se referă la resursele din "Știri" - în paragraful "Limiting Field" mamă., și în "valoarea limită" a resurselor "știri", de exemplu, 22 .

Am deja câteva lecții pentru a crea formulare pe formitate într-un pachet C - acest pachet are ca avantaje: trimiterea formularelor fără repornire, există o fereastră de înot pe care mesajul este trimis, etc. În consecință, minusurile: JS și codul sunt adăugate la codul. fișierul CSS. - Ceea ce dă minus viteza și în ieșirea JS nu este tipul necesar în apel, din cauza acestuia, apare un avertisment în validator - nu este necesar să o specificați în HTML 5.

Prin urmare, am decis să fac forme la o formă pură, era vorba de astăzi și o lecție.

HTML Form Markup are acum următorul cod:

Nimic special, astfel încât să vorbească standard cu un aspect de bootstrap 4. Îi voi reface, luând în considerare sintaxa și într-una pe care o creștem inutile, Russy, adăuga protecție împotriva spamului:

[[! Formit? & cârlige \u003d `spam, email` & emailtpl \u003d` email-tpl` & emailto \u003d `[[++ emailsender]]` & emailsubject \u003d `Scrisoarea de la site [[++ site_url]]` & validate \u003d `werekemail: Blank, Nume: Necesar, Email: Email: Necesar, Mesaj: Cerut: Strikags, Telefon: Necesar` & Succesmessage \u003d `

Mulțumesc, recursul dvs. este trimis.

`]] [[! + FI.SUCUCESSAGE: implicit \u003d` ``]]
[[! + FI.ERROR.NAME]]]
[[! + FI.RROR.Phone]]
[[! + FI.ERROR.Email]]
[[! + FI.Error.message]]

Analiza codului, mergem de sus în partea de jos:

& Cârlige - se adaugă aici cârlige diferite, inclusiv auto-INS: în cazul nostru, 2 standard: span - protecție simplă împotriva spamului și e-mail - obligatoriu, pentru a trimite date pe cutie poștală. Despre restul cârligelor, spun într-un detaliu în videoclip.

& Emailtpl - Chanc cu un design de litere, are următorul cod:

De la cine: [[+ nume]]

Telefon: [[+ telefon]]

E-mail: [[+ Email]]

Mesaj: [[+ mesaj]]

& Emailto - adresa e-mail unde sunt trimise formularele, în acest caz specificat setarea sistemului (cheie) ++ emailserter

& Emailsubject - Tema scrisorii trimise

& Validate - prescrie câmpuri obligatorii pentru umplerea și câmpurile frecvente pentru a proteja împotriva spamului

& SuccesSessage - Mesaj după expedierea cu succes

Nu voi dezasambla codul de cod, care este interesat să vizioneze videoclipul și să citească documentația: docs.modx.com/extras/revo/formit

Atașarea fișierelor pentru a forma

Pentru a putea atașa și trimite atașamente, este necesar să se înregistreze în eticheta matriței

Enctype \u003d "multipart / formular-date"

și respectiv adăugați câmpuri pentru a atașa un fișier

[[! + FI.Error.Upload]]

Prelucrarea chekboxers și opțiunea

Formulare multiple pe o singură pagină

Doar în apelurile fiecărui formular, scrieți

& Towvar \u003d "Numele formularului în limba engleză"

fiecare formular are propriul nume.

Lupta împotriva spamului

Cum să nu răsuciți, dar veți întâlni cu siguranță spam - cel mai mult metoda eficientă Pentru a combate -, puteți încerca, de asemenea,.

O zi buna! Astăzi vă voi prezenta pentru a crea un formular de feedback pentru Revoluția MODX, șeful căruia va fi un capping neobișnuit (deoarece Googlovsk Qaptcha este prea complicată și greoaie). Do părere Vom folosi formitarea add-on. Puteți să o instalați, probabil, bine, pentru cei care nu știu cum să o facă, încă mai taie o lecție de la început până la sfârșit. Începe!

Mi-e dor de toate momentele legate de instalare MODX REVOLUTION., configurarea sistemului, încorporarea site-ului și așa mai departe. Să începem cu instalarea pachetului de formit.

1. Mergeți la sistemul - managementul pachetelor

2. Faceți clic pe "Adăugările de încărcare"

3. Selectați din lista de formit

Faceți clic pe "Descărcați". După încărcarea formitei, apare în pachetele descărcate, faceți clic pe butonul Instalare. Formit instalat!

4. Apoi, creați o cană nouă

Să o numim "formă" și introduceți următorul cod:

[[! QAPTCHA]] [[! QAPTCHA]] [[! Formit? & Cârlige \u003d `spam, email, redirecționare" & emailtpl \u003d `Senmail` & Emailsubject \u003d` Callback Application` & Emailto \u003d `adresa dvs. de e-mail" & redirecționarea scrisului " A trimis cu succes "și validate \u003d` contact_name: obligatoriu, contact_phone_na_format: Necesar` & particavalidators \u003d `qaptcha.slider`]]

[[+ qaptcha.slider]]

Aici este provocarea formitului de fragment, forma și captcha, pe care vom forța munca în următoarele elemente. Nu uitați în parametru emailto. Specificați căsuța poștală la care trebuie să vină scrisoarea și în redirecționează.trebuie să puneți ID-ul paginii "scrisoarea trimisă cu succes"

5. Creați Chank Sentemailtpl

El va vorbi, ce informații să trimită la poștă și să introducă codul acolo:

Nume: [[+ contact_name]]
Email: [[+ contact_email]]
Telefon: [[+ contact_phone_na_format]]
Notă: [[+ contact_message]]

6. Creați un nou document numit "scrisoarea trimisă cu succes"

În conținutul resursei puteți introduce tipul de text: am primit scrisoarea dvs.! Vă mulțumim că ați ales compania noastră. Managerul nostru în cel mai scurt timp posibil vă va contacta pe telefonul de contact pe care l-ați lăsat în aplicație!

7. Acum ne vom ocupa de capacitate

Conectăm pagina Bibilot JQuery:

8. Creați cataloage active / Componente / Qaptcha / și core / Componente / Qaptcha /

În catalog active / Componente / Qaptcha /am pus dosarul imaginii și jQuery cu conținutul și în core / Componente / Qaptcha / -folder PHP cu fișierul Qaptcha.jquery

9. Creați Snippet Qaptcha

Și puneți următorul cod acolo:

reglientcss (MODX_SITE_URL. "Active / componente / Qaptcha / JQuery / Qaptcha.jquery.Css"); $ MODX-\u003e ReglientScript (MODX_SITE_URL. "Active / componente / Qaptcha / jquery / jquery-ui.js"); $ MODX-\u003e ReglientScript (MODX_SITE_URL. "Active / componente / Qaptha / jquery / jquery.ui.Touch.js"); $ MODX-\u003e ReglientScript (MODX_SITE_URL. "Active / componente / Qaptcha / jquery / Qaptcha.jquery.js"); $ MODX-\u003e SetPlaceholder ("Qaptcha.slider", "

") "Deplasați încărcătorul la dreapta pentru a debloca"); $ txtunlock \u003d $ modx-\u003e lexicon (puteți face clic pe butonul "Trimiteți"); dacă (! Gol ($ dezactivat)) $ paramqaptcha \u003d "dezactivatSubmit:" $ dezactivat ; $ paramqaptcha \u003d "phpfile: \\" ". Modx_site_url. "CORE / COMPONENTE / QAPTCHA / PHP / QAPTCHA.JQUERY.PHP \\" "$ PARAMQAPTCHA \u003d" TxTlock: \\ "" $ txtlock. "\\"; $ Paramqptcha \u003d "Txtunlock: \\" "$ txtunlock." \\ "" $ PARAMQAPTCHA \u003d Implode (",", $ paramqaptcha); $ MODX-\u003e Reglienthtmlblock ("");

Toate scripturile și fișierul CSS sunt imediat conectate prin aceasta, iar playholder este numit qaptcha.slider.

10. Punem chenk unde vrem să vedem captch (și atenție: în cazul în care biblioteca jQuery este conectată, nu va funcționa fără bibliotecă) și nu va fi bucurat :))

Toate lucrările de succes și starea de weekend bun!

P.S. Am o idee grozavă))) în "demo" mi-am pus poșta și toate scrisorile pe care le veți trimite pentru a verifica munca scriptului vor veni la mine)), cumparat, aștept ca anecdotele și povestirile amuzante mici de la tine))

Aproape toate site-urile comerciale au o pagină a contactelor pe care se află formularul de contact prin care utilizatorii pot scrie administrațiile site-ului. Astăzi vom privi cât de repede creează un formular de contact. Vom implementa formularul de feedback folosind un pachet Formit. Într-un pachet cu un pachet Ajaxform., Instalați-le dacă nu sunt instalate.

Crearea unui formular de feedback la MODX REVO cu o autorizație de prelucrare a datelor cu caracter personal în conformitate cu Legea nr. 152-FZ "pe datele personale" din 27 iulie 2006.

Primul lucru pe care îl creăm o pârâu, în care forma însăși va fi stocată, lăsați-o să fie declanșată "Kontact-Form" și să fie pusă în el codul unui formular standard, practic, pe site-urile web folosind Bootstrap, așa că voi lua un standard Un pic convertit puțin, codul său static va fi așa:

Acordul Utilizatorului

Aspectul dvs. va fi diferit, deoarece forma mea este stilizată în cadrul proiectului, stilurile CSS nu văd semnificația.

Aici puteți vedea alte formulare. getbootstrap.com/css/#forms.

Și acum voi redo codul în dinamică, ținând cont de sintaxa Formit. și Ajaxform., Am următorul.

[[+ FI.Error.Name]]
[[+ FI.ERROR.Email]]
[[+ FI.ERROR.PFONE]]]
[[+ FI.Error.message]]

Prin punerea unui semn, îmi dau consimțământul pentru prelucrarea datelor mele personale în conformitate cu Legea nr. 152-FZ "pe datele personale" din 27 iulie 2006 și să accepte termenii acordului de utilizare

[[+ Fi.Success: este \u003d `1`: atunci \u003d`
[[+ FI.SUCUCESSAGES]]
`]] [[+ FI.Valudition_Error: este \u003d` 1`: atunci \u003d `
[[+ FI.Valudition_Error_Message]]
`]]

Acum creăm o altă chantă, care va forma o scrisoare, să o numim formularul TPL-Kontact cu următorul cuprins:

Nume: [[+ Nume]]

Email: [[+ Email]]

Telefon: [[+ PFONE]]

Mesaj: [[+ mesaj]]

Ei bine, a devenit încheiat în locul potrivit:

[[! Ajaxform? & Snippet \u003d `Formit` & Form \u003d` Kontact-Form "& EmailtPl \u003d" TPL-Kontact-Form "& Hooks \u003d` Spam, Email` & Emailsubject \u003d "Mesajul site-ului [[++ SITE_URL]]` & Emailto \u003d ` [E-mail protejat]`& Validate \u003d` Numele: Necesar, Email: Necesar` & validationerrorMessage \u003d `în formularul conține erori! & SuccesSessage \u003d" Mesajul trimis cu succes! `]]

Nu uitați să schimbați valoarea emailto. pe poșta dvs.

Documentație componentelor:

  1. Formit.docs.modx.com/extras/revo/formit.
  2. Ajaxform.docs.modx.pro/components/ajaxform.

Asta e practic!

Pentru a crea un formular pe MODX fără spam, este necesar să o creați cu câmpuri invizibile suplimentare:

1. Descărcați și instalați componentele Ajaxform și formit

2. Formularul este numit foarte simplu, trebuie să vă dați seama

[[! Ajaxform? & Snippet \u003d `Formit` & Form \u003d` Tpl.Ajaxform..ru `& Emailto \u003d` [E-mail protejat]site & Validate \u003d `Numele: Necesar, Email: Necesar, Mesaj: Necesar, Work-Email: Blank` & validationerrorMessage \u003d` Formularul conține erori! `& SuccesSessage \u003d` Multumesc pentru aplicatii! Vom contacta în viitorul apropiat. & EmailtPl \u003d `mafterpl`]]

Sau prin fenom Shablanizer, astfel:

($ _modx-\u003e runsppepet ("Ajaxform", ["Snippet" \u003d\u003e "Formit", "Formular" \u003d\u003e "tpl.ajaxform.example", "cârlige" \u003d\u003e "Email, spam" "Emailfrom" \u003d\u003e " [E-mail protejat]"," Emailsubject "\u003d\u003e" Aplicație din site-ul Daruse.ru "," Emailto "\u003d\u003e" [E-mail protejat]", Validate" \u003d\u003e "Nume: Necesar, Email: Necesar, Mesaj: Necesar, Work-Email: Blank", "validationerrmassage" \u003d\u003e "În formularul conține erori!", "SuccesMessage" \u003d\u003e "Vă mulțumim pentru Aplicație! Vă vom contacta în viitorul apropiat "," Emailtpl "\u003d\u003e" MailTPL ",])))

Descrierea parametrilor:

  • fragmentul - Fragmente pentru procesarea Ajaxform, Set Formit - Trimite doar literele
  • formular - Canka Form Design, este cel care este implicit
  • cârlige - cârlige pentru a proteja împotriva spamului
  • email Romanian - Adresa de la care vine scrisoarea
  • emailto - adresa pe care o vine scrisoarea
  • validați - Validare, aici și două câmpuri invizibile
  • validareErrorMessage - un mesaj care va fi ieșire, cu o intrare de succes a câmpurilor
  • succesSessage - un mesaj care va fi afișat când va fi reușit să trimită o scrisoare
  • emailtpl - Cank, în care șablonul scrisorii primite de pe poștă este stocat (citiți mai jos)

3. După aceea, mergem la bucata de design de formă, în acest caz este tpl.ajaxform.example și adăugați după eticheta formularului, următoarele două câmpuri.

...

Acum, formularul dvs. nu ar trebui să fie spam, datorită a două câmpuri noi.

4. Tipul extern de scrisoare de intrare

În mod implicit, litera vine la poștă fără formatare într-un format care nu poate fi foarte citit. Prin urmare, să punem puțină scrisoarea noastră pe exemplu.

Șablonul de litere este o cană simplă, pe care o specificăm în parametru emailtpl., totul este foarte simplu, voi scrie un exemplu de înregistrare. Dacă sunteți întrebări, scrieți în comentarii.

mailTPL:

Pe net [[++ SITE_URL]] a lăsat o aplicație.

[[+ Nume: Netmpty \u003d `

Nume: [[+ Nume]]

`]] [[+ Email: Netmpty \u003d`

Mail: [[+ email]]

`]] [[+ Mesaj: Netmpty \u003d`

Mesaj: [[+ mesaj]]

`]]

Contactați-l în viitorul apropiat.

Nu răspundeți la această scrisoare, deoarece este automată.

Citiți despre crearea și cu protecția împotriva spamului.