<div class="embed-responsive embed-responsive-16by9 {{self.settings.custom_css_class}}"
{% if self.settings.custom_id %}id="{{self.settings.custom_id}}"{% endif %}>
  {% if self.place_id %}
  <iframe class="embed-responsive-item" width="100%" style="border:0" src="https://www.google.com/maps/embed/v1/place?q=place_id:{{ self.place_id }}&zoom={{ self.map_zoom_level }}&key={{ settings.coderedcms.GoogleApiSettings.google_maps_api_key}}" title="{{self.map_title}}" allowfullscreen></iframe>
  {% else %}
  <iframe class="embed-responsive-item" width="100%" style="border:0" src="https://maps.google.com/maps?q={{ self.search|urlencode }}&output=embed" title="{{self.map_title}}" allowfullscreen></iframe>
  {% endif %}
</div>
