Adding coded HubL fields to v2 custom module

Highlighted
Top Contributor | Platinum Partner

I'm creating a tagging module for landing pages since we can't currently apply tags to them by default, just to blog posts.

I'm using the new design manager, and have created a custom module. Rather than use the helper tools on the right, I need to code the 'choice' module as it is fetching data from a HubDB table. Here's the code:

 

{% set table = hubdb_table_rows(679981) %}

{% set names = table|map(attribute='name') %}

{% set choices = names|join(', ') %}

{% choice "content_type_tag" label="Content Type" choices="{{ choices }}" %}

 

Printing 

{{ names|join(', ') }}

gives a comma separated list, as the choice module expects, and the code validates.

However, when I preview the module I get "This module does not have any editable options.". In fact, even adding HubL for a simple text field doesn't show any editable field in the editor.

 

Found some info here:

 

"In addition to the standard fields, custom modules also support all other HubL statements and expressions. Using HubL greatly expands the potential of what you can do with custom modules. For example, you could add CTAs, forms, menus, etc. to a reusable custom module. However, please note that modules defined within a custom module will not render as part of the custom module in the content editor."

 

Not sure that makes any sense - if they don't render, what's the point?

Also more info here:

 

"While these modules support all HubL, HubL modules defined in a custom module will render in the Edit Modules pane of the editor, rather than within the custom module's options in the content editor."

Again, I can't make sense of that. Nowhere when editing the page is there the editable choice field, it's there it just can't be edited.

 

Appreciate if somebody from HubSpot could clarify this for me please. I'd really like to avoid having to reuse the same code over and over again directly in page templates.

7 Replies 7
Highlighted
HubSpot Product Team

Hey @Craig if you are working on a preview/live page - can you share the link for further context?

@stefen@Gonzalo@dessery have you worked on a similar goal before with Hubl?

0 Upvotes
Highlighted
Top Contributor | Diamond Partner

Hey @Craig,


Your code is almost right 🙂

Think that the names are string so you need to wrap them with a quote (single or double).

This is the line you need to modify:

{% set choices = '"' ~ names|join('", "') ~ '"' %}

What it does is:

- add first a double quote for the first option

- add the separator double quote comma double quote: ", "

- add double quote for the last option

 

That should work to pass the options like:
"option1", "option2"

 

Regards,

Gonzalo

0 Upvotes
Highlighted
Top Contributor | Platinum Partner

@Gonzalo Hi thanks for the response. I will try this - though HubL choice field actually expects a single string of comma separated values, not invididual strings.

 

Anyway, I'm more concerned about why this field will not show up when the user edits the page - as I mentioned even a simple text field doesn't - you load the module preview or place it in a page and edit the page and it just says

'This module does not have any editable options'

0 Upvotes
Highlighted
Top Contributor | Diamond Partner

Hey Craig,


I am sorry I did not mention about that issue (I didn't had too much time 😛 ).

I think that had to be related to the wrong format for the options in the selector. Did you tried the fix? I think that should display now the choice selector because this is populated now. You have two options for choice fields, a list of options like:
[ ["option1", "Option 1", ["option2", "Option 2"] ]
or
"option1", "option2"
As you said it expect one string, but remember that as you are using not a  simple value but an string you need to wrap that also on quotes 😉
In this case:
' "option 1", "option 2" '
(if you want to use only the same quote -single or double- you need to sanitize then /" )
Give a try I get it running on my side.


If you have tried the text field at the same time as choice selector maybe that was generating the issue for this too.


By the way, are you using the new IDE or the v1? (if this didn't work we will probably need this information to check what is going on)

0 Upvotes
Highlighted
Top Contributor | Platinum Partner

@Gonzalo - HubL choice field can take the following:

 

"Option 1, Option 2, Option 3". See docs.

 

The code I have used works - I have used it directly in a template. It's the fact that it's in a custom module that is the problem. As I said, even a simple text field does not show up as editable when coded into a custom module.

 

I'm using v2.

 

Thanks

0 Upvotes
Highlighted
Top Contributor | Diamond Partner

Oh okay, sorry. I am following you now.

If you are using V2, there is no way to add manually fields to be editable, all of them will NOT be overrideable:

Modules are allowed to contain supported HubL tags which render static versions of modules. However, the overrideable attribute is always considered False, even if specified as True in a module, as sub-modules generated by tags will not be editable in the content editors.

The only solution I can think for you here is move the choice field to the template level.  You can add it in the HTML wrapper of the CM for example. Usually when I need to do something like that I usually create a macro and then load the coded file and run the macro (specially if you need to use more than once or you think you maybe need to edit in the future).

 

Then in the CM you can call the widget_data to get the value for that custom field.

 

Good luck!

Highlighted
Top Contributor | Platinum Partner

Thanks @Gonzalo I wasn't aware of this page.

 

Not sure why you can create editable modules with the builder on the right but using HubL code you can't, but at least I now know there's a reason they aren't showing.

 

I'll just stick it in a partial.

 

Thanks

 

Craig