CMS Development

WEDIA
Membro | Parceiro Ouro
Membro | Parceiro Ouro

Call with Hubl custom module to another template

Hello all,

 

My issue here is that I'm creating a custom module with and img tag inside and using it on the Article template.

 

{% if module.vertical_image_field.src %}
	<img src="{{ module.vertical_image_field.src }}" alt="{{ module.vertical_image_field.alt }}" width="{{ module.vertical_image_field.width }}" height="{{ module.vertical_image_field.height }}">
{% endif %}
<p>I am a custom module</p>

 

I want to call my custom module to the blog_listing template but module doesn't print.

 

I am using this code on my listing template

{{ content.widgets.vertical_image_field.src   }}

 

Any ideas or small example of how to use custommodule inside other template with code is appreceiated.

 

0 Avaliação positiva
10 Respostas 10
tjoyce
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Call with Hubl custom module to another template

try inspecting the data in allWidgets, to see if what you're looking for is in there

{{content.allWidgets|pprint}}
0 Avaliação positiva
dennisedson
Equipe de Produto da HubSpot
Equipe de Produto da HubSpot

Call with Hubl custom module to another template

that is some of that fancy hubspot wizard stuff @tjoyce pulls out of his hat 🙂

i didnt know allWidgets was a thing

WEDIA
Membro | Parceiro Ouro
Membro | Parceiro Ouro

Call with Hubl custom module to another template

Any of these solves my problem. Any ideas?

 

bump!

0 Avaliação positiva
WEDIA
Membro | Parceiro Ouro
Membro | Parceiro Ouro

Call with Hubl custom module to another template

Ι used the provided code but it prints nothing. I get a huge space.

 

space.JPGcode.JPG

0 Avaliação positiva
tjoyce
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Call with Hubl custom module to another template

@WEDIA - I'm confused by your first screenshot. Why is there html rendering in the rendered view? Or, are you screenshotting your code view? The pprint should appear in the preview of your page, not in the code editor. If you still don't see anything in allWidgets, try just doing {{content|pprint}}, it's a great way to debug and figure out the right way to traverse the content dictionary.

0 Avaliação positiva
WEDIA
Membro | Parceiro Ouro
Membro | Parceiro Ouro

Call with Hubl custom module to another template

The previews screenshot comes from the module's code. I used

 {{ content|pprint }}

and this module is not printed because it's not drag n' droped on my Blog Listing page. This module is drag n dropped on the Article Page which is printed (adds a new vertical image for the article).

 

module.JPG

 

I need to get this module with code to work on my Blog Listing Page for every article i print there.

 

When i use on the listing template

 

{{ content.widgets.allWidgets|pprint }}

I get null

0 Avaliação positiva
tjoyce
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Call with Hubl custom module to another template

not content.widgets.allWidgets... it should be content.allWidgets

0 Avaliação positiva
WEDIA
Membro | Parceiro Ouro
Membro | Parceiro Ouro

Call with Hubl custom module to another template

Ok this worked. I got the custom module.

 

vertical_image_code.JPG

 

How can i now just get the image source?

0 Avaliação positiva
tjoyce
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Call with Hubl custom module to another template

I can't test this code right now but, it would be something like this:

 

{% for w in content.allWidgets %}
  {% if w.label == "Vertical Image and more" %}
    //try {{w.pprint}} if w.body.src doesn't work... you might need to adjust the way you're calling src 
    {{w.body.src}}
  {% endif %}
{% endfor %}
0 Avaliação positiva
WEDIA
Membro | Parceiro Ouro
Membro | Parceiro Ouro

Call with Hubl custom module to another template

I tried all these below but i get empty html.

 

<div>{% module "module_1540413242653377" module_id="4162689" label="Vertical Image and more" %}</div>
{% for w in content.allWidgets %}
    {% if w.label == "Vertical Image and more" %}
        <div class="print">{{w.pprint}}</div>
        <div class="vertical-image">{{w.vertical_image_field.src}}</div>
    {% endif %}
{% endfor %}
0 Avaliação positiva