F5KCK
/
hugo-mx-gateway
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

review the description of the sample Hugo form

This commit is contained in:
Rodrigue Chakode 2022-04-30 11:47:16 +02:00
parent 0052f21f2e
commit a14a38ae89
3 changed files with 25 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -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

24
docs/sample-contact-form-for-hugo.md Normal file
View File

@ -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 `<form>` 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]
---
```

30
docs/sample-of-hugo-dontact-form.md
View File

@ -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 `<form>` 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)