HTML code – Subscription form for multiple newsletters

You can copy the following HTML code to an editor of your choice and then adapt it. Detailed information indicating which places need to be adapted in the HTML code, can be found in the following section HTML code explanations – Subscription form for multiple newsletters.
Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html lang="en">
<head>
<title>Newsletter subscription - HTML form</title>
<meta charset="UTF-8">
<style>
        body {
        font-family: Arial, Helvetica, sans-serif;
    }
         
        * {
        box-sizing: border-box;
    }
         
        input[type=text], select {
            width: 100%;
            padding: 12px;
            border: 1px solid #ccc;
            border-radius: 4px;
            box-sizing: border-box;
            margin-top: 6px;
            margin-bottom: 10px;
            resize: vertical;
        }
         
        .container {
            width: 720px;
            border-radius: 5px;
            background-color: #f2f2f2;
            padding: 20px;
        }
         
        button {
            background-color: #4b4241;
            color: white;
            padding: 12px 20px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            margin-top: 15px;
        }
         
        button:hover {
            background-color: #00a19c;
        }
         
        label {
            display: block;
            margin-bottom: 5px;
        }
</style>
         
<script type="module" src="https://unpkg.com/friendly-challenge@0.9.9/widget.module.min.js" async defer></script>
<script nomodule src="https://unpkg.com/friendly-challenge@0.9.9/widget.min.js" async defer></script>
</head>

<body>
        <h1>Subscribe to our newsletter</h1>
        <p>Our free monthly newsletter informs you about new products and current developments.</p>
        
        <div class="container">
         <form action="https://web.inxmail.com/[organisation]/subscription/servletv3" method="post">
                    <input type="hidden" name="INXMAIL_HTTP_REDIRECT" value="[URL for landing page "Success"]"/>
                    <input type="hidden" name="INXMAIL_HTTP_REDIRECT_ERROR" value="[URL for landing page "Error"]"/>
                    <input type="hidden" name="INXMAIL_CHARSET" value="UTF-8"/>
        <label>Email*
                    <input type="text" name="email">
               </label>
                <label>Salutation
                        <select name="Anrede">
                            <option value="male">Mr</option>
                            <option value="female">Ms</option>
                            <option value="neutral">Divers</option>
                        </select>
                </label>
                   <label>First name
                        <input type="text" name="First name">
                   </label>
                   <label>Last name
                        <input type="text" name="Last name">
                   </label>
                <label>
                        <input type="checkbox" name="INXMAIL_SUBSCRIPTION" value="[mailing list 1]">Mailing list 1
                </label>
                <label>
                        <input type="checkbox" name="INXMAIL_SUBSCRIPTION" value="[mailing list 2]">Mailing list 2
                </label>
                <label>
                    <input type="checkbox" name="INXMAIL_TRACKINGPERMISSION">
                        Yes, I agree to my personal user behaviour in the newsletter being collected and analysed so that the content of the newsletter can be targeted better to my personal interests. I can deactivate this function at any time via a link in the newsletter.<br>
                   </label>
                   
        <input type="submit"/>
        <div class="frc-captcha" data-sitekey="FCMQMF2A9M34Q6HJ" data-puzzle-endpoint="https://eu-api.friendlycaptcha.eu/api/v1/puzzle"></div>
            </form>
    </div>
</body>
</html>