diff --git a/bl-kernel/admin/themes/koblog/css/koblog.bootstrap.css b/bl-kernel/admin/themes/koblog/css/koblog.bootstrap.css
index 1b15cd23..b6246e7b 100644
--- a/bl-kernel/admin/themes/koblog/css/koblog.bootstrap.css
+++ b/bl-kernel/admin/themes/koblog/css/koblog.bootstrap.css
@@ -118,7 +118,8 @@ tr.card-tablebody:not(:last-child) {
   box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.15);
 }
 
-#main-area a.nav-link:not(.active):hover {
+#main-area a.nav-link:not(.active):hover,
+#main-area button.nav-link:not(.active):hover {
   background-color: rgba(0,0,0,0.1)!important;
 }
 
diff --git a/bl-kernel/admin/themes/koblog/html/media.php b/bl-kernel/admin/themes/koblog/html/media.php
index 3c53a992..bcb382fe 100644
--- a/bl-kernel/admin/themes/koblog/html/media.php
+++ b/bl-kernel/admin/themes/koblog/html/media.php
@@ -107,9 +107,9 @@ function displayFiles(files, numberOfPages = <?= $numberOfPages ?>) {
 					'<td class="information">'+
 						'<div class="text-secondary pb-2">'+filename+'<\/div>'+
 						'<div>'+
-							'<a href="#" class="mr-3 text-primary" onClick="editorInsertMedia(\''+image+'\'); closeMediaManager();"><i class="fa fa-plus-circle"></i><?php $L->p('Insert') ?><\/a>'+
-							'<a href="#" class="mr-3 text-primary" onClick="editorInsertMedia(\''+thumbnail+'\'); closeMediaManager();"><i class="fa fa-image"></i><?php $L->p('Insert thumbnail') ?><\/a>'+
-							'<a href="#" class="mr-3 text-primary" onClick="editorInsertLinkedMedia(\''+thumbnail+'\',\''+image+'\'); closeMediaManager();"><i class="fa fa-link"></i><?php $L->p('Insert linked thumbnail') ?><\/a>'+
+							'<a href="#" class="me-3 text-primary" onClick="editorInsertMedia(\''+image+'\'); closeMediaManager();"><i class="fa fa-plus-circle"></i><?php $L->p('Insert') ?><\/a>'+
+							'<a href="#" class="me-3 text-primary" onClick="editorInsertMedia(\''+thumbnail+'\'); closeMediaManager();"><i class="fa fa-image"></i><?php $L->p('Insert thumbnail') ?><\/a>'+
+							'<a href="#" class="me-3 text-primary" onClick="editorInsertLinkedMedia(\''+thumbnail+'\',\''+image+'\'); closeMediaManager();"><i class="fa fa-link"></i><?php $L->p('Insert linked thumbnail') ?><\/a>'+
 							'<a href="#" class="text-primary" onClick="setCoverImage(\''+filename+'\'); closeMediaManager();"><i class="fa fa-desktop"></i><?php $L->p('Set as cover image') ?><\/button>'+
 							'<a href="#" class="float-right text-danger" onClick="deleteMedia(\''+filename+'\')"><i class="fa fa-trash-o"></i><?php $L->p('Delete') ?><\/a>'+
 						'<\/div>'+
diff --git a/bl-kernel/admin/themes/koblog/init.php b/bl-kernel/admin/themes/koblog/init.php
index 8501cc14..720f0249 100644
--- a/bl-kernel/admin/themes/koblog/init.php
+++ b/bl-kernel/admin/themes/koblog/init.php
@@ -37,7 +37,7 @@ EOF;
 
 	public static function cardBegin($title) {
 		return <<<EOF
-<div class="card">
+<div class="card mb-3">
 	<h6 class="card-header">$title</h6>
 		<div class="card-body">
 EOF;
@@ -112,8 +112,9 @@ EOF;
 	public static function formTitle($args)
 	{
 		$title = $args['title'];
+		$mt = $args['mt'] ?? 'mt-2';
 		return <<<EOF
-<h6 class="mt-4 mb-2 pb-2 border-bottom text-uppercase">$title</h6>
+<h6 class="$mt mb-0 pb-1 text-uppercase">$title</h6>
 EOF;
 	}
 
@@ -139,7 +140,8 @@ EOF;
 			$class = $args['class'];
 		}
 
-		$labelClass = 'mt-4 mb-2 pb-2 border-bottom text-uppercase w-100';
+		$mt = $args['mt'] ?? 'mt-2';
+		$labelClass = $mt.' mb-0 pb-1 text-uppercase w-100';
 		if (isset($args['labelClass'])) {
 			$labelClass = $args['labelClass'];
 		}
@@ -226,7 +228,8 @@ EOF;
 
 		$html = '<div class="form-group m-0  mb-2">';
 		if (!empty($args['label'])) {
-			$html .= '<label class="mt-4 mb-2 pb-2 border-bottom text-uppercase w-100" for="' . $id . '">' . $args['label'] . '</label>';
+			$mt = $args['mt'] ?? 'mt-2';
+			$html .= '<label class="'.$mt.' mb-0 pb-1 text-uppercase w-100" for="' . $id . '">' . $args['label'] . '</label>';
 		}
 
 		$html .= '<textarea class="' . $class . '" id="' . $id . '" name="' . $args['name'] . '" rows="' . $args['rows'] . '" placeholder="' . $args['placeholder'] . '">' . $args['value'] . '</textarea>';
@@ -300,7 +303,8 @@ EOF;
 			$class = $args['class'];
 		}
 
-		$labelClass = 'mt-4 mb-2 pb-2 border-bottom text-uppercase w-100';
+		$mt = $args['mt'] ?? 'mt-2';
+		$labelClass = $mt.' mb-0 pb-1 text-uppercase w-100';
 		if (isset($args['labelClass'])) {
 			$labelClass = $args['labelClass'];
 		}
@@ -378,7 +382,8 @@ EOF;
 		$html = '<div class="form-group m-0 mb-2">';
 
 		if (!empty($args['label'])) {
-			$html .= '<label class="mt-4 mb-2 pb-2 border-bottom text-uppercase w-100" for="' . $id . '">' . $args['label'] . '</label>';
+			$mt = $args['mt'] ?? 'mt-2';
+			$html .= '<label class="'.$mt.' mb-0 pb-1 text-uppercase w-100" for="' . $id . '">' . $args['label'] . '</label>';
 		}
 
 		$html .= '<select id="' . $id . '" name="' . $args['name'] . '" class="' . $class . '">';
diff --git a/bl-kernel/admin/views/edit-content.php b/bl-kernel/admin/views/edit-content.php
index 3683072f..2626c011 100644
--- a/bl-kernel/admin/views/edit-content.php
+++ b/bl-kernel/admin/views/edit-content.php
@@ -46,41 +46,73 @@ echo Bootstrap::formInputHidden(array(
 ));
 ?>
 
-<!-- TOOLBAR -->
-<div id="jseditorToolbar" class="mb-1">
-	<div id="jseditorToolbarRight" class="btn-group btn-group-sm float-right" role="group" aria-label="Toolbar right">
-		<button type="button" class="btn btn-light" id="jsmediaManagerOpenModal" data-bs-toggle="modal" data-bs-target="#jsmediaManagerModal"><span class="fa fa-image"></span> <?php $L->p('Images') ?></button>
-		<button type="button" class="btn btn-light" id="jsoptionsSidebar" style="z-index:30"><span class="fa fa-cog"></span> <?php $L->p('Options') ?></button>
-	</div>
+<div class="row">
 
-	<div id="jseditorToolbarLeft">
-		<button type="button" class="btn btn-sm btn-primary" id="jsbuttonSave"><?php echo $L->g('Save') ?></button>
-		<button id="jsbuttonPreview" type="button" class="btn btn-sm btn-secondary"><?php $L->p('Preview') ?></button>
-		<span id="jsswitchButton" data-switch="<?php echo ($page->draft() ? 'draft' : 'publish') ?>" class="ml-2 text-secondary switch-button"><i class="fa fa-square switch-icon-<?php echo ($page->draft() ? 'draft' : 'publish') ?>"></i> <?php echo ($page->draft() ? $L->g('Draft') : $L->g('Publish')) ?></span>
-	</div>
+<!-- TOOLBAR -->
+<div class="mb-3 col-lg-6">
+	<button type="button" class="btn btn-light" data-bs-toggle="modal" data-bs-target="#jsmediaManagerModal"><span class="fa fa-image"></span> <?php $L->p('Images') ?></button>
+	<span id="jsswitchButton" data-switch="<?php echo ($page->draft() ? 'draft' : 'publish') ?>" class="ml-2 btn-outline-<?php echo ($page->draft() ? 'light' : 'success') ?> btn"><?php echo ($page->draft() ? $L->g('Draft') : $L->g('Publish')) ?></span>
 
 	<?php if ($page->scheduled()) : ?>
 		<div class="alert alert-warning p-1 mt-1 mb-0"><?php $L->p('scheduled') ?>: <?php echo $page->date(SCHEDULED_DATE_FORMAT) ?></div>
 	<?php endif; ?>
 </div>
-<script>
-	$(document).ready(function() {
-		$("#jsoptionsSidebar").on("click", function() {
-			$("#jseditorSidebar").toggle();
-			$("#jsshadow").toggle();
-		});
 
-		$("#jsshadow").on("click", function() {
-			$("#jseditorSidebar").toggle();
-			$("#jsshadow").toggle();
-		});
-	});
-</script>
+	<div class="col-lg-6 text-end">
+	<button id="jsbuttonPreview" type="button" class="btn btn-secondary"><?php $L->p('Preview') ?></button>
+		<button type="button" class="btn btn-primary" id="jsbuttonSave"><?php echo $L->g('Save') ?></button>
+	</div>
+</div>
+
+<div class="row">
+
+<div class="col-lg-9">
+	<!-- Title -->
+	<div class="form-group mb-2">
+		<input id="jstitle" name="title" type="text" dir="auto" class="form-control form-control-lg" value="<?php echo $page->title() ?>" placeholder="<?php $L->p('Enter title') ?>">
+	</div>
+
+	<!-- Editor -->
+	<textarea id="jseditor" class="editable h-100" style=""><?php echo $page->contentRaw(true) ?></textarea>
+
+	<!-- Custom fields: BOTTOM -->
+	<?php
+	$customFields = $site->customFields();
+	foreach ($customFields as $field => $options) {
+		if (isset($options['position']) && ($options['position'] == 'bottom')) {
+			if ($options['type'] == "string") {
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'custom[' . $field . ']',
+					'label' => (isset($options['label']) ? $options['label'] : ''),
+					'value' => $page->custom($field),
+					'tip' => (isset($options['tip']) ? $options['tip'] : ''),
+					'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
+					'class' => 'mt-2',
+					'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
+
+				));
+			} elseif ($options['type'] == "bool") {
+				echo Bootstrap::formCheckbox(array(
+					'name' => 'custom[' . $field . ']',
+					'label' => (isset($options['label']) ? $options['label'] : ''),
+					'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
+					'checked' => $page->custom($field),
+					'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : ''),
+					'class' => 'mt-2',
+					'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
+				));
+			}
+		}
+	}
+	?>
+
+	</form>
+</div>
 
 <!-- SIDEBAR OPTIONS -->
-<div id="jseditorSidebar">
-	<nav>
-		<div class="nav nav-tabs" id="nav-tab" role="tablist">
+<div class="col-lg-3">
+	<nav class="mb-2">
+		<div class="nav nav-pills" id="nav-tab" role="tablist">
 			<a class="nav-link active show" id="nav-general-tab" data-bs-toggle="tab" data-bs-target="#nav-general" role="tab" aria-controls="general"><?php $L->p('General') ?></a>
 			<a class="nav-link" id="nav-advanced-tab" data-bs-toggle="tab" data-bs-target="#nav-advanced" role="tab" aria-controls="advanced"><?php $L->p('Advanced') ?></a>
 			<?php if (!empty($site->customFields())) : ?>
@@ -90,7 +122,8 @@ echo Bootstrap::formInputHidden(array(
 		</div>
 	</nav>
 
-	<div class="tab-content pr-3 pl-3 pb-3">
+	<div class="card">
+	<div class="tab-content pr-3 pl-3 pb-3 card-body">
 		<div id="nav-general" class="tab-pane fade show active" role="tabpanel" aria-labelledby="general-tab">
 			<?php
 			// Category
@@ -100,7 +133,17 @@ echo Bootstrap::formInputHidden(array(
 				'selected' => $page->categoryKey(),
 				'class' => '',
 				'emptyOption' => '- ' . $L->g('Uncategorized') . ' -',
-				'options' => $categories->getKeyNameArray()
+				'options' => $categories->getKeyNameArray(),
+				'mt'=>'mt-0'
+			));
+
+			// Tags
+			echo Bootstrap::formInputTextBlock(array(
+				'name' => 'tags',
+				'label' => $L->g('Tags'),
+				'placeholder' => '',
+				'tip' => $L->g('Write the tags separated by comma'),
+				'value' => $page->tags()
 			));
 
 			// Description
@@ -124,7 +167,7 @@ echo Bootstrap::formInputHidden(array(
 				$externalCoverImage = $page->coverImage(false);
 			}
 			?>
-			<label class="mt-4 mb-2 pb-2 border-bottom text-uppercase w-100"><?php $L->p('Cover Image') ?></label>
+			<label class="mt-2 mb-0 pb-1 text-uppercase w-100"><?php $L->p('Cover Image') ?></label>
 			<div>
 				<img id="jscoverImagePreview" class="mx-auto d-block w-100" alt="Cover image preview" src="<?php echo (empty($coverImage) ? HTML_PATH_CORE_IMG . 'default.svg' : $page->coverImage()) ?>" />
 			</div>
@@ -157,7 +200,8 @@ echo Bootstrap::formInputHidden(array(
 				'label' => $L->g('Date'),
 				'placeholder' => '',
 				'value' => $page->dateRaw(),
-				'tip' => $L->g('date-format-format')
+				'tip' => $L->g('date-format-format'),
+				'mt'=>'mt-0'
 			));
 
 			// Type
@@ -181,15 +225,6 @@ echo Bootstrap::formInputHidden(array(
 				'value' => $page->position()
 			));
 
-			// Tags
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'tags',
-				'label' => $L->g('Tags'),
-				'placeholder' => '',
-				'tip' => $L->g('Write the tags separated by comma'),
-				'value' => $page->tags()
-			));
-
 			// Parent
 			try {
 				$options = array();
@@ -328,7 +363,8 @@ echo Bootstrap::formInputHidden(array(
 				'tip' => $L->g('URL associated with the content'),
 				'label' => $L->g('Friendly URL'),
 				'placeholder' => $L->g('Leave empty for autocomplete by Koblog.'),
-				'value' => $page->slug()
+				'value' => $page->slug(),
+				'mt'=>'mt-0'
 			));
 
 			// Robots
@@ -363,6 +399,7 @@ echo Bootstrap::formInputHidden(array(
 			?>
 		</div>
 	</div>
+	</div>
 </div>
 
 <!-- Custom fields: TOP -->
@@ -378,7 +415,7 @@ foreach ($customFields as $field => $options) {
 				'tip' => (isset($options['tip']) ? $options['tip'] : ''),
 				'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
 				'class' => 'mb-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
+				'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
 
 			));
 		} elseif ($options['type'] == "bool") {
@@ -389,54 +426,13 @@ foreach ($customFields as $field => $options) {
 				'checked' => $page->custom($field),
 				'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : ''),
 				'class' => 'mb-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
+				'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
 			));
 		}
 	}
 }
 ?>
 
-<!-- Title -->
-<div class="form-group mb-1">
-	<input id="jstitle" name="title" type="text" dir="auto" class="form-control form-control-lg rounded-0" value="<?php echo $page->title() ?>" placeholder="<?php $L->p('Enter title') ?>">
-</div>
-
-<!-- Editor -->
-<textarea id="jseditor" class="editable h-100" style=""><?php echo $page->contentRaw(true) ?></textarea>
-
-<!-- Custom fields: BOTTOM -->
-<?php
-$customFields = $site->customFields();
-foreach ($customFields as $field => $options) {
-	if (isset($options['position']) && ($options['position'] == 'bottom')) {
-		if ($options['type'] == "string") {
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'custom[' . $field . ']',
-				'label' => (isset($options['label']) ? $options['label'] : ''),
-				'value' => $page->custom($field),
-				'tip' => (isset($options['tip']) ? $options['tip'] : ''),
-				'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
-				'class' => 'mt-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
-
-			));
-		} elseif ($options['type'] == "bool") {
-			echo Bootstrap::formCheckbox(array(
-				'name' => 'custom[' . $field . ']',
-				'label' => (isset($options['label']) ? $options['label'] : ''),
-				'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
-				'checked' => $page->custom($field),
-				'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : ''),
-				'class' => 'mt-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
-			));
-		}
-	}
-}
-?>
-
-</form>
-
 <!-- Modal for Delete page -->
 <div id="jsdeletePageModal" class="modal" tabindex="-1" role="dialog">
 	<div class="modal-dialog">
@@ -462,8 +458,10 @@ foreach ($customFields as $field => $options) {
 	</script>
 </div>
 
+</div>
+
 <!-- Modal for Media Manager -->
-<?php include(PATH_ADMIN_THEMES . 'booty/html/media.php'); ?>
+<?php include(PATH_ADMIN_THEMES . 'koblog/html/media.php'); ?>
 
 <script>
 	$(document).ready(function() {
@@ -489,11 +487,13 @@ foreach ($customFields as $field => $options) {
 		// Button switch
 		$("#jsswitchButton").on("click", function() {
 			if ($(this).data("switch") == "publish") {
-				$(this).html('<i class="fa fa-square switch-icon-draft"></i> <?php $L->p('Draft') ?>');
+				$(this).html('<?php $L->p('Draft') ?>');
 				$(this).data("switch", "draft");
+				$(this).attr('class', "ml-2 btn-outline-secondary btn");
 			} else {
-				$(this).html('<i class="fa fa-square switch-icon-publish"></i> <?php $L->p('Publish') ?>');
+				$(this).html('<?php $L->p('Publish') ?>');
 				$(this).data("switch", "publish");
+				$(this).attr('class', "ml-2 btn-outline-success btn");
 			}
 		});
 
diff --git a/bl-kernel/admin/views/new-content.php b/bl-kernel/admin/views/new-content.php
index 1457f5e4..e1b025f1 100644
--- a/bl-kernel/admin/views/new-content.php
+++ b/bl-kernel/admin/views/new-content.php
@@ -39,310 +39,347 @@ echo Bootstrap::formInputHidden(array(
 	'value' => ''
 ));
 ?>
+<div class="row">
 
 <!-- TOOLBAR -->
-<div id="jseditorToolbar" class="mb-1">
-	<div id="jseditorToolbarRight" class="btn-group btn-group-sm float-right" role="group" aria-label="Toolbar right">
-		<button type="button" class="btn btn-light" id="jsmediaManagerOpenModal" data-toggle="modal" data-target="#jsmediaManagerModal"><span class="fa fa-image"></span> <?php $L->p('Images') ?></button>
-		<button type="button" class="btn btn-light" id="jsoptionsSidebar" style="z-index:30"><span class="fa fa-cog"></span> <?php $L->p('Options') ?></button>
-	</div>
+<div class="mb-3 col-lg-6">
+	<button type="button" class="btn btn-light" data-bs-toggle="modal" data-bs-target="#jsmediaManagerModal"><span class="fa fa-image"></span> <?php $L->p('Images') ?></button>
+	<span id="jsswitchButton" data-switch="publish" class="ml-2 btn-outline-success btn"><?php $L->p('Publish') ?></span>
+</div>
 
-	<div id="jseditorToolbarLeft">
-		<button id="jsbuttonSave" type="button" class="btn btn-sm btn-primary"><?php $L->p('Save') ?></button>
-		<button id="jsbuttonPreview" type="button" class="btn btn-sm btn-secondary"><?php $L->p('Preview') ?></button>
-		<span id="jsbuttonSwitch" data-switch="publish" class="ml-2 text-secondary switch-button"><i class="fa fa-square switch-icon-publish"></i> <?php $L->p('Publish') ?></span>
+	<div class="col-lg-6 text-end">
+	<button id="jsbuttonPreview" type="button" class="btn btn-secondary"><?php $L->p('Preview') ?></button>
+		<button type="button" class="btn btn-primary" id="jsbuttonSave"><?php echo $L->g('Save') ?></button>
 	</div>
 </div>
-<script>
-	$(document).ready(function() {
-		$("#jsoptionsSidebar").on("click", function() {
-			$("#jseditorSidebar").toggle();
-			$("#jsshadow").toggle();
-		});
 
-		$("#jsshadow").on("click", function() {
-			$("#jseditorSidebar").toggle();
-			$("#jsshadow").toggle();
-		});
-	});
-</script>
+<div class="row">
+
+
+<div class="col-lg-9">
+	<!-- Title -->
+	<div class="form-group mb-2">
+		<input id="jstitle" name="title" type="text" dir="auto" class="form-control form-control-lg" value="" placeholder="<?php $L->p('Enter title') ?>">
+	</div>
+
+	<!-- Editor -->
+	<textarea id="jseditor" class="editable h-100 mb-1"></textarea>
+
+	<!-- Custom fields: BOTTOM -->
+	<?php
+	$customFields = $site->customFields();
+	foreach ($customFields as $field => $options) {
+		if (isset($options['position']) && ($options['position'] == 'bottom')) {
+			if ($options['type'] == "string") {
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'custom[' . $field . ']',
+					'label' => (isset($options['label']) ? $options['label'] : ''),
+					'value' => (isset($options['default']) ? $options['default'] : ''),
+					'tip' => (isset($options['tip']) ? $options['tip'] : ''),
+					'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
+					'class' => 'mt-2',
+					'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
+
+				));
+			} elseif ($options['type'] == "bool") {
+				echo Bootstrap::formCheckbox(array(
+					'name' => 'custom[' . $field . ']',
+					'label' => (isset($options['label']) ? $options['label'] : ''),
+					'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
+					'checked' => (isset($options['checked']) ? true : false),
+					'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : ''),
+					'class' => 'mt-2',
+					'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
+				));
+			}
+		}
+	}
+	?>
+
+	</form>
+</div>
 
 <!-- SIDEBAR OPTIONS -->
-<div id="jseditorSidebar">
-	<nav>
-		<div class="nav nav-tabs" id="nav-tab" role="tablist">
-			<a class="nav-link active show" id="nav-general-tab" data-toggle="tab" href="#nav-general" role="tab" aria-controls="general"><?php $L->p('General') ?></a>
-			<a class="nav-link" id="nav-advanced-tab" data-toggle="tab" href="#nav-advanced" role="tab" aria-controls="advanced"><?php $L->p('Advanced') ?></a>
+<div class="col-lg-3">
+	<nav class="mb-2">
+		<div class="nav nav-pills" id="nav-tab" role="tablist">
+			<a class="nav-link active show" id="nav-general-tab" data-bs-toggle="tab" data-bs-target="#nav-general" role="tab" aria-controls="general"><?php $L->p('General') ?></a>
+			<a class="nav-link" id="nav-advanced-tab" data-bs-toggle="tab" data-bs-target="#nav-advanced" role="tab" aria-controls="advanced"><?php $L->p('Advanced') ?></a>
 			<?php if (!empty($site->customFields())) : ?>
-				<a class="nav-link" id="nav-custom-tab" data-toggle="tab" href="#nav-custom" role="tab" aria-controls="custom"><?php $L->p('Custom') ?></a>
+				<a class="nav-link" id="nav-custom-tab" data-bs-toggle="tab" data-bs-target="#nav-custom" role="tab" aria-controls="custom"><?php $L->p('Custom') ?></a>
 			<?php endif ?>
-			<a class="nav-link" id="nav-seo-tab" data-toggle="tab" href="#nav-seo" role="tab" aria-controls="seo"><?php $L->p('SEO') ?></a>
+			<a class="nav-link" id="nav-seo-tab" data-bs-toggle="tab" data-bs-target="#nav-seo" role="tab" aria-controls="seo"><?php $L->p('SEO') ?></a>
 		</div>
 	</nav>
 
-	<div class="tab-content pr-3 pl-3 pb-3">
-		<div id="nav-general" class="tab-pane fade show active" role="tabpanel" aria-labelledby="general-tab">
-			<?php
-			// Category
-			echo Bootstrap::formSelectBlock(array(
-				'name' => 'category',
-				'label' => $L->g('Category'),
-				'selected' => '',
-				'class' => '',
-				'emptyOption' => '- ' . $L->g('Uncategorized') . ' -',
-				'options' => $categories->getKeyNameArray()
-			));
-
-			// Description
-			echo Bootstrap::formTextareaBlock(array(
-				'name' => 'description',
-				'label' => $L->g('Description'),
-				'selected' => '',
-				'class' => '',
-				'value' => '',
-				'rows' => 5,
-				'placeholder' => $L->get('this-field-can-help-describe-the-content')
-			));
-			?>
-
-			<!-- Cover Image -->
-			<label class="mt-4 mb-2 pb-2 border-bottom text-uppercase w-100"><?php $L->p('Cover Image') ?></label>
-			<div>
-				<img id="jscoverImagePreview" class="mx-auto d-block w-100" alt="Cover image preview" src="<?php echo HTML_PATH_CORE_IMG ?>default.svg" />
-			</div>
-			<div class="mt-2 text-center">
-				<button type="button" id="jsbuttonSelectCoverImage" class="btn btn-primary btn-sm"><?php echo $L->g('Select cover image') ?></button>
-				<button type="button" id="jsbuttonRemoveCoverImage" class="btn btn-secondary btn-sm"><?php echo $L->g('Remove cover image') ?></button>
-			</div>
-			<script>
-				$(document).ready(function() {
-					$("#jscoverImagePreview").on("click", function() {
-						openMediaManager();
-					});
-
-					$("#jsbuttonSelectCoverImage").on("click", function() {
-						openMediaManager();
-					});
-
-					$("#jsbuttonRemoveCoverImage").on("click", function() {
-						$("#jscoverImage").val('');
-						$("#jscoverImagePreview").attr('src', HTML_PATH_CORE_IMG + 'default.svg');
-					});
-				});
-			</script>
-		</div>
-		<div id="nav-advanced" class="tab-pane fade" role="tabpanel" aria-labelledby="advanced-tab">
-			<?php
-			// Date
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'date',
-				'label' => $L->g('Date'),
-				'placeholder' => '',
-				'value' => Date::current(DB_DATE_FORMAT),
-				'tip' => $L->g('date-format-format')
-			));
-
-			// Type
-			echo Bootstrap::formSelectBlock(array(
-				'name' => 'typeSelector',
-				'label' => $L->g('Type'),
-				'selected' => '',
-				'options' => array(
-					'published' => '- ' . $L->g('Default') . ' -',
-					'sticky' => $L->g('Sticky'),
-					'static' => $L->g('Static')
-				),
-				'tip' => ''
-			));
-
-			// Position
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'position',
-				'label' => $L->g('Position'),
-				'tip' => $L->g('Field used when ordering content by position'),
-				'value' => $pages->nextPositionNumber()
-			));
-
-			// Tags
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'tags',
-				'label' => $L->g('Tags'),
-				'placeholder' => '',
-				'tip' => $L->g('Write the tags separated by comma')
-			));
-
-			// Parent
-			echo Bootstrap::formSelectBlock(array(
-				'name' => 'parent',
-				'label' => $L->g('Parent'),
-				'options' => array(),
-				'selected' => false,
-				'class' => '',
-				'tip' => $L->g('Start typing a page title to see a list of suggestions.'),
-			));
-
-			?>
-
-			<script>
-				$(document).ready(function() {
-					var parent = $("#jsparent").select2({
-						placeholder: "",
-						allowClear: true,
-						theme: "bootstrap4",
-						minimumInputLength: 2,
-						ajax: {
-							url: HTML_PATH_ADMIN_ROOT + "ajax/get-published",
-							data: function(params) {
-								var query = {
-									checkIsParent: true,
-									query: params.term
-								}
-								return query;
-							},
-							processResults: function(data) {
-								return data;
-							}
-						},
-						escapeMarkup: function(markup) {
-							return markup;
-						},
-						templateResult: function(data) {
-							var html = data.text;
-							if (data.type == "static") {
-								html += '<span class="badge badge-pill badge-light">' + data.type + '</span>';
-							}
-							return html;
-						}
-					});
-				});
-			</script>
-
-			<?php
-			// Template
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'template',
-				'label' => $L->g('Template'),
-				'placeholder' => '',
-				'value' => '',
-				'tip' => $L->g('Write a template name to filter the page in the theme and change the style of the page.')
-			));
-
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'externalCoverImage',
-				'label' => $L->g('External cover image'),
-				'placeholder' => "https://",
-				'value' => '',
-				'tip' => $L->g('Set a cover image from external URL, such as a CDN or some server dedicated for images.')
-			));
-
-			// Username
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => '',
-				'label' => $L->g('Author'),
-				'placeholder' => '',
-				'value' => $login->username(),
-				'tip' => '',
-				'disabled' => true
-			));
-			?>
-
-			<script>
-				$(document).ready(function() {
-
-					// Changes in External cover image input
-					$("#jsexternalCoverImage").change(function() {
-						$("#jscoverImage").val($(this).val());
-					});
-
-					// Generate slug when the user type the title
-					$("#jstitle").keyup(function() {
-						var text = $(this).val();
-						var parent = $("#jsparent").val();
-						var currentKey = "";
-						var ajax = new koblogAjax();
-						var callBack = $("#jsslug");
-						ajax.generateSlug(text, parent, currentKey, callBack);
-					});
-
-					// Datepicker
-					$("#jsdate").datetimepicker({
-						format: DB_DATE_FORMAT
-					});
-
-
-				});
-			</script>
-		</div>
-		<?php if (!empty($site->customFields())) : ?>
-			<div id="nav-custom" class="tab-pane fade" role="tabpanel" aria-labelledby="custom-tab">
+	<div class="card mb-2"><div class="card-body">
+		<div class="tab-content pr-3 pl-3 pb-3">
+			<div id="nav-general" class="tab-pane fade show active" role="tabpanel" aria-labelledby="general-tab">
 				<?php
-				$customFields = $site->customFields();
-				foreach ($customFields as $field => $options) {
-					if (!isset($options['position'])) {
-						if ($options['type'] == "string") {
-							echo Bootstrap::formInputTextBlock(array(
-								'name' => 'custom[' . $field . ']',
-								'label' => (isset($options['label']) ? $options['label'] : ''),
-								'value' => (isset($options['default']) ? $options['default'] : ''),
-								'tip' => (isset($options['tip']) ? $options['tip'] : ''),
-								'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : '')
-							));
-						} elseif ($options['type'] == "bool") {
-							echo Bootstrap::formCheckbox(array(
-								'name' => 'custom[' . $field . ']',
-								'label' => (isset($options['label']) ? $options['label'] : ''),
-								'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
-								'checked' => (isset($options['checked']) ? true : false),
-								'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : '')
-							));
+				// Category
+				echo Bootstrap::formSelectBlock(array(
+					'name' => 'category',
+					'label' => $L->g('Category'),
+					'selected' => '',
+					'class' => '',
+					'emptyOption' => '- ' . $L->g('Uncategorized') . ' -',
+					'options' => $categories->getKeyNameArray(),
+					'mt' => 'mt-0'
+				));
+
+				// Tags
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'tags',
+					'label' => $L->g('Tags'),
+					'placeholder' => '',
+					'tip' => $L->g('Write the tags separated by comma')
+				));
+
+				// Description
+				echo Bootstrap::formTextareaBlock(array(
+					'name' => 'description',
+					'label' => $L->g('Description'),
+					'selected' => '',
+					'class' => '',
+					'value' => '',
+					'rows' => 5,
+					'placeholder' => $L->get('this-field-can-help-describe-the-content')
+				));
+				?>
+
+				<!-- Cover Image -->
+				<label class="mt-2 mb-0 pb-1 text-uppercase w-100"><?php $L->p('Cover Image') ?></label>
+				<div>
+					<img id="jscoverImagePreview" class="mx-auto d-block w-100" alt="Cover image preview" src="<?php echo HTML_PATH_CORE_IMG ?>default.svg" />
+				</div>
+				<div class="mt-2 text-center">
+					<button type="button" id="jsbuttonSelectCoverImage" class="btn btn-primary btn-sm"><?php echo $L->g('Select cover image') ?></button>
+					<button type="button" id="jsbuttonRemoveCoverImage" class="btn btn-secondary btn-sm"><?php echo $L->g('Remove cover image') ?></button>
+				</div>
+				<script>
+					$(document).ready(function() {
+						$("#jscoverImagePreview").on("click", function() {
+							openMediaManager();
+						});
+
+						$("#jsbuttonSelectCoverImage").on("click", function() {
+							openMediaManager();
+						});
+
+						$("#jsbuttonRemoveCoverImage").on("click", function() {
+							$("#jscoverImage").val('');
+							$("#jscoverImagePreview").attr('src', HTML_PATH_CORE_IMG + 'default.svg');
+						});
+					});
+				</script>
+			</div>
+			<div id="nav-advanced" class="tab-pane fade" role="tabpanel" aria-labelledby="advanced-tab">
+				<?php
+				// Date
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'date',
+					'label' => $L->g('Date'),
+					'placeholder' => '',
+					'value' => Date::current(DB_DATE_FORMAT),
+					'tip' => $L->g('date-format-format'),
+					'mt' => 'mt-0'
+				));
+
+				// Type
+				echo Bootstrap::formSelectBlock(array(
+					'name' => 'typeSelector',
+					'label' => $L->g('Type'),
+					'selected' => '',
+					'options' => array(
+						'published' => '- ' . $L->g('Default') . ' -',
+						'sticky' => $L->g('Sticky'),
+						'static' => $L->g('Static')
+					),
+					'tip' => ''
+				));
+
+				// Position
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'position',
+					'label' => $L->g('Position'),
+					'tip' => $L->g('Field used when ordering content by position'),
+					'value' => $pages->nextPositionNumber()
+				));
+
+				// Parent
+				echo Bootstrap::formSelectBlock(array(
+					'name' => 'parent',
+					'label' => $L->g('Parent'),
+					'options' => array(),
+					'selected' => false,
+					'class' => '',
+					'tip' => $L->g('Start typing a page title to see a list of suggestions.'),
+				));
+
+				?>
+
+				<script>
+					$(document).ready(function() {
+						var parent = $("#jsparent").select2({
+							placeholder: "",
+							allowClear: true,
+							theme: "bootstrap4",
+							minimumInputLength: 2,
+							ajax: {
+								url: HTML_PATH_ADMIN_ROOT + "ajax/get-published",
+								data: function(params) {
+									var query = {
+										checkIsParent: true,
+										query: params.term
+									}
+									return query;
+								},
+								processResults: function(data) {
+									return data;
+								}
+							},
+							escapeMarkup: function(markup) {
+								return markup;
+							},
+							templateResult: function(data) {
+								var html = data.text;
+								if (data.type == "static") {
+									html += '<span class="badge badge-pill badge-light">' + data.type + '</span>';
+								}
+								return html;
+							}
+						});
+					});
+				</script>
+
+				<?php
+				// Template
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'template',
+					'label' => $L->g('Template'),
+					'placeholder' => '',
+					'value' => '',
+					'tip' => $L->g('Write a template name to filter the page in the theme and change the style of the page.')
+				));
+
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'externalCoverImage',
+					'label' => $L->g('External cover image'),
+					'placeholder' => "https://",
+					'value' => '',
+					'tip' => $L->g('Set a cover image from external URL, such as a CDN or some server dedicated for images.')
+				));
+
+				// Username
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => '',
+					'label' => $L->g('Author'),
+					'placeholder' => '',
+					'value' => $login->username(),
+					'tip' => '',
+					'disabled' => true
+				));
+				?>
+
+				<script>
+					$(document).ready(function() {
+
+						// Changes in External cover image input
+						$("#jsexternalCoverImage").change(function() {
+							$("#jscoverImage").val($(this).val());
+						});
+
+						// Generate slug when the user type the title
+						$("#jstitle").keyup(function() {
+							var text = $(this).val();
+							var parent = $("#jsparent").val();
+							var currentKey = "";
+							var ajax = new koblogAjax();
+							var callBack = $("#jsslug");
+							ajax.generateSlug(text, parent, currentKey, callBack);
+						});
+
+						// Datepicker
+						$("#jsdate").datetimepicker({
+							format: DB_DATE_FORMAT
+						});
+
+
+					});
+				</script>
+			</div>
+			<?php if (!empty($site->customFields())) : ?>
+				<div id="nav-custom" class="tab-pane fade" role="tabpanel" aria-labelledby="custom-tab">
+					<?php
+					$customFields = $site->customFields();
+					foreach ($customFields as $field => $options) {
+						if (!isset($options['position'])) {
+							if ($options['type'] == "string") {
+								echo Bootstrap::formInputTextBlock(array(
+									'name' => 'custom[' . $field . ']',
+									'label' => (isset($options['label']) ? $options['label'] : ''),
+									'value' => (isset($options['default']) ? $options['default'] : ''),
+									'tip' => (isset($options['tip']) ? $options['tip'] : ''),
+									'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : '')
+								));
+							} elseif ($options['type'] == "bool") {
+								echo Bootstrap::formCheckbox(array(
+									'name' => 'custom[' . $field . ']',
+									'label' => (isset($options['label']) ? $options['label'] : ''),
+									'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
+									'checked' => (isset($options['checked']) ? true : false),
+									'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : '')
+								));
+							}
 						}
 					}
-				}
+					?>
+				</div>
+			<?php endif ?>
+			<div id="nav-seo" class="tab-pane fade" role="tabpanel" aria-labelledby="seo-tab">
+				<?php
+				// Friendly URL
+				echo Bootstrap::formInputTextBlock(array(
+					'name' => 'slug',
+					'tip' => $L->g('URL associated with the content'),
+					'label' => $L->g('Friendly URL'),
+					'placeholder' => $L->g('Leave empty for autocomplete by Koblog.'),
+					'mt' => 'mt-0'
+				));
+
+				// Robots
+				echo Bootstrap::formCheckbox(array(
+					'name' => 'noindex',
+					'label' => 'Robots',
+					'labelForCheckbox' => $L->g('apply-code-noindex-code-to-this-page'),
+					'placeholder' => '',
+					'checked' => false,
+					'tip' => $L->g('This tells search engines not to show this page in their search results.')
+				));
+
+				// Robots
+				echo Bootstrap::formCheckbox(array(
+					'name' => 'nofollow',
+					'label' => '',
+					'labelForCheckbox' => $L->g('apply-code-nofollow-code-to-this-page'),
+					'placeholder' => '',
+					'checked' => false,
+					'tip' => $L->g('This tells search engines not to follow links on this page.')
+				));
+
+				// Robots
+				echo Bootstrap::formCheckbox(array(
+					'name' => 'noarchive',
+					'label' => '',
+					'labelForCheckbox' => $L->g('apply-code-noarchive-code-to-this-page'),
+					'placeholder' => '',
+					'checked' => false,
+					'tip' => $L->g('This tells search engines not to save a cached copy of this page.')
+				));
 				?>
 			</div>
-		<?php endif ?>
-		<div id="nav-seo" class="tab-pane fade" role="tabpanel" aria-labelledby="seo-tab">
-			<?php
-			// Friendly URL
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'slug',
-				'tip' => $L->g('URL associated with the content'),
-				'label' => $L->g('Friendly URL'),
-				'placeholder' => $L->g('Leave empty for autocomplete by Koblog.')
-			));
-
-			// Robots
-			echo Bootstrap::formCheckbox(array(
-				'name' => 'noindex',
-				'label' => 'Robots',
-				'labelForCheckbox' => $L->g('apply-code-noindex-code-to-this-page'),
-				'placeholder' => '',
-				'checked' => false,
-				'tip' => $L->g('This tells search engines not to show this page in their search results.')
-			));
-
-			// Robots
-			echo Bootstrap::formCheckbox(array(
-				'name' => 'nofollow',
-				'label' => '',
-				'labelForCheckbox' => $L->g('apply-code-nofollow-code-to-this-page'),
-				'placeholder' => '',
-				'checked' => false,
-				'tip' => $L->g('This tells search engines not to follow links on this page.')
-			));
-
-			// Robots
-			echo Bootstrap::formCheckbox(array(
-				'name' => 'noarchive',
-				'label' => '',
-				'labelForCheckbox' => $L->g('apply-code-noarchive-code-to-this-page'),
-				'placeholder' => '',
-				'checked' => false,
-				'tip' => $L->g('This tells search engines not to save a cached copy of this page.')
-			));
-			?>
 		</div>
-	</div>
+	</div></div>
 </div>
 
 <!-- Custom fields: TOP -->
@@ -358,7 +395,7 @@ foreach ($customFields as $field => $options) {
 				'tip' => (isset($options['tip']) ? $options['tip'] : ''),
 				'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
 				'class' => 'mb-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
+				'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
 
 			));
 		} elseif ($options['type'] == "bool") {
@@ -369,58 +406,18 @@ foreach ($customFields as $field => $options) {
 				'checked' => (isset($options['checked']) ? true : false),
 				'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : ''),
 				'class' => 'mb-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
+				'labelClass' => 'mb-0 pb-1 text-uppercase w-100'
 			));
 		}
 	}
 }
 ?>
 
-
-<!-- Title -->
-<div id="jseditorTitle" class="form-group mb-1">
-	<input id="jstitle" name="title" type="text" dir="auto" class="form-control form-control-lg rounded-0" value="" placeholder="<?php $L->p('Enter title') ?>">
-</div>
-
-<!-- Editor -->
-<textarea id="jseditor" class="editable h-100 mb-1"></textarea>
-
-<!-- Custom fields: BOTTOM -->
-<?php
-$customFields = $site->customFields();
-foreach ($customFields as $field => $options) {
-	if (isset($options['position']) && ($options['position'] == 'bottom')) {
-		if ($options['type'] == "string") {
-			echo Bootstrap::formInputTextBlock(array(
-				'name' => 'custom[' . $field . ']',
-				'label' => (isset($options['label']) ? $options['label'] : ''),
-				'value' => (isset($options['default']) ? $options['default'] : ''),
-				'tip' => (isset($options['tip']) ? $options['tip'] : ''),
-				'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
-				'class' => 'mt-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
-
-			));
-		} elseif ($options['type'] == "bool") {
-			echo Bootstrap::formCheckbox(array(
-				'name' => 'custom[' . $field . ']',
-				'label' => (isset($options['label']) ? $options['label'] : ''),
-				'placeholder' => (isset($options['placeholder']) ? $options['placeholder'] : ''),
-				'checked' => (isset($options['checked']) ? true : false),
-				'labelForCheckbox' => (isset($options['tip']) ? $options['tip'] : ''),
-				'class' => 'mt-2',
-				'labelClass' => 'mb-2 pb-2 border-bottom text-uppercase w-100'
-			));
-		}
-	}
-}
-?>
-
-</form>
-
 <!-- Modal for Media Manager -->
 <?php include(PATH_ADMIN_THEMES . 'koblog/html/media.php'); ?>
 
+</div>
+
 <script>
 	$(document).ready(function() {
 
@@ -443,13 +440,15 @@ foreach ($customFields as $field => $options) {
 		}
 
 		// Button switch
-		$("#jsbuttonSwitch").on("click", function() {
+		$("#jsswitchButton").on("click", function() {
 			if ($(this).data("switch") == "publish") {
-				$(this).html('<i class="fa fa-square switch-icon-draft"></i> <?php $L->p('Draft') ?>');
+				$(this).html('<?php $L->p('Draft') ?>');
 				$(this).data("switch", "draft");
+				$(this).attr('class', "ml-2 btn-outline-secondary btn");
 			} else {
-				$(this).html('<i class="fa fa-square switch-icon-publish"></i> <?php $L->p('Publish') ?>');
+				$(this).html('<?php $L->p('Publish') ?>');
 				$(this).data("switch", "publish");
+				$(this).attr('class', "ml-2 btn-outline-success btn");
 			}
 		});