<?php
/**
 * ADMIN SIDEBAR NAVIGATION UPDATE
 * 
 * Add this code to your admin_sidebar.php to show blog management links
 * 
 * Find the existing <nav> or <ul> structure in admin_sidebar.php
 * and add the following menu items:
 */
?>

<!-- ADD THIS TO YOUR admin_sidebar.php -->

<!-- Blog Management Menu Item -->
<li class="nav-item">
    <a href="admin_blogs.php" class="nav-link">
        <i class="fas fa-blog"></i>
        <span>Blog</span>
    </a>
    <ul class="nav-submenu">
        <li><a href="admin_blogs.php">All Posts</a></li>
        <li><a href="admin_add_blog.php">Add New Post</a></li>
    </ul>
</li>

<!-- ALTERNATIVE SIMPLE VERSION (if you don't have submenus): -->

<li>
    <a href="admin_blogs.php">
        <i class="icon-blog"></i> Manage Blogs
    </a>
</li>
<li>
    <a href="admin_add_blog.php">
        <i class="icon-plus"></i> Add Blog Post
    </a>
</li>

<!-- BOOTSTRAP NAVBAR VERSION: -->

<li class="nav-item">
    <a class="nav-link" href="admin_blogs.php">Blog Posts</a>
</li>

<!-- TAILWIND VERSION: -->

<li>
    <a href="admin_blogs.php" class="block px-4 py-2 hover:bg-gray-100">
        <span class="text-blue-600">📝</span> Blog Posts
    </a>
</li>

<!-- ============================================ -->

<?php
/**
 * FRONTEND NAVIGATION UPDATE
 * 
 * Add this to your header.php or navigation file
 * to show blog link in main menu
 */
?>

<!-- ADD THIS TO YOUR header.php MAIN NAVIGATION -->

<!-- Simple Link Version -->
<li><a href="blogs.php">Blog</a></li>

<!-- Link with Icon -->
<li>
    <a href="blogs.php">
        <i class="fas fa-blog"></i> Blog
    </a>
</li>

<!-- Dropdown with Subcategories (Optional) -->
<li class="dropdown">
    <a href="blogs.php" class="dropdown-toggle">Blog</a>
    <ul class="dropdown-menu">
        <li><a href="blogs.php">All Posts</a></li>
        <li><a href="blog_category.php?slug=technology">Technology</a></li>
        <li><a href="blog_category.php?slug=business">Business</a></li>
        <li><a href="blog_category.php?slug=lifestyle">Lifestyle</a></li>
    </ul>
</li>

<!-- Bootstrap Navbar Version -->
<li class="nav-item">
    <a class="nav-link" href="blogs.php">Blog</a>
</li>

<!-- Tailwind Version -->
<li>
    <a href="blogs.php" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-gray-200">
        Blog
    </a>
</li>

<!-- ============================================ -->

<?php
/**
 * HOMEPAGE INTEGRATION
 * 
 * Add this code to your index.php to display featured blogs
 */
?>

<!-- ADD THIS TO YOUR index.php -->

<!-- Homepage Blog Section -->
<?php require_once 'home_blog_section.php'; ?>

<!-- Or with conditional check: -->

<?php
if (file_exists('home_blog_section.php')) {
    require_once 'home_blog_section.php';
}
?>

<!-- ============================================ -->

<?php
/**
 * QUICK CSS CUSTOMIZATION
 * 
 * If your sidebar/navigation doesn't have the right styling,
 * add this minimal CSS to your stylesheet:
 */
?>

<style>
    /* Admin Sidebar Blog Menu */
    .nav-item a.nav-link {
        display: block;
        padding: 10px 15px;
        color: #333;
        text-decoration: none;
        border-left: 3px solid transparent;
        transition: all 0.3s;
    }
    
    .nav-item a.nav-link:hover {
        background-color: #f0f0f0;
        border-left-color: #3498db;
        color: #3498db;
    }
    
    .nav-item a.nav-link i {
        margin-right: 10px;
    }
    
    /* Frontend Navigation Blog Link */
    nav a[href="blogs.php"] {
        color: inherit;
        transition: color 0.3s;
    }
    
    nav a[href="blogs.php"]:hover {
        color: #3498db;
    }
</style>

<?php
/**
 * FONT AWESOME ICONS (Optional but recommended)
 * 
 * If using Font Awesome icons, add to your <head>:
 */
?>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

<!-- Then use icons like: -->
<i class="fas fa-blog"></i>        <!-- Blog -->
<i class="fas fa-pen-fancy"></i>   <!-- Write -->
<i class="fas fa-newspaper"></i>   <!-- News -->
<i class="fas fa-list"></i>        <!-- List -->
<i class="fas fa-plus"></i>        <!-- Add -->
<i class="fas fa-edit"></i>        <!-- Edit -->
<i class="fas fa-trash"></i>       <!-- Delete -->
<i class="fas fa-eye"></i>         <!-- View -->

?>
