Copy fields from one module to another

Developer Support CMS Development
1

Hi

Is it possible to copy a group of fields from one modue to another?

I’m aware you can clone modules, but I would like to be able to copy over a complicated set of fields that I’ve created in one module to a number of exisiting ones.

Alternatively is there a way of having some kind of global include that can be shared amongst modules?

Thanks!

2

@DM2 - There may be cleverer options, but I’d suggest use of the CLI tools features:

- fetch the module with the complicated fields setup to your local evironment

- copy the meta data files from this module to your new module

- upload the new module and all the field options will be replicated.

Hope this is helpful.

Steve

3

Here’s what I always do:

  1. Navigate to the Module:

    • Log in to your HubSpot account.
    • Go to the module where you want to copy the fields from. For contacts, it would be the “Contacts” module.

  2. Select Records:

    • Choose the records that contain the fields you want to copy. This could be a single record or a list of records.

  3. View and Edit Record:

    • Open the record you want to copy from.
    • In the record view, find and click on the “Edit” or “Edit properties” option.

  4. Copy Field Values:

    • Locate the fields you want to copy.
    • Highlight the content of the field and copy it (Ctrl+C or Command+C).

  5. Navigate to the Target Module:

    • Go to the module where you want to paste these fields. If it’s another contact record, go to that contact record.

  6. Edit Record:

    • Open the record where you want to paste the copied fields.

  7. Paste Field Values:

    • Find the corresponding fields in the target record.
    • Paste the copied values into the respective fields (Ctrl+V or Command+V).

  8. Save Changes:

    • Save the changes to the record.
      A bonus tip is to always keep reading tech-related blogs to stay updated.
4

In theory, could this cause issues due to having identical id’s across modules in their fields.json files?

5

Not sure since there is a relationship with the module. Does the pair
create a unique instance, or is it strictly by field ID?.
Either way, it would definitely make sense to generate new IDs when it’s
copied over.

6

Hi @SamDuckett, and thanks so much @jaymewelch for your contribution on the HubSpot Community!
So, field IDs in fields.json are generally unique UUIDs that identify each field within a module.
When you copy a module’s metadata files and upload them as a new module, HubSpot will recognize it as a separate module with its own field instances.

For best results and to prevent any conflicts, it’s a good idea to generate new IDs for your copied fields. You can do this by:

- Manually updating the id values in your copied fields.json, or
- Using the CLI’s hs create module command to set up a fresh module structure, then bringing in your field configurations (without reusing the old IDs).
Field IDs are UUIDs (for example, “id”: “357bacfa-2bb8-e996-4589-f55e10d4f1d4”), and each one should be unique.
Here are some resources for reference:
- Module and theme fields
- Module and Theme Fields Overview
- Write module and theme fields using JavaScript
This approach will help keep your modules organized and running smoothly!
Bérangère
This post was created with the assistance of AI tools

7

Hey @DM2

So there is no “quick” way to do this but there are options!

First if you’re looking for a global implemetation of custom property selections from a module that can be used throughout a page or theme, you can use my favorite HS property “export_to_template_context”.

This property is added to module expression when coding it into a template:

{% module "job_title" path="@hubspot/text", label="Enter a Job Title", value="Chief Morale Officer", export_to_template_context=True %}

You can then use the properties exported from the module by name like:

{{ widget_data.job_title.body.value }}

Second (as @SteveHTM has mentioned) you could use the “copy JSON” option from the module and paste it into another when developing locally:

When in the design manager, click Actions > Copy JSON. This code can now be pasted into a module’s fields.json config file using a coded editor like VSCode. This JSON is also availble from the original module’s fields.json files as well.

[
 {
 "default": {
 "form_id": "7b4fc5b2-1d4a-4a0a-8319-xxxxxxxxxxxxx",
 "response_type": "inline",
 "message": "Thanks for submitting the form.",
 "gotowebinar_webinar_key": null,
 "form_type": "HUBSPOT"
 },
 "display_width": null,
 "id": "form",
 "label": "Form",
 "locked": false,
 "name": "form",
 "required": false,
 "type": "form"
 }
]

Third you can always clone the module!

In the deisgn manager, right click the module and select “Clone module”

KevinC_0-1702227295523.png
KevinC_0-1702227295523.png420×166 16.8 KB

There is so much that one can do with just these 2 implementation!

If you have any question I can help answer please don’t hesitate to reach out!

Best

8

Thanks, the copying json and re-uploading via the cli worked best for me!

9

It would be ideal if there was a way to copy/paste the JSON from one module to another in the HubSpot Design Manager. I like to have a consistent set of style settings across each module within a theme. Having to hand code them in for every module or use an external IDE is tedious.