How to Add a Form to Magento (Open Source)

November 7, 2024

Magento is a robust and versatile e-commerce platform widely known for its open-source nature. It provides a flexible framework for website development, empowering businesses to create feature-rich and scalable online stores. With its broad customization options and integration capabilities, Magento allows you to build an innovative and tailored e-commerce store.

Note

This user guide is created with visuals from the Magento Open Source platform. If you are building your e-commerce site with Adobe Commerce and notice that the steps here aren’t the same, please contact us for help.

Getting the Embed Code

Follow these steps to copy the embed code for your Magento website:

  1. In Form Builder, click on Publish.
  2. Next, click on Platforms.
Platforms tab of Form Builder Publish tab in Jotform
  1. Then, select Magento. You can use the search bar to find it easily.
Magento publish option in Platforms tab of Form Builder in Jotform
  1. In the next screen, click on Copy Code.
Magento Copy Code button in Platforms tab of Form Builder in Jotform

Embedding the Form

The direct approach to adding a form to your Magento website is through your site’s pages. You can add the form to a new page or an existing one. Follow these steps to embed your form on your Magento website:

  1. In Magento Page Builder, click on the Content tab on the left side of the page.
  2. Under Elements of the Content menu, select Pages.
Pages element in the Content tab menu of the Magento Page Builder
  1. In the Pages section, Click the Add New Page button to add a new page for the form, or click on Edit option from the Action column menu of an existing page if you wish to add the form there.
Add New button and Edit Page option of thee Page section in Magento Page Builder
  1. Drag and drop the HTML Code element from the Elements menu.
  2. Click on the Gear icon of the HTML Code element to open the Edit HTML Code window.
Settings button of the HTML Code element in Magento Page Builder
  1. Paste your form embed code, and click on the Save button at the top.
Source code editor and Save button of the Edit HTML Code window in Magento Page Builder
  1. Click the Save button at the top of the page builder to apply the changes to your website.
Save button of the Magento Page Builder

See also: Elements – HTML Code.

Push Notifications for Jotform Apps
Contact Support:

Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:

Support Forum: https://www.jotform.com/answers/

Contact Jotform Support: https://www.jotform.com/contact/

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Comments:

  • Liz - Profile picture
  • ayesha - Profile picture
  • wasim - Profile picture
  • prashansa - Profile picture
  • retrospecbicycles - Profile picture
  • abc - Profile picture
  • chhavi sharma - Profile picture
  • guest_23622122140032 - Profile picture