How to markup adress card to map with repeater field.
Hi @MHussain8, I hope that you are well!
Thanks for reaching out to the Community!
I am not sure to understand what you are looking for, could you please give more details please?
The more info, screenshots (without sensitive/confidential information), and details you can provide, the better the Community can assist.
I’d like to invite a couple of subject matter experts to this conversation: Hi @LaurenRyan, @mangelet and @Josh do you have tips to help @MHussain8, please?
Also, if anybody else has anything to add and/or share, please feel free to join in the conversation ![]()
Thanks a lot for your help
and have a great day!
Best,
Bérangère
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d14160407.488009982!2d58.3559282380058!3d29.946917979856096!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x38db52d2f8fd751f%3A0x46b7a1f7e614925c!2sPakistan!5e0!3m2!1sen!2s!4v1700235148453!5m2!1sen!2s" width="980" height="535" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
<!-- Start card -->
<div class="location">
<h1>Address card</h1>
</div>
{% for item in module.field_group %}
<div id="address-card" style="background-color:{{ item.color_field.color }}; border-color:{{ item.color_field.color }};">
<div class="card-header">
<h3 id="card-title">{% inline_text field="name_field" value="{{ item.name_field }}" %}</h3>
</div>
<div class="card-body" style="padding-top:1px;">
<p id="card-text-address" style="color:{{ item.color_field.color }};">Address:</p>
<h4>{% inline_text field="address_field" value="{{ item.address_field }}"%}</h4>
<p class="card-text-phone" style="color:{{ item.color_field.color }};">Phone:</p>
<h4>{% inline_text field="phone_number_field" value="{{ item.phone_number_field }}"%}</h4>
</div>
</div>
{% endfor%}
My task:
Automatic generation of address markup based on the information provided in the address cards.
The map’s markup name should be derived from the heading of the address card.
…
Now, I have shown the map and the address card has also been created. Now the address card configuration is automatically uploaded to the map. All that’s left is what needs help.