How to Insert a Newsletter Signup Form in Magento 2

Integrating a newsletter signup form in Magento 2 is an excellent way to engage with your customers, keep them informed about the latest products, and drive sales through targeted email marketing. Fortunately, Magento 2 provides several flexible options to insert a newsletter signup form. 

This guide will walk you through the process of how to Magento 2 insert newsletter signup form effectively.

Step 1: Enable the Newsletter Module

First, ensure the newsletter functionality is enabled in your Magento 2 store. To do this:

magento 2 insert newsletter signup form

  1. Log in to your Magento 2 Admin Panel.
  2. Go to Stores > Configuration > Customers > Newsletter.
  3. Set Enabled to Yes if not already configured.

Step 2: Insert the Newsletter Signup Block

Magento 2 comes with a built-in newsletter subscription block, which can be added to various positions in your store’s layout. To insert a newsletter signup form in Magento 2, follow these steps:

1. Create or edit the `default.xml` file in your theme at:

app/design/frontend/Vendor/theme_name/Magento_Theme/layout/default.xml

2. Insert the following XML to add the newsletter widget:

 

     ```xml

     <referenceContainer name="footer">

         <container name="newsletter-subscription" as="newsletter" label="Newsletter Subscription" htmlTag="div" htmlClass="footer-sub">

             <block class="Magento\Newsletter\Block\Subscribe" name="footer.newsletter" template="Magento_Newsletter::subscribe.phtml"/>

         </container>

     </referenceContainer>

     ```

3. Ensure to flush the cache to see the updates:

 

   ```bash

   php bin/magento cache:clean

   php bin/magento cache:flush

   ```

Step 3: Customize the Newsletter Form

To match your store's branding, you may want to customize the appearance of the newsletter signup form.

1. You can copy the subscribe template file from the core module to your custom theme for modification. Copy the file from:

     vendor/magento/module-newsletter/view/frontend/templates/subscribe.phtml

  To:

     app/design/frontend/Vendor/theme_name/Magento_Newsletter/templates/subscribe.phtml

 

2. Customize the HTML and styling as needed.

3. Add or edit CSS rules to style the newsletter signup form. You can do this in your theme’s custom CSS file:

     app/design/frontend/Vendor/theme_name/web/css/source/_extend.less

Step 4: Test the Newsletter Signup Form

After implementing the newsletter signup form in Magento 2, ensure it's functioning correctly.

  • Frontend Testing: Visit your Magento store's frontend to view the newsletter signup form and ensure it integrates well with the overall site design.
  • Functionality Testing: Sign up with a test email address to verify that the form captures subscriber information and sends confirmation emails properly.
Loading

Didn’t you find the answer to your question? We are always happy to help you out.

Loading