Widgets personalizados
Esta etiqueta ha sido reemplazada por una etiqueta de módulo personalizada.
Sígueme
Los módulos Sígueme representan iconos que enlazan a tus diferentes perfiles de redes sociales. Los iconos que se muestran se basan en tu configuración de redes sociales.Esta etiqueta es reemplazada por el nuevo módulo predeterminado Sígueme.
{% follow_me "follow_me" %}
{% follow_me "follow_us" title='Follow Us', module_title_tag="h2" %}
<span id="hs_cos_wrapper_module_14162805806361260" class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_follow_me" style="" data-hs-cos-general-type="widget" data-hs-cos-type="follow_me">
<h2>Follow Us</h2>
<div style="">
<a target="_blank" class="fm_button fm_googleplus" href=""><span title="Follow us on Google+"></span></a>
<a target="_blank" class="fm_button fm_facebook" href=""><span title="Follow us on Facebook"></span></a>
<a target="_blank" class="fm_button fm_twitter" href=""><span title="Follow us on Twitter"></span>
</div>
</span>
Widget global
Un widget global es uno que se puede compartir a través de la plantillaLa etiqueta ha sido reemplazada por la etiqueta de módulo personalizada.
{% global_widget "facebook_fan_box" overrideable=False, label='Facebook Fan Box' %}"
Búsqueda en Google
La etiqueta Búsqueda de Google y los módulos ya no están disponibles. Esto ha sido reemplazado por la propia búsqueda nativa de HubSpot.
Control deslizante de imágenes
Genera un módulo de control deslizante de imágenes de HubSpot. Este módulo de control deslizante se basa en FlexSlider. Mientras que puedes crear un módulo de control deslizante con la sintaxis estándar de HubL, si quieres predefinir diapositivas predeterminadas usando HubL, debes usar la sintaxis de bloque. A continuación se muestran ambos métodos.Esta etiqueta ha quedado obsoleta a favor de la etiqueta Galería.
{% image_slider "image_slider" %}
<-- Block syntax -->
{% widget_block image_slider "crm_slider" sizing='static', only_thumbnails=False, transition='slide', caption_position='below', with_thumbnail_nav=False, lightbox=False, auto_advance=True, overrideable=True, description_text='', show_pagination=True, label='Image Slider', loop_slides=True, num_seconds=5 %}
{% widget_attribute "slides" is_json=True %}[{"caption": "CRM Contacts App", "show_caption": true, "link_url": "http://www.hubspot.com/crm", "alt_text": "Screenshot of CRM Contacts", "img_src": "http://go.hubspot.com/hubfs/Contacts-View-1.png?t=1430860504240", "open_in_new_tab": true}, {"caption": "HubSpot CRM Contact Profile", "show_caption": true, "link_url": "http://www.hubspot.com/", "alt_text": "HubSpot CRM Contact Profile", "img_src": "http://cdn2.hubspot.net/hubfs/53/Contact-Profile.png?t=1430860504240", "open_in_new_tab": true}]{% end_widget_attribute %}
{% end_widget_block %}
<span
id="hs_cos_wrapper_crm_slider"
class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_image_slider"
style=""
data-hs-cos-general-type="widget"
data-hs-cos-type="image_slider"
>
<div
id="hs_cos_flex_slider_crm_slider"
class="hs_cos_flex-slider flex-slider-main slider-mode-slider"
>
<div
class="hs_cos_flex-viewport"
style="overflow: hidden; position: relative;"
>
<ul
class="hs_cos_flex-slides hs_cos_flex-slides-main "
style="width: 800%; -webkit-transition-duration: 0s; transition-duration: 0s; -webkit-transform: translate3d(-1090px, 0px, 0px);"
>
<li
class="hs_cos_flex-slide-main clone"
aria-hidden="true"
style="width: 1090px; float: left; display: block;"
>
<a href="//www.hubspot.com/" target="_blank"
><img
src="//cdn2.hubspot.net/hubfs/53/Contact-Profile.png?t=1430860504240&t=1430335520686"
alt="HubSpot CRM Contact Profile"
draggable="false"
/></a>
<div class="caption">HubSpot CRM Contact Profile</div>
</li>
<li
class="hs_cos_flex-slide-main hs_cos_flex-active-slide"
style="width: 1090px; float: left; display: block;"
>
<a href="//www.hubspot.com/crm" target="_blank"
><img
src="http://go.hubspot.com/hubfs/Contacts-View-1.png?t=1430860504240&t=1430335520686"
alt="Screenshot of CRM Contacts"
draggable="false"
/></a>
<div class="caption">CRM Contacts App</div>
</li>
<li
class="hs_cos_flex-slide-main"
style="width: 1090px; float: left; display: block;"
>
<a href="//www.hubspot.com/" target="_blank"
><img
src="//cdn2.hubspot.net/hubfs/53/Contact-Profile.png?t=1430860504240&t=1430335520686"
alt="HubSpot CRM Contact Profile"
draggable="false"
/></a>
<div class="caption">HubSpot CRM Contact Profile</div>
</li>
<li
class="hs_cos_flex-slide-main clone"
aria-hidden="true"
style="width: 1090px; float: left; display: block;"
>
<a href="//www.hubspot.com/crm" target="_blank"
><img
src="http://go.hubspot.com/hubfs/Contacts-View-1.png?t=1430860504240&t=1430335520686"
alt="Screenshot of CRM Contacts"
draggable="false"
/></a>
<div class="caption">CRM Contacts App</div>
</li>
</ul>
</div>
<ol class="hs_cos_flex-control-nav hs_cos_flex-control-paging">
<li><a class="hs_cos_flex-active">1</a></li>
<li><a class="">2</a></li>
</ol>
<ul class="hs_cos_flex-direction-nav">
<li><a class="hs_cos_flex-prev" href="#">Previous</a></li>
<li><a class="hs_cos_flex-next" href="#">Next</a></li>
</ul>
</div>
<script>
window.hsSliderConfig = window.hsSliderConfig || {};
window.hsSliderConfig['crm_slider'] = {
mode: 'slider',
mainConfig: {
animationLoop: true,
direction: 'horizontal',
slideshowSpeed: 5000.0,
controlNav: true,
smoothHeight: false,
namespace: 'hs_cos_flex-',
slideshow: true,
selector: '.hs_cos_flex-slides > li',
animation: 'slide',
},
};
</script>
</span>
| Parámetro | Tipo | Descripción | Predeterminado |
|---|---|---|---|
sizing | Enumeración | Determina si el deslizador cambia de tamaño en función de la altura de las diapositivas. Los valores posibles son: “estático” o “redimensionado” | "static" |
only_thumbnails | Booleano | Mostrar imágenes como miniaturas en lugar de un control deslizante. | False |
transition | Enumeración | Define el tipo de transición de las diapositivas. Los valores posibles son: “fade” o “slide” | "slide" |
caption_position | Enumeración | Afecta a la posición de los subtítulos en o debajo de la diapositiva. Los valores posibles son “below” o “superimpose” | "below" |
with_thumbnail_nav | Booleano | Incluir miniaturas debajo del control deslizante para la navegación (only_thumbnails debe ser falso para que esto sea verdadero) | False |
lightbox | Booleano | Muestra la imagen en miniatura en el lightbox cuando se hace clic (with_thumbnail_nav debe ser verdadero para que esto sea verdadero) | False |
auto_advance | Booleano | Avanza automáticamente las diapositivas después del tiempo establecido en num_seconds | False |
show_pagination | Booleano | Proporcionar botones debajo del control deslizante para navegar entre las diapositivas. | True |
label | Cadena | Una etiqueta para este módulo, visible solo en el editor | "Image Slider" |
loop_slides | Booleano | Cuando es verdadero, muestra las diapositivas en un bucle continuo | True |
num_seconds | Número | Tiempo en segundos de pausa entre diapositivas | 5 |
slides | JSON | Una lista JSON con el título predeterminado, la URL del enlace, el texto alt, el src de la imagen y si se abre en una nueva pestaña. Consulta la sintaxis del bloque anterior. |