{"id":22776266,"url":"https://github.com/gndx/react-mailchimp-form","last_synced_at":"2025-04-13T08:20:45.841Z","repository":{"id":52307906,"uuid":"123081130","full_name":"gndx/react-mailchimp-form","owner":"gndx","description":"React subscribe form for Mailchimp","archived":false,"fork":false,"pushed_at":"2023-02-14T18:37:14.000Z","size":13,"stargazers_count":62,"open_issues_count":24,"forks_count":46,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-09T07:41:44.662Z","etag":null,"topics":["hacktoberfest","mailchimp","react"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/gndx.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-02-27T06:04:30.000Z","updated_at":"2024-07-03T20:49:48.000Z","dependencies_parsed_at":"2024-06-18T17:02:29.842Z","dependency_job_id":"f6282d48-b7d1-41b8-a602-9398d96698d8","html_url":"https://github.com/gndx/react-mailchimp-form","commit_stats":{"total_commits":11,"total_committers":4,"mean_commits":2.75,"dds":0.2727272727272727,"last_synced_commit":"9509262c8ed3b677aff483970beccd8c945b83ce"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gndx%2Freact-mailchimp-form","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gndx%2Freact-mailchimp-form/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gndx%2Freact-mailchimp-form/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gndx%2Freact-mailchimp-form/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gndx","download_url":"https://codeload.github.com/gndx/react-mailchimp-form/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248681598,"owners_count":21144715,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hacktoberfest","mailchimp","react"],"created_at":"2024-12-11T19:09:08.759Z","updated_at":"2025-04-13T08:20:45.802Z","avatar_url":"https://github.com/gndx.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-mailchimp-form\n\nIt provides an easy-to configure component to add a mailchimp form to your react project\n\n# Install\n\n```npm\nnpm install react-mailchimp-form\n```\n\nBe sure to include the --save option to add this as a dependency in your application's package.json\n\n# Usage\n\nFirst you have to configure your Mailchimp account:\n\n1. Create a new account or use an existing one\n2. Add a new list or use an existing one\n3. Personalize the fields on your list on \"Settings \u003e List Fields\"\n4. Copy the HTML and extract the action from \"Signup Forms \u003e Embedded forms\"\n\nThe action URL will look like this (\"YOUR-USER\" may be \"twitter\" on certain accounts - just subsitute it with your username in this case):\n\n```\nhttps://\u003cYOUR-USER\u003e.us16.list-manage.com/subscribe/post?u=XXXXXXXXXXXXX\u0026amp;id=XXXXXX\n```\n\nWe will use this URL to configure the component, by adding it to the action prop of the component.\n\n```js\nimport React, { Component } from \"react\"\n// import the component\nimport Mailchimp from \"react-mailchimp-form\"\n\nclass App extends Component {\n  render() {\n    return (\n      \u003cMailchimp\n        action=\"https://\u003cYOUR-USER\u003e.us16.list-manage.com/subscribe/post?u=XXXXXXXXXXXXX\u0026amp;id=XXXXXX\"\n        fields={[\n          {\n            name: \"EMAIL\",\n            placeholder: \"Email\",\n            type: \"email\",\n            required: true,\n          },\n        ]}\n      /\u003e\n    )\n  }\n}\n\nexport default App\n```\n\n# Options\n\n### Multiple fields\n\nYou can add all the fields you need for your Mailchimp form, just remember you have to configure them on \"Settings \u003e List Fields\"\n\n### Messages\n\nPersonalize or change the message language by default\n\n### ClassName\n\nAdd a personalized class to personalize your form\n\n```js\n\u003cMailchimp\n  action=\"https://\u003cYOUR-USER\u003e.us16.list-manage.com/subscribe/post?u=XXXXXXXXXXXXX\u0026amp;id=XXXXXX\"\n  //Adding multiple fields:\n  fields={[\n    {\n      name: \"EMAIL\",\n      placeholder: \"Email\",\n      type: \"email\",\n      required: true,\n    },\n    {\n      name: \"FNAME\",\n      placeholder: \"name\",\n      type: \"text\",\n      required: true,\n    },\n  ]}\n  // Change predetermined language\n  messages={{\n    sending: \"Sending...\",\n    success: \"Thank you for subscribing!\",\n    error: \"An unexpected internal error has occurred.\",\n    empty: \"You must write an e-mail.\",\n    duplicate: \"Too many subscribe attempts for this email address\",\n    button: \"Subscribe!\",\n  }}\n  // Add a personalized class\n  className=\"\u003cYOUR_CLASSNAME\u003e\"\n/\u003e\n```\n\n# Demo\n\nCheck here: [react-mailchimp-form](https://arepa-dev.github.io/reactMailchimp/)\n\n# Contributing\n\nIf someone wants to add or improve something, I invite you to collaborate directly in this repository: [react-mailchimp-form](https://github.com/gndx/react-mailchimp-form/)\n\n# License\n\nReact-mailchimp-form is released under the [MIT License](https://opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgndx%2Freact-mailchimp-form","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgndx%2Freact-mailchimp-form","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgndx%2Freact-mailchimp-form/lists"}