En este vídeo veremos como ocultar o mostrar la sidebar de WordPress usando un botón, además veremos como eliminar la línea que divide la sidebar del contenido principal en WordPress.
Código 1
@media only screen and (min-width: 981px) {
/* Sidebar expand / collapse button */
#db_hide_sidebar {
z-index: 10000;
padding: 10px;
cursor: pointer;
}
.db_right_sidebar_collapsible #db_hide_sidebar {
right: 0;
}
.db_left_sidebar_collapsible #db_hide_sidebar {
left: 0;
}
.et_fixed_nav #db_hide_sidebar {
position: fixed;
}
.et_non_fixed_nav #db_hide_sidebar {
position: absolute;
}
#db_hide_sidebar:before {
font-family: 'ETModules';
font-size: 24px;
}
.et_right_sidebar #db_hide_sidebar:before,
.db_left_sidebar_collapsible.et_full_width_page #db_hide_sidebar:before {
content: '\39';
}
.db_right_sidebar_collapsible.et_full_width_page #db_hide_sidebar:before,
.et_left_sidebar #db_hide_sidebar:before {
content: '\38';
}
/* Ensure fullwidth formatting matches sidebar formatting */
.db_sidebar_collapsible.et_full_width_page .et_post_meta_wrapper:first-child {
padding-top: 58px !important;
}
}
</style>
<script>
jQuery(function($){
if($('#sidebar').length) {
if ($('body.et_right_sidebar').length) {
$('body').addClass('db_sidebar_collapsible db_right_sidebar_collapsible');
$('#main-content').prepend(
$('<span id="db_hide_sidebar" title="Toggle Sidebar"></span>').click(function(){
$('body').toggleClass('et_right_sidebar et_full_width_page');
$('#sidebar').toggle();
})
);
$('body').addClass('db_collapsible_sidebar');
} else if ($('body.et_left_sidebar').length) {
$('body').addClass('db_sidebar_collapsible db_left_sidebar_collapsible');
$('#main-content').prepend(
$('<span id="db_hide_sidebar" title="Toggle Sidebar"></span>').click(function(){
$('body').toggleClass('et_left_sidebar et_full_width_page');
$('#sidebar').toggle();
})
);
}
}
});
</script>
Código 2
#main-content .container:before {background: none;}
*** ¿¿AUN NO TIENES DIVI??*** ►►DESCUENTOS: -10 % y -20% plantilla DIVI aquí: https://www.davidibiza.com/descuento-… – 20% DE DESCUENTO EN EL PLAN DE DESARROLLADOR (PAGO ANUAL): https://www.elegantthemes.com/affilia… – 10% DE DESCUENTO EN EL PLAN LIFETIME (PAGO ÚNICO): https://www.elegantthemes.com/affilia… ►►Accede a todos mis cursos con soporte para dudas así como a este plugin en mi Zona Premium: https://www.davidibiza.com/planes/