diff --git a/__pycache__/app.cpython-313.pyc b/__pycache__/app.cpython-313.pyc
index ae90487..7da0fcd 100644
Binary files a/__pycache__/app.cpython-313.pyc and b/__pycache__/app.cpython-313.pyc differ
diff --git a/__pycache__/models.cpython-313.pyc b/__pycache__/models.cpython-313.pyc
index 3cc391e..70d7675 100644
Binary files a/__pycache__/models.cpython-313.pyc and b/__pycache__/models.cpython-313.pyc differ
diff --git a/migrations/versions/add_help_articles_table.py b/migrations/versions/add_help_articles_table.py
new file mode 100644
index 0000000..09cb6a2
--- /dev/null
+++ b/migrations/versions/add_help_articles_table.py
@@ -0,0 +1,56 @@
+"""add help articles table
+
+Revision ID: add_help_articles_table
+Revises: c94c2b2b9f2e
+Create Date: 2024-12-19 10:00:00.000000
+
+"""
+from alembic import op
+import sqlalchemy as sa
+from sqlalchemy import text
+
+
+# revision identifiers, used by Alembic.
+revision = 'add_help_articles_table'
+down_revision = 'c94c2b2b9f2e'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    conn = op.get_bind()
+    result = conn.execute(text("""
+        SELECT EXISTS (
+            SELECT FROM information_schema.tables 
+            WHERE table_name = 'help_articles'
+        );
+    """))
+    exists = result.scalar()
+    if not exists:
+        op.create_table('help_articles',
+            sa.Column('id', sa.Integer(), nullable=False),
+            sa.Column('title', sa.String(length=200), nullable=False),
+            sa.Column('category', sa.String(length=50), nullable=False),
+            sa.Column('body', sa.Text(), nullable=False),
+            sa.Column('created_at', sa.DateTime(), nullable=True),
+            sa.Column('updated_at', sa.DateTime(), nullable=True),
+            sa.Column('created_by', sa.Integer(), nullable=False),
+            sa.Column('is_published', sa.Boolean(), nullable=True, server_default='true'),
+            sa.Column('order_index', sa.Integer(), nullable=True, server_default='0'),
+            sa.ForeignKeyConstraint(['created_by'], ['user.id'], ondelete='CASCADE'),
+            sa.PrimaryKeyConstraint('id')
+        )
+        
+        # Create indexes for better performance
+        op.create_index('idx_help_articles_category', 'help_articles', ['category'])
+        op.create_index('idx_help_articles_published', 'help_articles', ['is_published'])
+        op.create_index('idx_help_articles_order', 'help_articles', ['order_index'])
+        op.create_index('idx_help_articles_created_at', 'help_articles', ['created_at'])
+
+
+def downgrade():
+    op.drop_index('idx_help_articles_category', table_name='help_articles')
+    op.drop_index('idx_help_articles_published', table_name='help_articles')
+    op.drop_index('idx_help_articles_order', table_name='help_articles')
+    op.drop_index('idx_help_articles_created_at', table_name='help_articles')
+    op.drop_table('help_articles') 
\ No newline at end of file
diff --git a/models.py b/models.py
index 1d0c26e..2e39b4b 100644
--- a/models.py
+++ b/models.py
@@ -537,4 +537,53 @@ class Instance(db.Model):
     updated_at = db.Column(db.DateTime, nullable=False, server_default=db.text('CURRENT_TIMESTAMP'), onupdate=db.text('CURRENT_TIMESTAMP'))
 
     def __repr__(self):
-        return f'<Instance {self.name}>' 
\ No newline at end of file
+        return f'<Instance {self.name}>'
+
+class HelpArticle(db.Model):
+    __tablename__ = 'help_articles'
+    id = db.Column(db.Integer, primary_key=True)
+    title = db.Column(db.String(200), nullable=False)
+    category = db.Column(db.String(50), nullable=False)  # getting-started, user-management, file-management, communication, security, administration
+    body = db.Column(db.Text, nullable=False)  # Rich text content
+    created_at = db.Column(db.DateTime, default=datetime.utcnow)
+    updated_at = db.Column(db.DateTime, default=datetime.utcnow, onupdate=datetime.utcnow)
+    created_by = db.Column(db.Integer, db.ForeignKey('user.id', ondelete='CASCADE'), nullable=False)
+    is_published = db.Column(db.Boolean, default=True)
+    order_index = db.Column(db.Integer, default=0)  # For ordering articles within categories
+    
+    # Relationships
+    creator = db.relationship('User', backref=db.backref('created_help_articles', cascade='all, delete-orphan'), foreign_keys=[created_by])
+
+    def __repr__(self):
+        return f'<HelpArticle {self.title} ({self.category})>'
+
+    @classmethod
+    def get_categories(cls):
+        """Get all available categories with their display names"""
+        return {
+            'getting-started': 'Getting Started',
+            'user-management': 'User Management', 
+            'file-management': 'File Management',
+            'communication': 'Communication',
+            'security': 'Security & Privacy',
+            'administration': 'Administration'
+        }
+
+    @classmethod
+    def get_articles_by_category(cls, category, published_only=True):
+        """Get articles for a specific category"""
+        query = cls.query.filter_by(category=category)
+        if published_only:
+            query = query.filter_by(is_published=True)
+        return query.order_by(cls.order_index.asc(), cls.created_at.desc()).all()
+
+    @classmethod
+    def get_all_published(cls):
+        """Get all published articles grouped by category"""
+        articles = cls.query.filter_by(is_published=True).order_by(cls.order_index.asc(), cls.created_at.desc()).all()
+        grouped = {}
+        for article in articles:
+            if article.category not in grouped:
+                grouped[article.category] = []
+            grouped[article.category].append(article)
+        return grouped 
\ No newline at end of file
diff --git a/routes/__pycache__/admin.cpython-313.pyc b/routes/__pycache__/admin.cpython-313.pyc
index 8037f5b..1c23c7e 100644
Binary files a/routes/__pycache__/admin.cpython-313.pyc and b/routes/__pycache__/admin.cpython-313.pyc differ
diff --git a/routes/admin.py b/routes/admin.py
index 2233d75..df1e99a 100644
--- a/routes/admin.py
+++ b/routes/admin.py
@@ -253,4 +253,189 @@ def get_usage_stats():
         stats = DocuPulseSettings.get_usage_stats()
         return jsonify(stats)
     except Exception as e:
-        return jsonify({'error': str(e)}), 500 
\ No newline at end of file
+        return jsonify({'error': str(e)}), 500 
+    
+@admin.route('/help-articles/<int:article_id>', methods=['PUT'])
+@login_required
+def update_help_article(article_id):
+    """Update a help article"""
+    if not current_user.is_admin:
+        return jsonify({'error': 'Unauthorized'}), 403
+    
+    try:
+        article = HelpArticle.query.get_or_404(article_id)
+        
+        title = request.form.get('title')
+        category = request.form.get('category')
+        body = request.form.get('body')
+        order_index = int(request.form.get('order_index', 0))
+        is_published = request.form.get('is_published') == 'true'
+        
+        if not title or not category or not body:
+            return jsonify({'error': 'Title, category, and body are required'}), 400
+        
+        # Validate category
+        valid_categories = HelpArticle.get_categories().keys()
+        if category not in valid_categories:
+            return jsonify({'error': 'Invalid category'}), 400
+        
+        article.title = title
+        article.category = category
+        article.body = body
+        article.order_index = order_index
+        article.is_published = is_published
+        article.updated_at = datetime.utcnow()
+        
+        db.session.commit()
+        
+        # Log the event
+        log_event(
+            event_type='help_article_update',
+            details={
+                'article_id': article.id,
+                'title': article.title,
+                'category': article.category,
+                'updated_by': f"{current_user.username} {current_user.last_name}"
+            },
+            user_id=current_user.id
+        )
+        db.session.commit()
+        
+        return jsonify({'success': True, 'message': 'Article updated successfully'})
+        
+    except Exception as e:
+        db.session.rollback()
+        return jsonify({'error': str(e)}), 500
+
+@admin.route('/help-articles/<int:article_id>', methods=['DELETE'])
+@login_required
+def delete_help_article(article_id):
+    """Delete a help article"""
+    if not current_user.is_admin:
+        return jsonify({'error': 'Unauthorized'}), 403
+    
+    try:
+        article = HelpArticle.query.get_or_404(article_id)
+        
+        # Log the event before deletion
+        log_event(
+            event_type='help_article_delete',
+            details={
+                'article_id': article.id,
+                'title': article.title,
+                'category': article.category,
+                'deleted_by': f"{current_user.username} {current_user.last_name}"
+            },
+            user_id=current_user.id
+        )
+        
+        db.session.delete(article)
+        db.session.commit()
+        
+        return jsonify({'success': True, 'message': 'Article deleted successfully'})
+        
+    except Exception as e:
+        db.session.rollback()
+        return jsonify({'error': str(e)}), 500
+    
+# Help Articles API endpoints
+@admin.route('/help-articles', methods=['GET'])
+@login_required
+def get_help_articles():
+    """Get all help articles"""
+    if not current_user.is_admin:
+        return jsonify({'error': 'Unauthorized'}), 403
+    
+    articles = HelpArticle.query.order_by(HelpArticle.category.asc(), HelpArticle.order_index.asc(), HelpArticle.created_at.desc()).all()
+    
+    articles_data = []
+    for article in articles:
+        articles_data.append({
+            'id': article.id,
+            'title': article.title,
+            'category': article.category,
+            'body': article.body,
+            'created_at': article.created_at.isoformat() if article.created_at else None,
+            'updated_at': article.updated_at.isoformat() if article.updated_at else None,
+            'created_by': article.created_by,
+            'is_published': article.is_published,
+            'order_index': article.order_index
+        })
+    
+    return jsonify({'articles': articles_data})
+
+@admin.route('/help-articles', methods=['POST'])
+@login_required
+def create_help_article():
+    """Create a new help article"""
+    if not current_user.is_admin:
+        return jsonify({'error': 'Unauthorized'}), 403
+    
+    try:
+        title = request.form.get('title')
+        category = request.form.get('category')
+        body = request.form.get('body')
+        order_index = int(request.form.get('order_index', 0))
+        is_published = request.form.get('is_published') == 'true'
+        
+        if not title or not category or not body:
+            return jsonify({'error': 'Title, category, and body are required'}), 400
+        
+        # Validate category
+        valid_categories = HelpArticle.get_categories().keys()
+        if category not in valid_categories:
+            return jsonify({'error': 'Invalid category'}), 400
+        
+        article = HelpArticle(
+            title=title,
+            category=category,
+            body=body,
+            order_index=order_index,
+            is_published=is_published,
+            created_by=current_user.id
+        )
+        
+        db.session.add(article)
+        db.session.commit()
+        
+        # Log the event
+        log_event(
+            event_type='help_article_create',
+            details={
+                'article_id': article.id,
+                'title': article.title,
+                'category': article.category,
+                'created_by': f"{current_user.username} {current_user.last_name}"
+            },
+            user_id=current_user.id
+        )
+        db.session.commit()
+        
+        return jsonify({'success': True, 'message': 'Article created successfully', 'article_id': article.id})
+        
+    except Exception as e:
+        db.session.rollback()
+        return jsonify({'error': str(e)}), 500
+
+@admin.route('/help-articles/<int:article_id>', methods=['GET'])
+@login_required
+def get_help_article(article_id):
+    """Get a specific help article"""
+    if not current_user.is_admin:
+        return jsonify({'error': 'Unauthorized'}), 403
+    
+    article = HelpArticle.query.get_or_404(article_id)
+    
+    article_data = {
+        'id': article.id,
+        'title': article.title,
+        'category': article.category,
+        'body': article.body,
+        'created_at': article.created_at.isoformat() if article.created_at else None,
+        'updated_at': article.updated_at.isoformat() if article.updated_at else None,
+        'created_by': article.created_by,
+        'is_published': article.is_published,
+        'order_index': article.order_index
+    }
+    
+    return jsonify({'article': article_data})
\ No newline at end of file
diff --git a/routes/admin_api.py b/routes/admin_api.py
index 6b0bdf6..aa23fc9 100644
--- a/routes/admin_api.py
+++ b/routes/admin_api.py
@@ -2,9 +2,11 @@ from flask import Blueprint, jsonify, request, current_app, make_response, flash
 from functools import wraps
 from models import (
     KeyValueSettings, User, Room, Conversation, RoomFile,
-    SiteSettings, DocuPulseSettings, Event, Mail, ManagementAPIKey, PasswordSetupToken, PasswordResetToken
+    SiteSettings, DocuPulseSettings, Event, Mail, ManagementAPIKey, PasswordSetupToken, PasswordResetToken,
+    HelpArticle
 )
 from extensions import db, csrf
+from utils import log_event
 from datetime import datetime, timedelta
 import os
 import jwt
@@ -590,4 +592,5 @@ def get_version_info(current_user):
             'git_commit': 'unknown',
             'git_branch': 'unknown',
             'deployed_at': 'unknown'
-        }), 500
\ No newline at end of file
+        }), 500
+
diff --git a/routes/public.py b/routes/public.py
index a75f53d..10ee477 100644
--- a/routes/public.py
+++ b/routes/public.py
@@ -1,5 +1,5 @@
-from flask import Blueprint, render_template, redirect, url_for
-from models import SiteSettings
+from flask import Blueprint, render_template, redirect, url_for, request
+from models import SiteSettings, HelpArticle
 import os
 
 def init_public_routes(public_bp):
@@ -38,6 +38,30 @@ def init_public_routes(public_bp):
         """Help Center page"""
         return render_template('public/help.html')
 
+    @public_bp.route('/help/articles')
+    def help_articles():
+        """Display help articles by category"""
+        category = request.args.get('category', '')
+        
+        # Get all published articles grouped by category
+        all_articles = HelpArticle.get_all_published()
+        categories = HelpArticle.get_categories()
+        
+        # If a specific category is requested, filter to that category
+        if category and category in categories:
+            articles = HelpArticle.get_articles_by_category(category)
+            category_name = categories[category]
+        else:
+            articles = []
+            category_name = None
+        
+        return render_template('public/help_articles.html', 
+                             articles=articles, 
+                             all_articles=all_articles,
+                             categories=categories,
+                             current_category=category,
+                             category_name=category_name)
+
     @public_bp.route('/contact')
     def contact():
         """Contact page"""
diff --git a/templates/admin/support_articles.html b/templates/admin/support_articles.html
index b7dc0b8..5f2df94 100644
--- a/templates/admin/support_articles.html
+++ b/templates/admin/support_articles.html
@@ -2,6 +2,37 @@
 
 {% block title %}Support Articles - DocuPulse{% endblock %}
 
+{% block extra_css %}
+<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.css" rel="stylesheet">
+<style>
+    .article-card {
+        transition: transform 0.2s ease, box-shadow 0.2s ease;
+    }
+    .article-card:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+    }
+    .category-badge {
+        font-size: 0.75rem;
+        padding: 0.25rem 0.5rem;
+    }
+    .status-badge {
+        font-size: 0.75rem;
+        padding: 0.25rem 0.5rem;
+    }
+    .note-editor {
+        border: 1px solid var(--border-color);
+        border-radius: 0.375rem;
+    }
+    .note-editor.note-frame {
+        border-color: var(--border-color);
+    }
+    .note-editor .note-editing-area {
+        background-color: var(--white);
+    }
+</style>
+{% endblock %}
+
 {% block content %}
 <div class="container-fluid">
     <div class="row">
@@ -10,18 +41,373 @@
                 <h1 class="h3 mb-0" style="color: var(--primary-color);">
                     <i class="fas fa-life-ring me-2"></i>Support Articles
                 </h1>
+                <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#createArticleModal">
+                    <i class="fas fa-plus me-2"></i>Create New Article
+                </button>
             </div>
             
-            <div class="card border-0 shadow-sm">
-                <div class="card-body">
-                    <div class="text-center py-5">
-                        <i class="fas fa-file-alt text-muted" style="font-size: 3rem; opacity: 0.5;"></i>
-                        <h4 class="text-muted mt-3">Support Articles</h4>
-                        <p class="text-muted">Content coming soon...</p>
-                    </div>
-                </div>
+            <!-- Articles List -->
+            <div class="row" id="articlesList">
+                <!-- Articles will be loaded here via AJAX -->
             </div>
         </div>
     </div>
 </div>
+
+<!-- Create Article Modal -->
+<div class="modal fade" id="createArticleModal" tabindex="-1" aria-labelledby="createArticleModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-xl modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="createArticleModalLabel">Create New Help Article</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <form id="createArticleForm">
+                <div class="modal-body">
+                    <div class="row">
+                        <div class="col-md-8">
+                            <div class="mb-3">
+                                <label for="articleTitle" class="form-label">Title</label>
+                                <input type="text" class="form-control" id="articleTitle" name="title" required>
+                            </div>
+                        </div>
+                        <div class="col-md-4">
+                            <div class="mb-3">
+                                <label for="articleCategory" class="form-label">Category</label>
+                                <select class="form-select" id="articleCategory" name="category" required>
+                                    <option value="">Select Category</option>
+                                    <option value="getting-started">Getting Started</option>
+                                    <option value="user-management">User Management</option>
+                                    <option value="file-management">File Management</option>
+                                    <option value="communication">Communication</option>
+                                    <option value="security">Security & Privacy</option>
+                                    <option value="administration">Administration</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="mb-3">
+                        <label for="articleBody" class="form-label">Content</label>
+                        <textarea class="form-control" id="articleBody" name="body" rows="15" required></textarea>
+                    </div>
+                    <div class="row">
+                        <div class="col-md-6">
+                            <div class="mb-3">
+                                <label for="orderIndex" class="form-label">Order Index</label>
+                                <input type="number" class="form-control" id="orderIndex" name="order_index" value="0" min="0">
+                                <div class="form-text">Lower numbers appear first in the category</div>
+                            </div>
+                        </div>
+                        <div class="col-md-6">
+                            <div class="mb-3">
+                                <div class="form-check">
+                                    <input class="form-check-input" type="checkbox" id="isPublished" name="is_published" checked>
+                                    <label class="form-check-label" for="isPublished">
+                                        Publish immediately
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                    <button type="submit" class="btn btn-primary">Create Article</button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+<!-- Edit Article Modal -->
+<div class="modal fade" id="editArticleModal" tabindex="-1" aria-labelledby="editArticleModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-xl">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="editArticleModalLabel">Edit Help Article</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <form id="editArticleForm">
+                <input type="hidden" id="editArticleId" name="id">
+                <div class="modal-body">
+                    <div class="row">
+                        <div class="col-md-8">
+                            <div class="mb-3">
+                                <label for="editArticleTitle" class="form-label">Title</label>
+                                <input type="text" class="form-control" id="editArticleTitle" name="title" required>
+                            </div>
+                        </div>
+                        <div class="col-md-4">
+                            <div class="mb-3">
+                                <label for="editArticleCategory" class="form-label">Category</label>
+                                <select class="form-select" id="editArticleCategory" name="category" required>
+                                    <option value="">Select Category</option>
+                                    <option value="getting-started">Getting Started</option>
+                                    <option value="user-management">User Management</option>
+                                    <option value="file-management">File Management</option>
+                                    <option value="communication">Communication</option>
+                                    <option value="security">Security & Privacy</option>
+                                    <option value="administration">Administration</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="mb-3">
+                        <label for="editArticleBody" class="form-label">Content</label>
+                        <textarea class="form-control" id="editArticleBody" name="body" rows="15" required></textarea>
+                    </div>
+                    <div class="row">
+                        <div class="col-md-6">
+                            <div class="mb-3">
+                                <label for="editOrderIndex" class="form-label">Order Index</label>
+                                <input type="number" class="form-control" id="editOrderIndex" name="order_index" value="0" min="0">
+                                <div class="form-text">Lower numbers appear first in the category</div>
+                            </div>
+                        </div>
+                        <div class="col-md-6">
+                            <div class="mb-3">
+                                <div class="form-check">
+                                    <input class="form-check-input" type="checkbox" id="editIsPublished" name="is_published">
+                                    <label class="form-check-label" for="editIsPublished">
+                                        Published
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                    <button type="submit" class="btn btn-primary">Update Article</button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+<!-- Delete Confirmation Modal -->
+<div class="modal fade" id="deleteArticleModal" tabindex="-1" aria-labelledby="deleteArticleModalLabel" aria-hidden="true">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="deleteArticleModalLabel">Delete Article</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <p>Are you sure you want to delete this article? This action cannot be undone.</p>
+                <p class="text-muted" id="deleteArticleTitle"></p>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                <button type="button" class="btn btn-danger" id="confirmDelete">Delete Article</button>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block extra_js %}
+<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script>
+<script>
+$(document).ready(function() {
+    // Initialize Summernote for rich text editing
+    $('#articleBody, #editArticleBody').summernote({
+        height: 300,
+        toolbar: [
+            ['style', ['style']],
+            ['font', ['bold', 'underline', 'italic', 'clear']],
+            ['fontname', ['fontname']],
+            ['color', ['color']],
+            ['para', ['ul', 'ol', 'paragraph']],
+            ['height', ['height']],
+            ['table', ['table']],
+            ['insert', ['link', 'picture']],
+            ['view', ['fullscreen', 'codeview', 'help']]
+        ],
+        styleTags: [
+            'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'
+        ]
+    });
+
+    // Load articles on page load
+    loadArticles();
+
+    // Handle create article form submission
+    $('#createArticleForm').on('submit', function(e) {
+        e.preventDefault();
+        createArticle();
+    });
+
+    // Handle edit article form submission
+    $('#editArticleForm').on('submit', function(e) {
+        e.preventDefault();
+        updateArticle();
+    });
+
+    // Handle delete confirmation
+    $('#confirmDelete').on('click', function() {
+        deleteArticle();
+    });
+});
+
+function loadArticles() {
+    $.get('/api/admin/help-articles', function(data) {
+        const articlesList = $('#articlesList');
+        articlesList.empty();
+        
+        if (data.articles.length === 0) {
+            articlesList.html(`
+                <div class="col-12">
+                    <div class="card border-0 shadow-sm">
+                        <div class="card-body text-center py-5">
+                            <i class="fas fa-file-alt text-muted" style="font-size: 3rem; opacity: 0.5;"></i>
+                            <h4 class="text-muted mt-3">No Articles Yet</h4>
+                            <p class="text-muted">Create your first help article to get started.</p>
+                        </div>
+                    </div>
+                </div>
+            `);
+            return;
+        }
+
+        data.articles.forEach(article => {
+            const categoryNames = {
+                'getting-started': 'Getting Started',
+                'user-management': 'User Management',
+                'file-management': 'File Management',
+                'communication': 'Communication',
+                'security': 'Security & Privacy',
+                'administration': 'Administration'
+            };
+
+            const card = $(`
+                <div class="col-lg-6 col-xl-4 mb-4">
+                    <div class="card article-card border-0 shadow-sm h-100">
+                        <div class="card-body">
+                            <div class="d-flex justify-content-between align-items-start mb-2">
+                                <span class="badge category-badge" style="background-color: var(--primary-color);">
+                                    ${categoryNames[article.category]}
+                                </span>
+                                <span class="badge status-badge ${article.is_published ? 'bg-success' : 'bg-warning'}">
+                                    ${article.is_published ? 'Published' : 'Draft'}
+                                </span>
+                            </div>
+                            <h5 class="card-title mb-2">${article.title}</h5>
+                            <p class="card-text text-muted small mb-3">
+                                ${article.body.substring(0, 100)}${article.body.length > 100 ? '...' : ''}
+                            </p>
+                            <div class="d-flex justify-content-between align-items-center">
+                                <small class="text-muted">
+                                    Order: ${article.order_index} | Created: ${new Date(article.created_at).toLocaleDateString()}
+                                </small>
+                                <div class="btn-group btn-group-sm">
+                                    <button class="btn btn-outline-primary" onclick="editArticle(${article.id})">
+                                        <i class="fas fa-edit"></i>
+                                    </button>
+                                    <button class="btn btn-outline-danger" onclick="confirmDelete(${article.id}, '${article.title}')">
+                                        <i class="fas fa-trash"></i>
+                                    </button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            `);
+            articlesList.append(card);
+        });
+    });
+}
+
+function createArticle() {
+    const formData = new FormData($('#createArticleForm')[0]);
+    formData.set('body', $('#articleBody').summernote('code'));
+    formData.set('is_published', $('#isPublished').is(':checked'));
+
+    $.ajax({
+        url: '/api/admin/help-articles',
+        method: 'POST',
+        data: formData,
+        processData: false,
+        contentType: false,
+        success: function(response) {
+            $('#createArticleModal').modal('hide');
+            $('#createArticleForm')[0].reset();
+            $('#articleBody').summernote('code', '');
+            loadArticles();
+            showAlert('Article created successfully!', 'success');
+        },
+        error: function(xhr) {
+            showAlert('Error creating article: ' + xhr.responseJSON?.error || 'Unknown error', 'danger');
+        }
+    });
+}
+
+function editArticle(articleId) {
+    $.get(`/api/admin/help-articles/${articleId}`, function(data) {
+        $('#editArticleId').val(data.article.id);
+        $('#editArticleTitle').val(data.article.title);
+        $('#editArticleCategory').val(data.article.category);
+        $('#editArticleBody').summernote('code', data.article.body);
+        $('#editOrderIndex').val(data.article.order_index);
+        $('#editIsPublished').prop('checked', data.article.is_published);
+        $('#editArticleModal').modal('show');
+    });
+}
+
+function updateArticle() {
+    const formData = new FormData($('#editArticleForm')[0]);
+    formData.set('body', $('#editArticleBody').summernote('code'));
+    formData.set('is_published', $('#editIsPublished').is(':checked'));
+
+    $.ajax({
+        url: `/api/admin/help-articles/${$('#editArticleId').val()}`,
+        method: 'PUT',
+        data: formData,
+        processData: false,
+        contentType: false,
+        success: function(response) {
+            $('#editArticleModal').modal('hide');
+            loadArticles();
+            showAlert('Article updated successfully!', 'success');
+        },
+        error: function(xhr) {
+            showAlert('Error updating article: ' + xhr.responseJSON?.error || 'Unknown error', 'danger');
+        }
+    });
+}
+
+function confirmDelete(articleId, title) {
+    $('#deleteArticleId').val(articleId);
+    $('#deleteArticleTitle').text(title);
+    $('#deleteArticleModal').modal('show');
+}
+
+function deleteArticle() {
+    const articleId = $('#deleteArticleId').val();
+    
+    $.ajax({
+        url: `/api/admin/help-articles/${articleId}`,
+        method: 'DELETE',
+        success: function(response) {
+            $('#deleteArticleModal').modal('hide');
+            loadArticles();
+            showAlert('Article deleted successfully!', 'success');
+        },
+        error: function(xhr) {
+            showAlert('Error deleting article: ' + xhr.responseJSON?.error || 'Unknown error', 'danger');
+        }
+    });
+}
+
+function showAlert(message, type) {
+    const alertHtml = `
+        <div class="alert alert-${type} alert-dismissible fade show" role="alert">
+            <i class="fas fa-${type === 'success' ? 'check-circle' : 'exclamation-triangle'} me-2"></i>
+            ${message}
+            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+        </div>
+    `;
+    $('.container-fluid').prepend(alertHtml);
+}
+</script>
 {% endblock %} 
\ No newline at end of file
diff --git a/templates/public/help.html b/templates/public/help.html
index 2055e8f..c56d14d 100644
--- a/templates/public/help.html
+++ b/templates/public/help.html
@@ -203,7 +203,7 @@
                         </div>
                         <h4 class="fw-bold mb-3">Getting Started</h4>
                         <p class="text-muted mb-4">Learn the basics of DocuPulse and set up your workspace</p>
-                        <a href="#getting-started" class="btn btn-outline-primary">View Articles</a>
+                        <a href="{{ url_for('public.help_articles', category='getting-started') }}" class="btn btn-outline-primary">View Articles</a>
                     </div>
                 </div>
                 <div class="col-lg-4 col-md-6">
@@ -213,7 +213,7 @@
                         </div>
                         <h4 class="fw-bold mb-3">User Management</h4>
                         <p class="text-muted mb-4">Manage users, permissions, and team collaboration</p>
-                        <a href="#user-management" class="btn btn-outline-primary">View Articles</a>
+                        <a href="{{ url_for('public.help_articles', category='user-management') }}" class="btn btn-outline-primary">View Articles</a>
                     </div>
                 </div>
                 <div class="col-lg-4 col-md-6">
@@ -223,7 +223,7 @@
                         </div>
                         <h4 class="fw-bold mb-3">File Management</h4>
                         <p class="text-muted mb-4">Upload, organize, and manage your documents</p>
-                        <a href="#file-management" class="btn btn-outline-primary">View Articles</a>
+                        <a href="{{ url_for('public.help_articles', category='file-management') }}" class="btn btn-outline-primary">View Articles</a>
                     </div>
                 </div>
                 <div class="col-lg-4 col-md-6">
@@ -233,7 +233,7 @@
                         </div>
                         <h4 class="fw-bold mb-3">Communication</h4>
                         <p class="text-muted mb-4">Use messaging and collaboration features</p>
-                        <a href="#communication" class="btn btn-outline-primary">View Articles</a>
+                        <a href="{{ url_for('public.help_articles', category='communication') }}" class="btn btn-outline-primary">View Articles</a>
                     </div>
                 </div>
                 <div class="col-lg-4 col-md-6">
@@ -243,7 +243,7 @@
                         </div>
                         <h4 class="fw-bold mb-3">Security & Privacy</h4>
                         <p class="text-muted mb-4">Learn about security features and data protection</p>
-                        <a href="#security" class="btn btn-outline-primary">View Articles</a>
+                        <a href="{{ url_for('public.help_articles', category='security') }}" class="btn btn-outline-primary">View Articles</a>
                     </div>
                 </div>
                 <div class="col-lg-4 col-md-6">
@@ -253,7 +253,7 @@
                         </div>
                         <h4 class="fw-bold mb-3">Administration</h4>
                         <p class="text-muted mb-4">Configure settings and manage your organization</p>
-                        <a href="#administration" class="btn btn-outline-primary">View Articles</a>
+                        <a href="{{ url_for('public.help_articles', category='administration') }}" class="btn btn-outline-primary">View Articles</a>
                     </div>
                 </div>
             </div>
@@ -296,7 +296,7 @@
                             </button>
                             <div id="faq3" class="collapse" data-bs-parent="#faqAccordion">
                                 <div class="faq-answer">
-                                    DocuPulse supports a wide range of file types including documents (PDF, DOCX, DOC, TXT, RTF), spreadsheets (XLSX, XLS, ODS), presentations (PPTX, PPT), images (JPG, PNG, GIF, SVG), archives (ZIP, RAR, 7Z), code files (PY, JS, HTML, CSS), audio/video files, and CAD/design files. Individual files can be up to 10MB, and the platform includes storage limits that can be configured by administrators.
+                                    DocuPulse supports a wide range of file types including documents (PDF, DOCX, DOC, TXT, RTF), spreadsheets (XLSX, XLS, ODS), presentations (PPTX, PPT), images (JPG, PNG, GIF, SVG), archives (ZIP, RAR, 7Z), code files (PY, JS, HTML, CSS), audio/video files, and CAD/design files.
                                 </div>
                             </div>
                         </div>
diff --git a/templates/public/help_articles.html b/templates/public/help_articles.html
new file mode 100644
index 0000000..9c48dfc
--- /dev/null
+++ b/templates/public/help_articles.html
@@ -0,0 +1,294 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% if category_name %}{{ category_name }} - {% endif %}Help Articles - DocuPulse</title>
+    <meta name="description" content="Browse help articles and documentation for DocuPulse organized by category.">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+    <link rel="stylesheet" href="{{ url_for('static', filename='css/colors.css') }}?v={{ 'css/colors.css'|asset_version }}">
+    <style>
+        .category-nav {
+            background: var(--white);
+            border-radius: 15px;
+            padding: 20px;
+            box-shadow: 0 5px 15px var(--shadow-color);
+            margin-bottom: 30px;
+        }
+        
+        .category-link {
+            display: block;
+            padding: 12px 20px;
+            margin: 5px 0;
+            border-radius: 10px;
+            text-decoration: none;
+            color: var(--text-dark);
+            transition: all 0.3s ease;
+            border: 2px solid transparent;
+        }
+        
+        .category-link:hover {
+            background-color: var(--bg-color);
+            color: var(--primary-color);
+            transform: translateX(5px);
+        }
+        
+        .category-link.active {
+            background-color: var(--primary-color);
+            color: var(--white);
+            border-color: var(--primary-color);
+        }
+        
+        .article-card {
+            background: var(--white);
+            border-radius: 15px;
+            padding: 30px;
+            box-shadow: 0 5px 15px var(--shadow-color);
+            margin-bottom: 25px;
+            border: none;
+            transition: transform 0.3s ease;
+        }
+        
+        .article-card:hover {
+            transform: translateY(-2px);
+        }
+        
+        .article-title {
+            color: var(--primary-color);
+            margin-bottom: 15px;
+        }
+        
+        .article-content {
+            line-height: 1.7;
+            color: var(--text-dark);
+        }
+        
+        .article-content h1, .article-content h2, .article-content h3, 
+        .article-content h4, .article-content h5, .article-content h6 {
+            color: var(--primary-color);
+            margin-top: 25px;
+            margin-bottom: 15px;
+        }
+        
+        .article-content p {
+            margin-bottom: 15px;
+        }
+        
+        .article-content ul, .article-content ol {
+            margin-bottom: 15px;
+            padding-left: 20px;
+        }
+        
+        .article-content li {
+            margin-bottom: 5px;
+        }
+        
+        .article-content code {
+            background-color: var(--bg-color);
+            padding: 2px 6px;
+            border-radius: 4px;
+            font-family: 'Courier New', monospace;
+        }
+        
+        .article-content pre {
+            background-color: var(--bg-color);
+            padding: 15px;
+            border-radius: 8px;
+            overflow-x: auto;
+            margin: 15px 0;
+        }
+        
+        .article-content blockquote {
+            border-left: 4px solid var(--primary-color);
+            padding-left: 20px;
+            margin: 20px 0;
+            font-style: italic;
+            color: var(--text-muted);
+        }
+        
+        .article-content table {
+            width: 100%;
+            border-collapse: collapse;
+            margin: 20px 0;
+        }
+        
+        .article-content th, .article-content td {
+            border: 1px solid var(--border-color);
+            padding: 10px;
+            text-align: left;
+        }
+        
+        .article-content th {
+            background-color: var(--bg-color);
+            font-weight: 600;
+        }
+        
+        .breadcrumb-nav {
+            background: var(--white);
+            border-radius: 10px;
+            padding: 15px 20px;
+            margin-bottom: 30px;
+            box-shadow: 0 2px 8px var(--shadow-color);
+        }
+        
+        .breadcrumb-item a {
+            color: var(--primary-color);
+            text-decoration: none;
+        }
+        
+        .breadcrumb-item.active {
+            color: var(--text-muted);
+        }
+        
+        .empty-state {
+            text-align: center;
+            padding: 60px 20px;
+        }
+        
+        .empty-state i {
+            font-size: 4rem;
+            color: var(--text-muted);
+            opacity: 0.5;
+            margin-bottom: 20px;
+        }
+        
+        .btn-primary {
+            background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
+            border: none;
+            border-radius: 25px;
+            padding: 12px 30px;
+            font-weight: 600;
+            transition: all 0.3s ease;
+        }
+        .btn-primary:hover {
+            background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
+            transform: translateY(-2px);
+            box-shadow: 0 5px 15px var(--primary-opacity-15);
+            filter: brightness(1.1);
+        }
+        .btn-outline-primary {
+            border: 2px solid var(--primary-color);
+            color: var(--primary-color);
+            border-radius: 25px;
+            padding: 12px 30px;
+            font-weight: 600;
+            transition: all 0.3s ease;
+        }
+        .btn-outline-primary:hover {
+            background: rgba(var(--primary-color-rgb), 0.05);
+            border-color: var(--primary-color);
+            color: var(--primary-color);
+            transform: translateY(-2px);
+            box-shadow: 0 5px 15px rgba(var(--primary-color-rgb), 0.1);
+        }
+    </style>
+</head>
+<body>
+    {% include 'components/header_nav.html' %}
+
+    <!-- Breadcrumb Navigation -->
+    <div class="container mt-4">
+        <nav aria-label="breadcrumb">
+            <ol class="breadcrumb breadcrumb-nav">
+                <li class="breadcrumb-item"><a href="{{ url_for('public.help_center') }}">Help Center</a></li>
+                <li class="breadcrumb-item active" aria-current="page">
+                    {% if category_name %}{{ category_name }}{% else %}All Articles{% endif %}
+                </li>
+            </ol>
+        </nav>
+    </div>
+
+    <!-- Main Content -->
+    <div class="container">
+        <div class="row">
+            <!-- Category Navigation -->
+            <div class="col-lg-3">
+                <div class="category-nav">
+                    <h5 class="mb-3" style="color: var(--primary-color);">
+                        <i class="fas fa-folder me-2"></i>Categories
+                    </h5>
+                    <a href="{{ url_for('public.help_articles') }}" 
+                       class="category-link {% if not current_category %}active{% endif %}">
+                        <i class="fas fa-th-large me-2"></i>All Articles
+                    </a>
+                    {% for category_key, category_name in categories.items() %}
+                    <a href="{{ url_for('public.help_articles', category=category_key) }}" 
+                       class="category-link {% if current_category == category_key %}active{% endif %}">
+                        <i class="fas fa-{{ 'rocket' if category_key == 'getting-started' else 'users' if category_key == 'user-management' else 'folder' if category_key == 'file-management' else 'comments' if category_key == 'communication' else 'shield-alt' if category_key == 'security' else 'cog' }} me-2"></i>
+                        {{ category_name }}
+                        {% if all_articles.get(category_key) %}
+                        <span class="badge bg-secondary float-end">{{ all_articles[category_key]|length }}</span>
+                        {% endif %}
+                    </a>
+                    {% endfor %}
+                </div>
+            </div>
+
+            <!-- Articles Content -->
+            <div class="col-lg-9">
+                {% if category_name %}
+                <div class="d-flex justify-content-between align-items-center mb-4">
+                    <h1 class="h2 mb-0" style="color: var(--primary-color);">
+                        <i class="fas fa-{{ 'rocket' if current_category == 'getting-started' else 'users' if current_category == 'user-management' else 'folder' if current_category == 'file-management' else 'comments' if current_category == 'communication' else 'shield-alt' if current_category == 'security' else 'cog' }} me-2"></i>
+                        {{ category_name }}
+                    </h1>
+                    <a href="{{ url_for('public.help_center') }}" class="btn btn-outline-primary">
+                        <i class="fas fa-arrow-left me-2"></i>Back to Help Center
+                    </a>
+                </div>
+                {% else %}
+                <div class="d-flex justify-content-between align-items-center mb-4">
+                    <h1 class="h2 mb-0" style="color: var(--primary-color);">
+                        <i class="fas fa-book me-2"></i>All Help Articles
+                    </h1>
+                    <a href="{{ url_for('public.help_center') }}" class="btn btn-outline-primary">
+                        <i class="fas fa-arrow-left me-2"></i>Back to Help Center
+                    </a>
+                </div>
+                {% endif %}
+
+                {% if articles %}
+                    {% for article in articles %}
+                    <div class="article-card">
+                        <h2 class="article-title">{{ article.title }}</h2>
+                        <div class="article-content">
+                            {{ article.body|safe }}
+                        </div>
+                        <hr class="my-4">
+                        <div class="d-flex justify-content-between align-items-center">
+                            <small class="text-muted">
+                                <i class="fas fa-calendar me-1"></i>
+                                Updated: {{ article.updated_at.strftime('%B %d, %Y') if article.updated_at else article.created_at.strftime('%B %d, %Y') }}
+                            </small>
+                            <span class="badge" style="background-color: var(--primary-color);">
+                                {{ categories[article.category] }}
+                            </span>
+                        </div>
+                    </div>
+                    {% endfor %}
+                {% else %}
+                    <div class="empty-state">
+                        <i class="fas fa-file-alt"></i>
+                        <h3 class="text-muted">No Articles Found</h3>
+                        <p class="text-muted">
+                            {% if current_category %}
+                                No articles are available in the "{{ category_name }}" category yet.
+                            {% else %}
+                                No help articles are available yet.
+                            {% endif %}
+                        </p>
+                        <a href="{{ url_for('public.help_center') }}" class="btn btn-primary">
+                            <i class="fas fa-arrow-left me-2"></i>Back to Help Center
+                        </a>
+                    </div>
+                {% endif %}
+            </div>
+        </div>
+    </div>
+
+    {% include 'components/footer_nav.html' %}
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+</body>
+</html> 
\ No newline at end of file