Usar Toolset Views y modal de Bootstrap para mostrar contenido

Bootstrap, Toolset
// this part displays the trigger for the modal
<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".xmit-modal-sm-[wpv-post-id]">
<a href="[wpv-post-url]" class="btn btn-info" data-toggle="modal" data-target="#[wpv-post-id]"><div class="imageclass"><img src="[wpv-post-featured-image output="url" size="medium"]" /></div><h4>[wpv-post-title]</h4></a>
</button>

// this is what appears in the modal
<div class="modal fade xmit-modal-sm-[wpv-post-id]" tabindex="-1" role="dialog" aria-labelledby="[wpv-post-title]" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
			  // can be any HTML content
        </div>
    </div>
</div>

Visto en https://gist.github.com/davekuhar/648266b99953828c252778581ce3e7cc

Usar Toolset Views y modal de Bootstrap para mostrar contenido Leer más »

Espaciado Bootstrap con h-100

Bootstrap
<div class="container">
  <div class="row">
    <div class="col-md-4 col-sm-6 mb-4">
      <div class="card h-100" style="background-color:#ff0000;">
        Test card content. 
      </div>
    </div>
    <div class="col-md-4 col-sm-6 mb-4">
      <div class="card h-100" style="background-color:#00ff00;">
        Test card content. Test card content. Test card content. Test card content. 
      </div>
    </div>
    <div class="col-md-4 col-sm-6 mb-4">
      <div class="card h-100" style="background-color:#0000ff;">
        Test card content. Test card content. Test card content. Test card content. Test card content. Test card content. Test card content. Test card content. 
      </div>
    </div>
    <div class="col-md-4 col-sm-6 mb-4">
      <div class="card h-100" style="background-color:#0f0f0f;">
        Test card content. 
      </div>
    </div>
  </div>
</div>

La solución vista en Stackoverflow.

Espaciado Bootstrap con h-100 Leer más »

Libreria Select 2 en Toolset

Toolset

Llamamos a la librería Select 2

function enqueue_select2_jquery() {
    wp_register_style( 'select2css', '/wp-content/themes/tastal/js/select2.min.css', false, '1.0', 'all' );
    wp_register_script( 'select2', '/wp-content/themes/tastal/js/select2.min.js', array( 'jquery' ), '1.0', true );
    wp_enqueue_style( 'select2css' );
    wp_enqueue_script( 'select2' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_select2_jquery' );

En el apartado donde está la búsqueda personalizada (Search and Pagination) nos vamos al editor JS

jQuery( document ).ready(function() {
    jQuery('.select').select2();
});

Luego en el filtro ponemos la clase select y el estilo select2 y listos.

Ya tenemos funcionando el desplegable de la búsqueda personalizada con la librería select2

Libreria Select 2 en Toolset Leer más »

Deactivate submit button in Toolset custom search

Toolset

Submit button deactivated when custom search is loaded

jQuery( document ).ready( function() {
    /**
    * data.view_unique_id (string) The View unique ID hash
    * data.form (object) The jQuery object for the View form
    * data.update_form (bool) Whether the custom search form will be updated
    * data.update_results (bool) Whether the custom search results will be updated
    */
   var $ = jQuery;
    $('input[type="submit"]').prop('disabled', true);    
});

Activate the button

jQuery( document ).on( 'js_event_wpv_parametric_search_triggered', function( event, data ) {
    /**
    * data.view_unique_id (string) The View unique ID hash
    * data.form (object) The jQuery object for the View form
    * data.update_form (bool) Whether the custom search form will be updated
    * data.update_results (bool) Whether the custom search results will be updated
    */
   var $ = jQuery;
    $('input[type="submit"]').prop('disabled', true);
});

Deactivate submit button in Toolset custom search Leer más »

Scroll al inicio