This article aims to explain the process of adding custom MailChimp sign up form using embed code and widgets. In order to add sign up form in this way, you’ll need to have MailChimp account in order to get started.
MailChimp sign up form code
The first step is to log into your MailChimp account. Then you need to create a new list if you already don’t have one and once you create the list you can open it up for editing. Once you are on the list page, you will notice some links above the list details and one of those link contains “Sign up forms” option, click on that option and you will get redirected to the page with Signup forms and you need to choose Embedded forms here, on this page you’ll find codes and stuff like that. You will only need the embed code here, so just copy and paste it in the Notepad or on some place where you can save your texts or embed codes for later use. See image:
Adding embed code in widget
Once you have generated embed code for your sign up form, you can access your WordPress website admin and navigate to WordPress admin -> Appearance -> Widgets. Here you need to create a new text widget and place it into the desired position. For example, our Vlog and Gridlove theme are having signup form added into the footer area. So, you can create a new text widget, paste the embed code inside it and place it in the footer sidebar position of your choice. See another image:
Once you add the code and save changes, you can tweak the overall look of the sign-up form and if you find some specific issues regarding the styling you can remove the part of the embed code that is related to the styling setup. It starts with
, so you can remove that part of the code and save changes.