From a14a38ae8979983191b5fdf2803b44d3ebde9d57 Mon Sep 17 00:00:00 2001 From: Rodrigue Chakode Date: Sat, 30 Apr 2022 11:47:16 +0200 Subject: [PATCH] review the description of the sample Hugo form --- README.md | 2 +- docs/sample-contact-form-for-hugo.md | 24 ++++++++++++++++++++++ docs/sample-of-hugo-dontact-form.md | 30 ---------------------------- 3 files changed, 25 insertions(+), 31 deletions(-) create mode 100644 docs/sample-contact-form-for-hugo.md delete mode 100644 docs/sample-of-hugo-dontact-form.md diff --git a/README.md b/README.md index 0634ac0..214d244 100644 --- a/README.md +++ b/README.md @@ -26,7 +26,7 @@ The following resources will enable you to deploy and get started with hugo-mx-g * [Deployment on Docker](./docs/deployment-on-kubernetes.md) * [Deployment on Debian](./docs/deployment-on-debian.md) * [Configuration Variables](./docs/configuration-variables.md) -* [Sample of contact form for Hugo](./docs/sample-of-hugo-dontact-form.md) +* [Sample of contact form for Hugo](./docs/sample-contact-form-for-hugo.md) * [Design Fundamentals](./docs/design-fundamentals.md) # License & Copyrights diff --git a/docs/sample-contact-form-for-hugo.md b/docs/sample-contact-form-for-hugo.md new file mode 100644 index 0000000..d48e0c6 --- /dev/null +++ b/docs/sample-contact-form-for-hugo.md @@ -0,0 +1,24 @@ + +# Sample Contact Form for Hugo + +From the source tree, the file `samples/hugo-partial-contact-form.html` contains a sample HTML form for Hugo (a screenshot is provided below). + +> This form can be used for a contact or a demo form. Indeed, as shown in the procedure below, the form is configured to be rendered specifically according to a tag set in the Hugo page content. + +![Screenshot of a successful submission](../screenshots/form-submitted-and-processed-with-success.png) + +## Setup Procedure + +* Copy the HTML form content in your target **Hugo HTML template**. +* Open the file in your favorite editor to update it. +* Modify the `
` tag to make the **action** point it your hugo-mx-gateway sendmail backend URL (this URL depends on the deployment option: [Deployment on Kubenetes](./deployment-on-kubernetes.md), [Deployment on Google Computing Engine](./deployment-on-kubernetes.md), [Deployment on Docker](./deployment-on-kubernetes.md), [Deployment on Debian](./deployment-on-debian.md). +* Edit the **Hugo Markdown content** of the target contact/demo page to ensure that the **tags** parameter holds an appropriate value (i.e. `contact` for a contact form, or `demo` for a demo request form). + + ``` + --- + title: "Contact Us" + description: "Contact request page" + date: 2020-04-25T00:20:27+02:00 + tags: [contact] + --- + ``` \ No newline at end of file diff --git a/docs/sample-of-hugo-dontact-form.md b/docs/sample-of-hugo-dontact-form.md deleted file mode 100644 index d52791e..0000000 --- a/docs/sample-of-hugo-dontact-form.md +++ /dev/null @@ -1,30 +0,0 @@ - -# Sample of contact form for Hugo - -From the source tree, the file `samples/hugo-partial-contact-form.html` contains a sample HTML form for Hugo (see screenshot below). It can be used for both contact and demo requests. - -Open the file in your favorite editor and review it. - -Notice that the form is configured to be rendered specifically according to a Hugo parameter named **tags**, which is actually a **list of tags**. If the parameter holds a tag named `contact` then, the form will be rendered as a contact form. Otherwise, it'll be rendered as a demo form. - -The integration works as follows: - * Copy the HTML form content in your target **Hugo HTML template**. - * Modify the `` tag to make the **action** point to the URL of the sendmail backend deployed previously. - * On Google App Engine, the endpoint shall be: https://PROJECT-ID.REGION.r.appspot.com/sendmail. Replace `PROJECT-ID` and `REGION`, repectively, with the GCP's project ID and the deployment region. - * On Kubernetes, the in-cluster endpoint shall be: http://hugo-mx-gateway.hugo-mx-gateway.svc.cluster.local/sendmail - * On Docker, the endpoint shall be: http://DOCKER-HOST:8080/sendmail. Replace `DOCKER-HOST` with the IP address or the hostname of the Docker machine. - * Edit the **Hugo Markdown content** of the target contact/demo page to ensure that the **tags** parameter holds a appropriate value (i.e. `contact` for a contact form, or `demo` for a demo request form). - -Here is an example of header for a Hugo Markdown page. The `tags` parameter holds a tag named `contact`) meaning that the page will be rendered as a contact request form. - - ``` - --- - title: "Contact Us" - description: "Contact request page" - date: 2020-04-25T00:20:27+02:00 - tags: [contact] - --- - ``` - - -![Screenshot of a successful submission](../screenshots/form-submitted-and-processed-with-success.png) \ No newline at end of file