Skip to content
Grav 2.0 is officially stable. Read the announcement →
Archive

Instert a simple contact

Started by Muut Archive 11 years ago · 18 replies · 518 views
11 years ago

I downloaded the simple_contact plugin and copied its stuff into the user/plugins/simple_contact folder. Modified and inserted the simple_contact.yaml into the user/config/plugins. These are the instructions available in its readme. To have a page with the contact created under user/pages a new folder 'contact' with contact.md in it that has:

YAML
title: 'Contact'

simple_contact: true

Now this throws a Template "contact.html.twig" is not defined ().
Searching this forum found that some code should be inserted maybe in the base template file... I'm a beginner begining to doubt that this simple_contact is the simple way to have contact form in the grav system. Your thoughts on it? What plugin do you recommand or just what am I missing here?

11 years ago

Hi!,

I haven't tested simple_contact with the latest Grav release(s). However with the release of the form plugin, there is no need to use such 3rd party plugins anymore, since the simplest way is now to setup a contact form as describe here in Grav Learn Docs.

11 years ago

Hi!
Thanks for the tip! I just updated my grav so I now have the form plugin and according to the docs copied the form folder, form and formdata twig files to the template I use (woo). Now when I try the contact page it returns the md file as plain text, no input boxes. Tried with the antimatter theme, same thing.

I was updating manually, deleted the old site, copied the new grav system and inserted in the contents of user/pages and the woo template to the templates. Modified the original site and system yaml for site details. What could I be doing wrong?

11 years ago

copy&paste from the documentation:

title: Contact
form:
name: contact

YAML
fields:
    - name: name
      label: Name
      placeholder: Enter your name
      autofocus: on
      autocomplete: on
      type: text
      validate:
        required: true

    - name: email
      label: Email
      placeholder: Enter your email address
      type: email 
      validate:
        required: true

    - name: message
      label: Message
      placeholder: Enter your message
      type: textarea
      validate:
        required: true

    - name: g-recaptcha-response
      label: Captcha
      type: captcha
      recatpcha_site_key: aeio43kdk3idko3k4ikd4
      recaptcha_not_validated: 'Captcha not valid!'
      validate:
        required: true

buttons:
    - type: submit
      value: Submit
    - type: reset
      value: Reset

process:
    - email:
        subject: "[Site Contact Form] {{ form.value.name|e }}"
        body: "{% include 'forms/data.html.twig' %}"
    - save:
        fileprefix: contact-
        dateformat: Ymd-His-u
        extension: txt
        body: "{% include 'forms/data.txt.twig' %}"
    - message: Thank you for getting in touch!
    - display: thankyou
11 years ago

PM me (on Gitter) you user/ folder zipped, so I can see directly the whole setup of pages & theme

11 years ago

Got it! The YAML frontmatter (where you define form and its parameters) must be between --- delimiters. I cannot paste them here as this forum interprets those, but add them before and after all the page content.

11 years ago

Added --- as first line and another after name still the same result when loading the page (caching disabled)

11 years ago

@obeliksz Do you mean?

---yaml

YAML
title: Contact Form

form:
    name: contact

    fields:
        - name: name
          label: Name
          placeholder: Enter your name
          autofocus: on
          autocomplete: on
          type: text
          validate:
            required: true

        - name: email
          label: Email
          placeholder: Enter your email address 
          type: email
          validate:
            required: true

        - name: message
          label: Message
          placeholder: Enter your message
          type: textarea
          validate:
            required: true

        - name: g-recaptcha-response
          label: Captcha
          type: captcha
          recatpcha_site_key: aeio43kdk3idko3k4ikd4
          recaptcha_not_validated: 'Captcha not valid!'
          validate:
            required: true

    buttons:
        - type: submit
          value: Submit
        - type: reset
          value: Reset

    process:
        - email:
            subject: "[Site Contact Form] {{ form.value.name|e }}"
            body: "{% include 'forms/data.html.twig' %}"
        - save:
            fileprefix: contact-
            dateformat: Ymd-His-u
            extension: txt
            body: "{% include 'forms/data.txt.twig' %}"
        - message: Thank you for getting in touch!
        - display: thankyou

Contact


11 years ago

after editing it as you wrote, the plaintext version of form.md is no longer shown... but nothing shows up, no content, only the header and footer.

11 years ago

I got this

Screen Shot 2015-10-28 at 17

so make sure you add --- at the beginning and at the end of the page you had. Take a look at other skeletons if you need, to see the differences in your page and the others.

11 years ago

I had problems with yaml formatting... copying from Sommerregen and removing spaces from the line beginnings got it fixed. Thank you.

11 years ago

@obeliksz Glad you sorted it out! :-D And you are right. Deleting the spaces in front of --- has to be done otherwise you get a YAML error. I added them here to fool the Muut forum editor to do not interpret them as start or end of the code.

11 years ago

Bump... how do I take this contact form to a modular page? Sorted out the
{% extends 'partials/base.html.twig' %} and {% block content %}
blocks so that now I get a white section on the modular page... I'm not sure if I sorted out correctly its "migration" to modular as in the modular directory inside forms/ I have the twig files calling out for {% extends "forms/default/form.html.twig" %} that is the path in the plugin folder, I don't know if it gets that... Or where it gets stuck. And maybe you know a better way of doing this without copying and modifying the form twig files into the modular directory... Thanks in advance!

11 years ago

... it generates only an empty from:
<form name=""
action="/newsite/home/_contact"
method="POST">

HTML
<div class="buttons">
    </div>

</form>

11 years ago
  1. In your theme, add a templates/modular/form.html.twig file copying templates/forms/form.html.twig. -> together with formdata.html.twig and forms folder from the templates folder? Shouldn't I edit first the form.html.twig to get rid of some code sections like
    TWIG
    {% extends 'partials/base.html.twig' %}
    {% block content %}
    {% endblock %}
    
  2. Create a modular folder with page type form.md -> copy the single page form.md into the modular folder that is near the modular.md file without a folder?
  3. Add the form header to the main modular page, modular.md ? -> Thats the form tag from single page form.md with from:'s properties right?
    In the form header, make sure you add the action parameter, with the modular page route -> as it this modular page is a home page it will be form: action: / another property to the form: header, right?

Thanks for the clarifications.

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1349 9 years ago
Archive · by Muut Archive, 9 years ago
2 934 9 years ago
Archive · by Muut Archive, 9 years ago
2 4060 9 years ago
Archive · by Muut Archive, 9 years ago
1 2946 9 years ago
Archive · by Muut Archive, 9 years ago
3 1117 9 years ago