None Required. Included in Core
None Required. Included in Core
Copy
<!-- Required .admin-panels wrapper-->
<div class="admin-panels">
<!-- Create Row -->
<div class="row">
<!-- Create Column with required .admin-grid class -->
<div class="col-md-6 admin-grid">
<!-- Create Panel with required unique ID -->
<div class="panel" id="p1">
<div class="panel-heading">
<span class="panel-title"> Panel 1</span>
</div>
<div class="panel-body">
</div>
</div>
<!-- Create Panel with required unique ID -->
<div class="panel" id="p2">
<div class="panel-heading">
<span class="panel-title"> Panel 2</span>
</div>
<div class="panel-body">
</div>
</div>
</div>
<!-- End Column -->
<!-- Create Column with required .admin-grid class -->
<div class="col-md-6 admin-grid">
<!-- Create Panel with required unique ID -->
<div class="panel" id="p3">
<div class="panel-heading">
<span class="panel-title"> Panel 3</span>
</div>
<div class="panel-body">
</div>
</div>
<!-- Create Panel with required unique ID -->
<div class="panel" id="p4">
<div class="panel-heading">
<span class="panel-title"> Panel 4</span>
</div>
<div class="panel-body">
</div>
</div>
</div>
<!-- End Column -->
</div>
<!-- End Row -->
</div>
<!-- End .admin-panels Wrapper -->
Copy
// Init AdminPanels on columns inside the ".admin-panels" container
$('.admin-panels').adminpanel({
grid: '.admin-grid',
draggable: true,
// On AdminPanel Init complete we fade in the content. Optional
onFinish: function() {
$('.admin-panels').addClass('animated fadeIn').removeClass('fade-onload');
},
// We trigger a window resize after a panel has been modified. This helps catch
// any plugins which may need to update after the panel was changed. Optional
onSave: function() {
$(window).trigger('resize');
}
});