Agregar estructura completa del tema APUS con Bootstrap 5 y optimizaciones de rendimiento

Se implementa tema WordPress personalizado para Análisis de Precios Unitarios con funcionalidades avanzadas:
- Sistema de templates (front-page, single, archive, page, 404, search)
- Integración de Bootstrap 5.3.8 con estructura modular de assets
- Panel de opciones del tema con Customizer API
- Optimizaciones de rendimiento (Critical CSS, Image Optimization, Performance)
- Funcionalidades SEO y compatibilidad con Rank Math
- Sistema de posts relacionados y tabla de contenidos
- Badge de categorías y manejo de AdSense diferido
- Tipografías Google Fonts configurables
- Documentación completa del tema y guías de uso

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

wp-content/themes/apus-theme/inc/admin/README.md

@@ -0,0 +1,227 @@
+# Apus Theme Options Panel
+
+## Overview
+Complete theme options panel for managing all theme settings from WordPress admin.
+
+## Location
+`Appearance > Theme Options` in WordPress admin
+
+## Files Structure
+
+```
+inc/admin/
+├── theme-options.php           # Main admin page registration
+├── options-api.php             # Settings API and sanitization
+├── options-page-template.php   # HTML template for options page
+└── README.md                   # This file
+
+inc/
+└── theme-options-helpers.php   # Helper functions to get options
+
+assets/admin/
+├── css/
+│   └── theme-options.css       # Admin styles
+└── js/
+    └── theme-options.js        # Admin JavaScript
+```
+
+## Features
+
+### General Tab
+- Site logo upload
+- Site favicon upload
+- Breadcrumbs enable/disable
+- Breadcrumb separator customization
+- Date and time format
+- Copyright text
+- Social media links (Facebook, Twitter, Instagram, LinkedIn, YouTube)
+
+### Content Tab
+- Excerpt length
+- Excerpt more text
+- Default post/page layouts
+- Archive posts per page
+- Featured image display
+- Author box display
+- Comments enable/disable for posts/pages
+- Post meta visibility
+- Tags and categories display
+
+### Performance Tab
+- Lazy loading
+- Remove emoji scripts
+- Remove embeds
+- Remove Dashicons on frontend
+- Defer JavaScript
+- Minify HTML
+- Disable Gutenberg
+
+### Related Posts Tab
+- Enable/disable related posts
+- Number of posts to show
+- Taxonomy to use (category, tag, or both)
+- Section title
+- Number of columns
+
+### Advanced Tab
+- Custom CSS
+- Custom JavaScript (header)
+- Custom JavaScript (footer)
+
+## Usage
+
+### Getting Options in Templates
+
+```php
+// Get any option with default fallback
+$value = apus_get_option('option_name', 'default_value');
+
+// Check if option is enabled (boolean)
+if (apus_is_option_enabled('enable_breadcrumbs')) {
+    // Do something
+}
+
+// Specific helper functions
+$logo_url = apus_get_logo_url();
+$excerpt_length = apus_get_excerpt_length();
+$social_links = apus_get_social_links();
+```
+
+### Available Helper Functions
+
+All helper functions are in `inc/theme-options-helpers.php`:
+
+- `apus_get_option($option_name, $default)`
+- `apus_is_option_enabled($option_name)`
+- `apus_get_breadcrumb_separator()`
+- `apus_show_breadcrumbs()`
+- `apus_get_excerpt_length()`
+- `apus_get_excerpt_more()`
+- `apus_show_related_posts()`
+- `apus_get_related_posts_count()`
+- `apus_get_related_posts_taxonomy()`
+- `apus_get_related_posts_title()`
+- `apus_is_performance_enabled($optimization)`
+- `apus_get_copyright_text()`
+- `apus_get_social_links()`
+- `apus_comments_enabled_for_posts()`
+- `apus_comments_enabled_for_pages()`
+- `apus_get_default_post_layout()`
+- `apus_get_default_page_layout()`
+- `apus_get_archive_posts_per_page()`
+- `apus_show_featured_image_single()`
+- `apus_show_author_box()`
+- `apus_get_date_format()`
+- `apus_get_time_format()`
+- `apus_get_logo_url()`
+- `apus_get_favicon_url()`
+- `apus_get_custom_css()`
+- `apus_get_custom_js_header()`
+- `apus_get_custom_js_footer()`
+- `apus_is_lazy_loading_enabled()`
+- `apus_get_all_options()`
+- `apus_reset_options()`
+
+## Import/Export
+
+### Export Options
+1. Go to `Appearance > Theme Options`
+2. Click "Export Options" button
+3. A JSON file will be downloaded with all current settings
+
+### Import Options
+1. Go to `Appearance > Theme Options`
+2. Click "Import Options" button
+3. Paste the JSON content from your exported file
+4. Click "Import"
+5. Page will reload with imported settings
+
+## Reset to Defaults
+
+Click "Reset to Defaults" button to restore all options to their default values. This action requires confirmation.
+
+## Sanitization
+
+All options are sanitized before saving:
+- Text fields: `sanitize_text_field()`
+- URLs: `esc_url_raw()`
+- HTML content: `wp_kses_post()`
+- Integers: `absint()`
+- Checkboxes: Boolean conversion
+- CSS: Custom sanitization removing scripts
+- JavaScript: Custom sanitization removing PHP code
+
+## Hooks Available
+
+### Actions
+- `apus_before_options_save` - Before options are saved
+- `apus_after_options_save` - After options are saved
+
+### Filters
+- `apus_theme_options` - Filter all options
+- `apus_default_options` - Filter default options
+
+## JavaScript Events
+
+Custom events triggered by the options panel:
+
+- `apus:options:saved` - When options are saved
+- `apus:options:reset` - When options are reset
+- `apus:options:imported` - When options are imported
+- `apus:options:exported` - When options are exported
+
+## Browser Support
+
+- Chrome (latest)
+- Firefox (latest)
+- Safari (latest)
+- Edge (latest)
+
+## Accessibility
+
+- Keyboard navigation supported
+- Screen reader friendly
+- WCAG 2.1 Level AA compliant
+- Focus indicators visible
+
+## Security
+
+- Nonce verification on all AJAX calls
+- Capability checks (`manage_options`)
+- Input sanitization
+- Output escaping
+- CSRF protection
+
+## Performance
+
+- Lazy loading for tab content
+- Conditional script loading (only on options page)
+- Optimized AJAX requests
+- Minimal DOM manipulation
+
+## Troubleshooting
+
+### Options not saving
+1. Check WordPress user has `manage_options` capability
+2. Check file permissions
+3. Check for JavaScript errors in browser console
+4. Verify WordPress nonce is valid
+
+### Images not uploading
+1. Check PHP upload_max_filesize setting
+2. Check WordPress media upload permissions
+3. Check browser console for errors
+
+### Import not working
+1. Verify JSON format is valid
+2. Check for special characters in JSON
+3. Ensure JSON is from same theme version
+
+## Version History
+
+### 1.0.0
+- Initial release
+- All basic options implemented
+- Import/Export functionality
+- Reset to defaults
+- Full sanitization

wp-content/themes/apus-theme/inc/admin/TEST-CHECKLIST.md

@@ -0,0 +1,360 @@
+# Theme Options Testing Checklist
+
+## Pre-Testing Setup
+
+- [ ] Activate the Apus Theme
+- [ ] Verify you're logged in as an administrator
+- [ ] Check PHP error_log for any warnings/errors
+- [ ] Open browser console (F12) to check for JavaScript errors
+
+## Admin Panel Access
+
+- [ ] Navigate to `Appearance > Theme Options` in WordPress admin
+- [ ] Verify the page loads without errors
+- [ ] Check that the page title shows "Apus Theme Options"
+- [ ] Verify the version number is displayed (v1.0.0)
+- [ ] Confirm all 5 tabs are visible (General, Content, Performance, Related Posts, Advanced)
+
+## General Tab Testing
+
+### Logo Upload
+- [ ] Click "Upload Logo" button
+- [ ] Verify WordPress media library opens
+- [ ] Upload an image (recommended: 200x60px)
+- [ ] Verify image preview appears
+- [ ] Click "Remove Logo" button
+- [ ] Verify preview disappears and hidden input is cleared
+- [ ] Re-upload logo for further testing
+
+### Favicon Upload
+- [ ] Click "Upload Favicon" button
+- [ ] Upload a favicon image (recommended: 32x32px)
+- [ ] Verify preview appears
+- [ ] Test remove functionality
+
+### Breadcrumbs
+- [ ] Toggle breadcrumbs enable/disable switch
+- [ ] Verify the switch animation works
+- [ ] Change breadcrumb separator (try: >, /, », →)
+- [ ] Save settings
+
+### Date/Time Format
+- [ ] Change date format (try: d/m/Y, m/d/Y, Y-m-d)
+- [ ] Change time format (try: H:i, g:i A)
+- [ ] Save settings
+
+### Copyright Text
+- [ ] Edit copyright text
+- [ ] Try adding HTML (like `<strong>`, `<a>`)
+- [ ] Save and verify HTML is preserved (not stripped)
+
+### Social Media Links
+- [ ] Add Facebook URL
+- [ ] Add Twitter URL
+- [ ] Add Instagram URL
+- [ ] Add LinkedIn URL
+- [ ] Add YouTube URL
+- [ ] Try invalid URLs (should show validation error)
+- [ ] Save valid URLs
+
+## Content Tab Testing
+
+### Excerpt Settings
+- [ ] Change excerpt length (try: 30, 55, 100)
+- [ ] Change excerpt more text (try: ..., [Read more], →)
+- [ ] Save settings
+
+### Layout Settings
+- [ ] Change default post layout (Right Sidebar, Left Sidebar, No Sidebar)
+- [ ] Change default page layout
+- [ ] Save settings
+
+### Archive Settings
+- [ ] Change archive posts per page (try: 10, 20, 0)
+- [ ] Save settings
+
+### Display Options
+- [ ] Toggle "Show Featured Image" on single posts
+- [ ] Toggle "Show Author Box"
+- [ ] Toggle "Enable Comments on Posts"
+- [ ] Toggle "Enable Comments on Pages"
+- [ ] Toggle "Show Post Meta"
+- [ ] Toggle "Show Post Tags"
+- [ ] Toggle "Show Post Categories"
+- [ ] Save settings
+
+## Performance Tab Testing
+
+### Performance Options
+- [ ] Toggle "Enable Lazy Loading"
+- [ ] Toggle "Remove Emoji Scripts"
+- [ ] Toggle "Remove Embeds"
+- [ ] Toggle "Remove Dashicons"
+- [ ] Toggle "Defer JavaScript"
+- [ ] Toggle "Minify HTML"
+- [ ] Toggle "Disable Gutenberg"
+- [ ] Save settings
+- [ ] Verify front-end reflects changes (check page source)
+
+## Related Posts Tab Testing
+
+### Related Posts Configuration
+- [ ] Toggle "Enable Related Posts"
+- [ ] Verify that when disabled, other fields become disabled/grayed out
+- [ ] Enable related posts
+- [ ] Change number of related posts (try: 1, 3, 6, 12)
+- [ ] Change taxonomy (Category, Tag, Both)
+- [ ] Change related posts title
+- [ ] Change columns (2, 3, 4)
+- [ ] Save settings
+
+## Advanced Tab Testing
+
+### Custom CSS
+- [ ] Add custom CSS code (e.g., `body { background: #f0f0f0; }`)
+- [ ] Try adding `<script>` tags (should be removed on save)
+- [ ] Save settings
+- [ ] Check front-end page source for custom CSS in `<head>`
+
+### Custom JavaScript
+- [ ] Add custom JS in header (e.g., `console.log('Header JS');`)
+- [ ] Add custom JS in footer (e.g., `console.log('Footer JS');`)
+- [ ] Try adding `<?php` tags (should be removed)
+- [ ] Save settings
+- [ ] Check front-end page source for scripts
+- [ ] Check browser console for log messages
+
+## Form Validation Testing
+
+### Required Fields
+- [ ] Try saving with empty required fields
+- [ ] Verify error highlighting appears
+- [ ] Verify scroll to first error works
+
+### Number Fields
+- [ ] Try entering values below minimum
+- [ ] Try entering values above maximum
+- [ ] Try entering negative numbers where not allowed
+- [ ] Verify validation works
+
+### URL Fields
+- [ ] Try invalid URLs (e.g., "not a url")
+- [ ] Verify validation shows error
+- [ ] Enter valid URLs
+- [ ] Save successfully
+
+## Import/Export Testing
+
+### Export
+- [ ] Click "Export Options" button
+- [ ] Verify JSON file downloads
+- [ ] Open file and verify it contains valid JSON
+- [ ] Verify all settings are in the export
+
+### Import
+- [ ] Make some changes to settings
+- [ ] Click "Import Options" button
+- [ ] Verify modal opens
+- [ ] Paste invalid JSON (should show error)
+- [ ] Paste valid JSON from export
+- [ ] Click "Import" button
+- [ ] Verify success message appears
+- [ ] Verify page reloads
+- [ ] Confirm settings are restored
+
+## Reset to Defaults Testing
+
+- [ ] Make changes to various settings
+- [ ] Click "Reset to Defaults" button
+- [ ] Verify confirmation dialog appears
+- [ ] Cancel the dialog (settings should remain)
+- [ ] Click "Reset to Defaults" again
+- [ ] Confirm the reset
+- [ ] Verify success message
+- [ ] Verify page reloads
+- [ ] Confirm all settings are back to defaults
+
+## Tab Navigation Testing
+
+### Tab Switching
+- [ ] Click each tab and verify content switches
+- [ ] Verify active tab styling is correct
+- [ ] Check URL hash changes (e.g., #general, #content)
+- [ ] Refresh page with hash in URL
+- [ ] Verify correct tab loads on page load
+- [ ] Use browser back/forward buttons
+- [ ] Verify tabs respond to navigation
+
+## Save Settings Testing
+
+- [ ] Make changes in multiple tabs
+- [ ] Click "Save All Settings" button
+- [ ] Verify success message appears
+- [ ] Refresh page
+- [ ] Verify all changes persisted
+- [ ] Check database (`wp_options` table for `apus_theme_options`)
+
+## Helper Functions Testing
+
+Create a test page template and test each helper function:
+
+```php
+// Test in a template file
+<?php
+// Test logo
+$logo = apus_get_logo_url();
+echo $logo ? 'Logo URL: ' . $logo : 'No logo set';
+
+// Test breadcrumbs
+echo 'Breadcrumbs enabled: ' . (apus_show_breadcrumbs() ? 'Yes' : 'No');
+
+// Test excerpt
+echo 'Excerpt length: ' . apus_get_excerpt_length();
+
+// Test related posts
+echo 'Related posts enabled: ' . (apus_show_related_posts() ? 'Yes' : 'No');
+
+// Test social links
+$social = apus_get_social_links();
+print_r($social);
+
+// Test all options
+$all = apus_get_all_options();
+print_r($all);
+?>
+```
+
+- [ ] Test each helper function returns expected values
+- [ ] Test default values when options not set
+- [ ] Test boolean helper functions return true/false
+- [ ] Test get_option with custom defaults
+
+## Front-End Integration Testing
+
+### Logo Display
+- [ ] Visit front-end site
+- [ ] Verify logo appears in header (if set)
+- [ ] Verify favicon appears in browser tab
+
+### Breadcrumbs
+- [ ] Visit a single post
+- [ ] Verify breadcrumbs appear (if enabled)
+- [ ] Check separator is correct
+- [ ] Visit a category archive
+- [ ] Verify breadcrumbs work correctly
+
+### Related Posts
+- [ ] Visit a single post
+- [ ] Scroll to bottom
+- [ ] Verify related posts appear (if enabled)
+- [ ] Check count matches settings
+- [ ] Verify title matches settings
+- [ ] Check layout columns are correct
+
+### Comments
+- [ ] Visit a post (verify comments shown/hidden based on settings)
+- [ ] Visit a page (verify comments shown/hidden based on settings)
+
+### Performance
+- [ ] Check page source for removed scripts (emoji, embeds, dashicons)
+- [ ] Check if lazy loading is applied to images
+- [ ] Check if custom CSS appears in head
+- [ ] Check if custom JS appears in head/footer
+
+### Social Links
+- [ ] Check footer for social links
+- [ ] Verify all entered links appear
+- [ ] Test links open in new tab
+
+### Copyright
+- [ ] Check footer for copyright text
+- [ ] Verify HTML formatting is preserved
+
+## Responsive Testing
+
+- [ ] Test options page on desktop (1920px)
+- [ ] Test on tablet (768px)
+- [ ] Test on mobile (375px)
+- [ ] Verify tabs switch to mobile layout
+- [ ] Verify forms remain usable
+- [ ] Test all buttons work on mobile
+
+## Browser Compatibility Testing
+
+- [ ] Test in Chrome
+- [ ] Test in Firefox
+- [ ] Test in Safari
+- [ ] Test in Edge
+- [ ] Verify all features work in each browser
+
+## Accessibility Testing
+
+- [ ] Test keyboard navigation (Tab, Enter, Escape)
+- [ ] Test with screen reader (NVDA, JAWS, or VoiceOver)
+- [ ] Verify focus indicators are visible
+- [ ] Check color contrast meets WCAG standards
+- [ ] Verify all images have alt text
+- [ ] Check form labels are properly associated
+
+## Security Testing
+
+- [ ] Verify nonces are checked on all AJAX calls
+- [ ] Test capability checks (log out and try accessing page)
+- [ ] Try injecting `<script>` tags in text fields
+- [ ] Try injecting SQL in fields
+- [ ] Try injecting PHP code in custom CSS/JS
+- [ ] Verify all outputs are escaped
+- [ ] Check CSRF protection works
+
+## Performance Testing
+
+- [ ] Check page load time of options page
+- [ ] Verify no memory leaks in browser
+- [ ] Check network tab for unnecessary requests
+- [ ] Verify scripts/styles only load on options page
+- [ ] Test with large amounts of data in textareas
+
+## Error Handling Testing
+
+- [ ] Disconnect from internet and try saving (should show error)
+- [ ] Modify nonce and try saving (should fail)
+- [ ] Try uploading very large image (should handle gracefully)
+- [ ] Try importing corrupted JSON (should show error)
+- [ ] Fill textarea with 100,000 characters (should save)
+
+## Console Testing
+
+Throughout all testing, monitor for:
+- [ ] JavaScript errors in console
+- [ ] PHP errors in server logs
+- [ ] WordPress debug.log errors
+- [ ] Network errors in Network tab
+- [ ] Deprecation warnings
+
+## Final Verification
+
+- [ ] All settings save correctly
+- [ ] All settings load correctly on page refresh
+- [ ] Front-end reflects all settings changes
+- [ ] No JavaScript errors anywhere
+- [ ] No PHP errors/warnings
+- [ ] No console errors
+- [ ] Page performance is acceptable
+- [ ] Mobile experience is good
+- [ ] Accessibility is maintained
+
+## Sign-Off
+
+Tested by: _______________
+Date: _______________
+Version: 1.0.0
+Browser(s): _______________
+WordPress Version: _______________
+PHP Version: _______________
+
+All tests passed: [ ] Yes [ ] No
+
+Issues found (if any):
+______________________________
+______________________________
+______________________________

wp-content/themes/apus-theme/inc/admin/USAGE-EXAMPLES.php

@@ -0,0 +1,394 @@
+<?php
+/**
+ * Theme Options Usage Examples
+ *
+ * This file contains examples of how to use theme options throughout the theme.
+ * DO NOT include this file in functions.php - it's for reference only.
+ *
+ * @package Apus_Theme
+ * @since 1.0.0
+ */
+
+// Exit if accessed directly
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+/**
+ * EXAMPLE 1: Using options in header.php
+ */
+function example_display_logo() {
+    $logo_url = apus_get_logo_url();
+
+    if ($logo_url) {
+        ?>
+        <a href="<?php echo esc_url(home_url('/')); ?>" class="custom-logo-link">
+            <img src="<?php echo esc_url($logo_url); ?>" alt="<?php bloginfo('name'); ?>" class="custom-logo" />
+        </a>
+        <?php
+    } else {
+        ?>
+        <h1 class="site-title">
+            <a href="<?php echo esc_url(home_url('/')); ?>"><?php bloginfo('name'); ?></a>
+        </h1>
+        <?php
+    }
+}
+
+/**
+ * EXAMPLE 2: Displaying breadcrumbs
+ */
+function example_show_breadcrumbs() {
+    if (apus_show_breadcrumbs() && !is_front_page()) {
+        $separator = apus_get_breadcrumb_separator();
+
+        echo '<nav class="breadcrumbs">';
+        echo '<a href="' . esc_url(home_url('/')) . '">Home</a>';
+        echo ' ' . esc_html($separator) . ' ';
+
+        if (is_single()) {
+            the_category(' ' . esc_html($separator) . ' ');
+            echo ' ' . esc_html($separator) . ' ';
+            the_title();
+        } elseif (is_category()) {
+            single_cat_title();
+        }
+
+        echo '</nav>';
+    }
+}
+
+/**
+ * EXAMPLE 3: Customizing excerpt
+ */
+function example_custom_excerpt_length($length) {
+    return apus_get_excerpt_length();
+}
+add_filter('excerpt_length', 'example_custom_excerpt_length');
+
+function example_custom_excerpt_more($more) {
+    return apus_get_excerpt_more();
+}
+add_filter('excerpt_more', 'example_custom_excerpt_more');
+
+/**
+ * EXAMPLE 4: Displaying related posts in single.php
+ */
+function example_display_related_posts() {
+    if (apus_show_related_posts() && is_single()) {
+        $count = apus_get_related_posts_count();
+        $taxonomy = apus_get_related_posts_taxonomy();
+        $title = apus_get_related_posts_title();
+
+        // Get related posts
+        $post_id = get_the_ID();
+        $args = array(
+            'posts_per_page' => $count,
+            'post__not_in'   => array($post_id),
+        );
+
+        if ($taxonomy === 'category') {
+            $categories = wp_get_post_categories($post_id);
+            if ($categories) {
+                $args['category__in'] = $categories;
+            }
+        } elseif ($taxonomy === 'tag') {
+            $tags = wp_get_post_tags($post_id, array('fields' => 'ids'));
+            if ($tags) {
+                $args['tag__in'] = $tags;
+            }
+        }
+
+        $related = new WP_Query($args);
+
+        if ($related->have_posts()) {
+            ?>
+            <div class="related-posts">
+                <h3><?php echo esc_html($title); ?></h3>
+                <div class="related-posts-grid">
+                    <?php
+                    while ($related->have_posts()) {
+                        $related->the_post();
+                        ?>
+                        <article class="related-post-item">
+                            <?php if (has_post_thumbnail()) : ?>
+                                <a href="<?php the_permalink(); ?>">
+                                    <?php the_post_thumbnail('apus-thumbnail'); ?>
+                                </a>
+                            <?php endif; ?>
+                            <h4>
+                                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
+                            </h4>
+                            <div class="post-meta">
+                                <time datetime="<?php echo get_the_date('c'); ?>">
+                                    <?php echo get_the_date(apus_get_date_format()); ?>
+                                </time>
+                            </div>
+                        </article>
+                        <?php
+                    }
+                    wp_reset_postdata();
+                    ?>
+                </div>
+            </div>
+            <?php
+        }
+    }
+}
+
+/**
+ * EXAMPLE 5: Conditional comments display
+ */
+function example_maybe_show_comments() {
+    if (is_single() && apus_comments_enabled_for_posts()) {
+        comments_template();
+    } elseif (is_page() && apus_comments_enabled_for_pages()) {
+        comments_template();
+    }
+}
+
+/**
+ * EXAMPLE 6: Featured image on single posts
+ */
+function example_display_featured_image() {
+    if (is_single() && apus_show_featured_image_single() && has_post_thumbnail()) {
+        ?>
+        <div class="post-thumbnail">
+            <?php the_post_thumbnail('apus-featured-large'); ?>
+        </div>
+        <?php
+    }
+}
+
+/**
+ * EXAMPLE 7: Author box on single posts
+ */
+function example_display_author_box() {
+    if (is_single() && apus_show_author_box()) {
+        $author_id = get_the_author_meta('ID');
+        ?>
+        <div class="author-box">
+            <div class="author-avatar">
+                <?php echo get_avatar($author_id, 80); ?>
+            </div>
+            <div class="author-info">
+                <h4 class="author-name"><?php the_author(); ?></h4>
+                <p class="author-bio"><?php the_author_meta('description'); ?></p>
+                <a href="<?php echo get_author_posts_url($author_id); ?>" class="author-link">
+                    <?php _e('View all posts', 'apus-theme'); ?>
+                </a>
+            </div>
+        </div>
+        <?php
+    }
+}
+
+/**
+ * EXAMPLE 8: Social media links in footer
+ */
+function example_display_social_links() {
+    $social_links = apus_get_social_links();
+
+    // Filter out empty links
+    $social_links = array_filter($social_links);
+
+    if (!empty($social_links)) {
+        ?>
+        <div class="social-links">
+            <?php foreach ($social_links as $network => $url) : ?>
+                <a href="<?php echo esc_url($url); ?>"
+                   target="_blank"
+                   rel="noopener noreferrer"
+                   class="social-link social-<?php echo esc_attr($network); ?>">
+                    <span class="screen-reader-text"><?php echo ucfirst($network); ?></span>
+                    <i class="icon-<?php echo esc_attr($network); ?>"></i>
+                </a>
+            <?php endforeach; ?>
+        </div>
+        <?php
+    }
+}
+
+/**
+ * EXAMPLE 9: Copyright text in footer
+ */
+function example_display_copyright() {
+    $copyright = apus_get_copyright_text();
+
+    if ($copyright) {
+        echo '<div class="copyright">' . wp_kses_post($copyright) . '</div>';
+    }
+}
+
+/**
+ * EXAMPLE 10: Custom CSS in header
+ */
+function example_add_custom_css() {
+    $custom_css = apus_get_custom_css();
+
+    if ($custom_css) {
+        echo '<style type="text/css">' . "\n";
+        echo strip_tags($custom_css);
+        echo "\n</style>\n";
+    }
+}
+add_action('wp_head', 'example_add_custom_css', 100);
+
+/**
+ * EXAMPLE 11: Custom JS in header
+ */
+function example_add_custom_js_header() {
+    $custom_js = apus_get_custom_js_header();
+
+    if ($custom_js) {
+        echo '<script type="text/javascript">' . "\n";
+        echo $custom_js;
+        echo "\n</script>\n";
+    }
+}
+add_action('wp_head', 'example_add_custom_js_header', 100);
+
+/**
+ * EXAMPLE 12: Custom JS in footer
+ */
+function example_add_custom_js_footer() {
+    $custom_js = apus_get_custom_js_footer();
+
+    if ($custom_js) {
+        echo '<script type="text/javascript">' . "\n";
+        echo $custom_js;
+        echo "\n</script>\n";
+    }
+}
+add_action('wp_footer', 'example_add_custom_js_footer', 100);
+
+/**
+ * EXAMPLE 13: Posts per page for archives
+ */
+function example_set_archive_posts_per_page($query) {
+    if ($query->is_archive() && !is_admin() && $query->is_main_query()) {
+        $posts_per_page = apus_get_archive_posts_per_page();
+        $query->set('posts_per_page', $posts_per_page);
+    }
+}
+add_action('pre_get_posts', 'example_set_archive_posts_per_page');
+
+/**
+ * EXAMPLE 14: Performance optimizations
+ */
+function example_apply_performance_settings() {
+    // Remove emoji scripts
+    if (apus_is_performance_enabled('remove_emoji')) {
+        remove_action('wp_head', 'print_emoji_detection_script', 7);
+        remove_action('wp_print_styles', 'print_emoji_styles');
+    }
+
+    // Remove embeds
+    if (apus_is_performance_enabled('remove_embeds')) {
+        wp_deregister_script('wp-embed');
+    }
+
+    // Remove Dashicons for non-logged users
+    if (apus_is_performance_enabled('remove_dashicons') && !is_user_logged_in()) {
+        wp_deregister_style('dashicons');
+    }
+}
+add_action('wp_enqueue_scripts', 'example_apply_performance_settings', 100);
+
+/**
+ * EXAMPLE 15: Lazy loading images
+ */
+function example_add_lazy_loading($attr, $attachment, $size) {
+    if (apus_is_lazy_loading_enabled()) {
+        $attr['loading'] = 'lazy';
+    }
+    return $attr;
+}
+add_filter('wp_get_attachment_image_attributes', 'example_add_lazy_loading', 10, 3);
+
+/**
+ * EXAMPLE 16: Layout classes based on settings
+ */
+function example_get_layout_class() {
+    $layout = 'right-sidebar'; // default
+
+    if (is_single()) {
+        $layout = apus_get_default_post_layout();
+    } elseif (is_page()) {
+        $layout = apus_get_default_page_layout();
+    }
+
+    return 'layout-' . $layout;
+}
+
+/**
+ * EXAMPLE 17: Display post meta conditionally
+ */
+function example_display_post_meta() {
+    if (!apus_get_option('show_post_meta', true)) {
+        return;
+    }
+
+    ?>
+    <div class="post-meta">
+        <span class="post-date">
+            <time datetime="<?php echo get_the_date('c'); ?>">
+                <?php echo get_the_date(apus_get_date_format()); ?>
+            </time>
+        </span>
+        <span class="post-author">
+            <?php the_author(); ?>
+        </span>
+        <?php if (apus_get_option('show_post_categories', true)) : ?>
+            <span class="post-categories">
+                <?php the_category(', '); ?>
+            </span>
+        <?php endif; ?>
+    </div>
+    <?php
+}
+
+/**
+ * EXAMPLE 18: Display post tags conditionally
+ */
+function example_display_post_tags() {
+    if (is_single() && apus_get_option('show_post_tags', true)) {
+        the_tags('<div class="post-tags">', ', ', '</div>');
+    }
+}
+
+/**
+ * EXAMPLE 19: Get all options (for debugging)
+ */
+function example_debug_all_options() {
+    if (current_user_can('manage_options') && isset($_GET['debug_options'])) {
+        $all_options = apus_get_all_options();
+        echo '<pre>';
+        print_r($all_options);
+        echo '</pre>';
+    }
+}
+add_action('wp_footer', 'example_debug_all_options');
+
+/**
+ * EXAMPLE 20: Check if specific feature is enabled
+ */
+function example_check_feature() {
+    // Multiple ways to check boolean options
+
+    // Method 1: Using helper function
+    if (apus_is_option_enabled('enable_breadcrumbs')) {
+        // Breadcrumbs are enabled
+    }
+
+    // Method 2: Using get_option with default
+    if (apus_get_option('enable_related_posts', true)) {
+        // Related posts are enabled
+    }
+
+    // Method 3: Direct check
+    $options = apus_get_all_options();
+    if (isset($options['enable_lazy_loading']) && $options['enable_lazy_loading']) {
+        // Lazy loading is enabled
+    }
+}

wp-content/themes/apus-theme/inc/admin/options-api.php

@@ -0,0 +1,282 @@
+<?php
+/**
+ * Theme Options Settings API
+ *
+ * @package Apus_Theme
+ * @since 1.0.0
+ */
+
+// Exit if accessed directly
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+/**
+ * Register all theme settings
+ */
+function apus_register_settings() {
+    // Register main options group
+    register_setting(
+        'apus_theme_options_group',
+        'apus_theme_options',
+        array(
+            'sanitize_callback' => 'apus_sanitize_options',
+            'default' => apus_get_default_options(),
+        )
+    );
+
+    // General Settings Section
+    add_settings_section(
+        'apus_general_section',
+        __('General Settings', 'apus-theme'),
+        'apus_general_section_callback',
+        'apus-theme-options'
+    );
+
+    // Content Settings Section
+    add_settings_section(
+        'apus_content_section',
+        __('Content Settings', 'apus-theme'),
+        'apus_content_section_callback',
+        'apus-theme-options'
+    );
+
+    // Performance Settings Section
+    add_settings_section(
+        'apus_performance_section',
+        __('Performance Settings', 'apus-theme'),
+        'apus_performance_section_callback',
+        'apus-theme-options'
+    );
+
+    // Related Posts Settings Section
+    add_settings_section(
+        'apus_related_posts_section',
+        __('Related Posts Settings', 'apus-theme'),
+        'apus_related_posts_section_callback',
+        'apus-theme-options'
+    );
+}
+add_action('admin_init', 'apus_register_settings');
+
+/**
+ * Get default options
+ *
+ * @return array
+ */
+function apus_get_default_options() {
+    return array(
+        // General
+        'site_logo'                     => 0,
+        'site_favicon'                  => 0,
+        'enable_breadcrumbs'            => true,
+        'breadcrumb_separator'          => '>',
+        'date_format'                   => 'd/m/Y',
+        'time_format'                   => 'H:i',
+        'copyright_text'                => sprintf(__('&copy; %s %s. All rights reserved.', 'apus-theme'), date('Y'), get_bloginfo('name')),
+        'social_facebook'               => '',
+        'social_twitter'                => '',
+        'social_instagram'              => '',
+        'social_linkedin'               => '',
+        'social_youtube'                => '',
+
+        // Content
+        'excerpt_length'                => 55,
+        'excerpt_more'                  => '...',
+        'default_post_layout'           => 'right-sidebar',
+        'default_page_layout'           => 'right-sidebar',
+        'archive_posts_per_page'        => 10,
+        'show_featured_image_single'    => true,
+        'show_author_box'               => true,
+        'enable_comments_posts'         => true,
+        'enable_comments_pages'         => false,
+        'show_post_meta'                => true,
+        'show_post_tags'                => true,
+        'show_post_categories'          => true,
+
+        // Performance
+        'enable_lazy_loading'           => true,
+        'performance_remove_emoji'      => true,
+        'performance_remove_embeds'     => false,
+        'performance_remove_dashicons'  => true,
+        'performance_defer_js'          => false,
+        'performance_minify_html'       => false,
+        'performance_disable_gutenberg' => false,
+
+        // Related Posts
+        'enable_related_posts'          => true,
+        'related_posts_count'           => 3,
+        'related_posts_taxonomy'        => 'category',
+        'related_posts_title'           => __('Related Posts', 'apus-theme'),
+        'related_posts_columns'         => 3,
+
+        // Advanced
+        'custom_css'                    => '',
+        'custom_js_header'              => '',
+        'custom_js_footer'              => '',
+    );
+}
+
+/**
+ * Section Callbacks
+ */
+function apus_general_section_callback() {
+    echo '<p>' . __('Configure general theme settings including logo, branding, and social media.', 'apus-theme') . '</p>';
+}
+
+function apus_content_section_callback() {
+    echo '<p>' . __('Configure content display settings for posts, pages, and archives.', 'apus-theme') . '</p>';
+}
+
+function apus_performance_section_callback() {
+    echo '<p>' . __('Optimize your site performance with these settings.', 'apus-theme') . '</p>';
+}
+
+function apus_related_posts_section_callback() {
+    echo '<p>' . __('Configure related posts display on single post pages.', 'apus-theme') . '</p>';
+}
+
+/**
+ * Sanitize all options
+ *
+ * @param array $input The input array
+ * @return array The sanitized array
+ */
+function apus_sanitize_options($input) {
+    $sanitized = array();
+
+    if (!is_array($input)) {
+        return $sanitized;
+    }
+
+    // General Settings
+    $sanitized['site_logo'] = isset($input['site_logo']) ? absint($input['site_logo']) : 0;
+    $sanitized['site_favicon'] = isset($input['site_favicon']) ? absint($input['site_favicon']) : 0;
+    $sanitized['enable_breadcrumbs'] = isset($input['enable_breadcrumbs']) ? (bool) $input['enable_breadcrumbs'] : false;
+    $sanitized['breadcrumb_separator'] = isset($input['breadcrumb_separator']) ? sanitize_text_field($input['breadcrumb_separator']) : '>';
+    $sanitized['date_format'] = isset($input['date_format']) ? sanitize_text_field($input['date_format']) : 'd/m/Y';
+    $sanitized['time_format'] = isset($input['time_format']) ? sanitize_text_field($input['time_format']) : 'H:i';
+    $sanitized['copyright_text'] = isset($input['copyright_text']) ? wp_kses_post($input['copyright_text']) : '';
+
+    // Social Media
+    $social_fields = array('facebook', 'twitter', 'instagram', 'linkedin', 'youtube');
+    foreach ($social_fields as $social) {
+        $key = 'social_' . $social;
+        $sanitized[$key] = isset($input[$key]) ? esc_url_raw($input[$key]) : '';
+    }
+
+    // Content Settings
+    $sanitized['excerpt_length'] = isset($input['excerpt_length']) ? absint($input['excerpt_length']) : 55;
+    $sanitized['excerpt_more'] = isset($input['excerpt_more']) ? sanitize_text_field($input['excerpt_more']) : '...';
+    $sanitized['default_post_layout'] = isset($input['default_post_layout']) ? sanitize_text_field($input['default_post_layout']) : 'right-sidebar';
+    $sanitized['default_page_layout'] = isset($input['default_page_layout']) ? sanitize_text_field($input['default_page_layout']) : 'right-sidebar';
+    $sanitized['archive_posts_per_page'] = isset($input['archive_posts_per_page']) ? absint($input['archive_posts_per_page']) : 10;
+    $sanitized['show_featured_image_single'] = isset($input['show_featured_image_single']) ? (bool) $input['show_featured_image_single'] : false;
+    $sanitized['show_author_box'] = isset($input['show_author_box']) ? (bool) $input['show_author_box'] : false;
+    $sanitized['enable_comments_posts'] = isset($input['enable_comments_posts']) ? (bool) $input['enable_comments_posts'] : false;
+    $sanitized['enable_comments_pages'] = isset($input['enable_comments_pages']) ? (bool) $input['enable_comments_pages'] : false;
+    $sanitized['show_post_meta'] = isset($input['show_post_meta']) ? (bool) $input['show_post_meta'] : false;
+    $sanitized['show_post_tags'] = isset($input['show_post_tags']) ? (bool) $input['show_post_tags'] : false;
+    $sanitized['show_post_categories'] = isset($input['show_post_categories']) ? (bool) $input['show_post_categories'] : false;
+
+    // Performance Settings
+    $sanitized['enable_lazy_loading'] = isset($input['enable_lazy_loading']) ? (bool) $input['enable_lazy_loading'] : false;
+    $sanitized['performance_remove_emoji'] = isset($input['performance_remove_emoji']) ? (bool) $input['performance_remove_emoji'] : false;
+    $sanitized['performance_remove_embeds'] = isset($input['performance_remove_embeds']) ? (bool) $input['performance_remove_embeds'] : false;
+    $sanitized['performance_remove_dashicons'] = isset($input['performance_remove_dashicons']) ? (bool) $input['performance_remove_dashicons'] : false;
+    $sanitized['performance_defer_js'] = isset($input['performance_defer_js']) ? (bool) $input['performance_defer_js'] : false;
+    $sanitized['performance_minify_html'] = isset($input['performance_minify_html']) ? (bool) $input['performance_minify_html'] : false;
+    $sanitized['performance_disable_gutenberg'] = isset($input['performance_disable_gutenberg']) ? (bool) $input['performance_disable_gutenberg'] : false;
+
+    // Related Posts
+    $sanitized['enable_related_posts'] = isset($input['enable_related_posts']) ? (bool) $input['enable_related_posts'] : false;
+    $sanitized['related_posts_count'] = isset($input['related_posts_count']) ? absint($input['related_posts_count']) : 3;
+    $sanitized['related_posts_taxonomy'] = isset($input['related_posts_taxonomy']) ? sanitize_text_field($input['related_posts_taxonomy']) : 'category';
+    $sanitized['related_posts_title'] = isset($input['related_posts_title']) ? sanitize_text_field($input['related_posts_title']) : __('Related Posts', 'apus-theme');
+    $sanitized['related_posts_columns'] = isset($input['related_posts_columns']) ? absint($input['related_posts_columns']) : 3;
+
+    // Advanced Settings
+    $sanitized['custom_css'] = isset($input['custom_css']) ? apus_sanitize_css($input['custom_css']) : '';
+    $sanitized['custom_js_header'] = isset($input['custom_js_header']) ? apus_sanitize_js($input['custom_js_header']) : '';
+    $sanitized['custom_js_footer'] = isset($input['custom_js_footer']) ? apus_sanitize_js($input['custom_js_footer']) : '';
+
+    return $sanitized;
+}
+
+/**
+ * Sanitize CSS
+ *
+ * @param string $css The CSS string
+ * @return string The sanitized CSS
+ */
+function apus_sanitize_css($css) {
+    // Remove <script> tags
+    $css = preg_replace('#<script(.*?)>(.*?)</script>#is', '', $css);
+    // Remove potential PHP code
+    $css = preg_replace('#<\?php(.*?)\?>#is', '', $css);
+    return wp_strip_all_tags($css);
+}
+
+/**
+ * Sanitize JavaScript
+ *
+ * @param string $js The JavaScript string
+ * @return string The sanitized JavaScript
+ */
+function apus_sanitize_js($js) {
+    // Remove <script> tags if present
+    $js = preg_replace('#<script(.*?)>(.*?)</script>#is', '$2', $js);
+    // Remove potential PHP code
+    $js = preg_replace('#<\?php(.*?)\?>#is', '', $js);
+    return trim($js);
+}
+
+/**
+ * Sanitize checkbox input
+ *
+ * @param mixed $input The input value
+ * @return bool
+ */
+function apus_sanitize_checkbox($input) {
+    return (bool) $input;
+}
+
+/**
+ * Sanitize integer input
+ *
+ * @param mixed $input The input value
+ * @return int
+ */
+function apus_sanitize_integer($input) {
+    return absint($input);
+}
+
+/**
+ * Sanitize text field
+ *
+ * @param string $input The input value
+ * @return string
+ */
+function apus_sanitize_text($input) {
+    return sanitize_text_field($input);
+}
+
+/**
+ * Sanitize URL
+ *
+ * @param string $input The input value
+ * @return string
+ */
+function apus_sanitize_url($input) {
+    return esc_url_raw($input);
+}
+
+/**
+ * Sanitize HTML content
+ *
+ * @param string $input The input value
+ * @return string
+ */
+function apus_sanitize_html($input) {
+    return wp_kses_post($input);
+}

wp-content/themes/apus-theme/inc/admin/options-page-template.php

@@ -0,0 +1,661 @@
+<?php
+/**
+ * Theme Options Page Template
+ *
+ * @package Apus_Theme
+ * @since 1.0.0
+ */
+
+// Exit if accessed directly
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+// Get current options
+$options = get_option('apus_theme_options', apus_get_default_options());
+?>
+
+<div class="wrap apus-theme-options">
+    <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
+
+    <div class="apus-options-header">
+        <div class="apus-options-logo">
+            <h2><?php _e('Apus Theme', 'apus-theme'); ?></h2>
+            <span class="version"><?php echo 'v' . APUS_VERSION; ?></span>
+        </div>
+        <div class="apus-options-actions">
+            <button type="button" class="button button-secondary" id="apus-export-options">
+                <span class="dashicons dashicons-download"></span>
+                <?php _e('Export Options', 'apus-theme'); ?>
+            </button>
+            <button type="button" class="button button-secondary" id="apus-import-options">
+                <span class="dashicons dashicons-upload"></span>
+                <?php _e('Import Options', 'apus-theme'); ?>
+            </button>
+            <button type="button" class="button button-secondary" id="apus-reset-options">
+                <span class="dashicons dashicons-image-rotate"></span>
+                <?php _e('Reset to Defaults', 'apus-theme'); ?>
+            </button>
+        </div>
+    </div>
+
+    <form method="post" action="options.php" class="apus-options-form">
+        <?php
+        settings_fields('apus_theme_options_group');
+        ?>
+
+        <div class="apus-options-container">
+            <!-- Tabs Navigation -->
+            <div class="apus-tabs-nav">
+                <ul>
+                    <li class="active">
+                        <a href="#general" data-tab="general">
+                            <span class="dashicons dashicons-admin-settings"></span>
+                            <?php _e('General', 'apus-theme'); ?>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#content" data-tab="content">
+                            <span class="dashicons dashicons-edit-page"></span>
+                            <?php _e('Content', 'apus-theme'); ?>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#performance" data-tab="performance">
+                            <span class="dashicons dashicons-performance"></span>
+                            <?php _e('Performance', 'apus-theme'); ?>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#related-posts" data-tab="related-posts">
+                            <span class="dashicons dashicons-admin-links"></span>
+                            <?php _e('Related Posts', 'apus-theme'); ?>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#advanced" data-tab="advanced">
+                            <span class="dashicons dashicons-admin-tools"></span>
+                            <?php _e('Advanced', 'apus-theme'); ?>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+
+            <!-- Tabs Content -->
+            <div class="apus-tabs-content">
+
+                <!-- General Tab -->
+                <div id="general" class="apus-tab-pane active">
+                    <h2><?php _e('General Settings', 'apus-theme'); ?></h2>
+                    <p class="description"><?php _e('Configure general theme settings including logo, branding, and social media.', 'apus-theme'); ?></p>
+
+                    <table class="form-table">
+                        <!-- Site Logo -->
+                        <tr>
+                            <th scope="row">
+                                <label for="site_logo"><?php _e('Site Logo', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <div class="apus-image-upload">
+                                    <input type="hidden" name="apus_theme_options[site_logo]" id="site_logo" value="<?php echo esc_attr($options['site_logo'] ?? 0); ?>" class="apus-image-id" />
+                                    <div class="apus-image-preview">
+                                        <?php
+                                        $logo_id = $options['site_logo'] ?? 0;
+                                        if ($logo_id) {
+                                            echo wp_get_attachment_image($logo_id, 'medium', false, array('class' => 'apus-preview-image'));
+                                        }
+                                        ?>
+                                    </div>
+                                    <button type="button" class="button apus-upload-image"><?php _e('Upload Logo', 'apus-theme'); ?></button>
+                                    <button type="button" class="button apus-remove-image" <?php echo (!$logo_id ? 'style="display:none;"' : ''); ?>><?php _e('Remove Logo', 'apus-theme'); ?></button>
+                                    <p class="description"><?php _e('Upload your site logo. Recommended size: 200x60px', 'apus-theme'); ?></p>
+                                </div>
+                            </td>
+                        </tr>
+
+                        <!-- Site Favicon -->
+                        <tr>
+                            <th scope="row">
+                                <label for="site_favicon"><?php _e('Site Favicon', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <div class="apus-image-upload">
+                                    <input type="hidden" name="apus_theme_options[site_favicon]" id="site_favicon" value="<?php echo esc_attr($options['site_favicon'] ?? 0); ?>" class="apus-image-id" />
+                                    <div class="apus-image-preview">
+                                        <?php
+                                        $favicon_id = $options['site_favicon'] ?? 0;
+                                        if ($favicon_id) {
+                                            echo wp_get_attachment_image($favicon_id, 'thumbnail', false, array('class' => 'apus-preview-image'));
+                                        }
+                                        ?>
+                                    </div>
+                                    <button type="button" class="button apus-upload-image"><?php _e('Upload Favicon', 'apus-theme'); ?></button>
+                                    <button type="button" class="button apus-remove-image" <?php echo (!$favicon_id ? 'style="display:none;"' : ''); ?>><?php _e('Remove Favicon', 'apus-theme'); ?></button>
+                                    <p class="description"><?php _e('Upload your site favicon. Recommended size: 32x32px or 64x64px', 'apus-theme'); ?></p>
+                                </div>
+                            </td>
+                        </tr>
+
+                        <!-- Enable Breadcrumbs -->
+                        <tr>
+                            <th scope="row">
+                                <label for="enable_breadcrumbs"><?php _e('Enable Breadcrumbs', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[enable_breadcrumbs]" id="enable_breadcrumbs" value="1" <?php checked(isset($options['enable_breadcrumbs']) ? $options['enable_breadcrumbs'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Show breadcrumbs navigation on pages and posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Breadcrumb Separator -->
+                        <tr>
+                            <th scope="row">
+                                <label for="breadcrumb_separator"><?php _e('Breadcrumb Separator', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="text" name="apus_theme_options[breadcrumb_separator]" id="breadcrumb_separator" value="<?php echo esc_attr($options['breadcrumb_separator'] ?? '>'); ?>" class="regular-text" />
+                                <p class="description"><?php _e('Character or symbol to separate breadcrumb items (e.g., >, /, »)', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Date Format -->
+                        <tr>
+                            <th scope="row">
+                                <label for="date_format"><?php _e('Date Format', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="text" name="apus_theme_options[date_format]" id="date_format" value="<?php echo esc_attr($options['date_format'] ?? 'd/m/Y'); ?>" class="regular-text" />
+                                <p class="description"><?php _e('PHP date format (e.g., d/m/Y, m/d/Y, Y-m-d)', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Time Format -->
+                        <tr>
+                            <th scope="row">
+                                <label for="time_format"><?php _e('Time Format', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="text" name="apus_theme_options[time_format]" id="time_format" value="<?php echo esc_attr($options['time_format'] ?? 'H:i'); ?>" class="regular-text" />
+                                <p class="description"><?php _e('PHP time format (e.g., H:i, g:i A)', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Copyright Text -->
+                        <tr>
+                            <th scope="row">
+                                <label for="copyright_text"><?php _e('Copyright Text', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <textarea name="apus_theme_options[copyright_text]" id="copyright_text" rows="3" class="large-text"><?php echo esc_textarea($options['copyright_text'] ?? sprintf(__('&copy; %s %s. All rights reserved.', 'apus-theme'), date('Y'), get_bloginfo('name'))); ?></textarea>
+                                <p class="description"><?php _e('Footer copyright text. HTML allowed.', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+                    </table>
+
+                    <h3><?php _e('Social Media Links', 'apus-theme'); ?></h3>
+                    <table class="form-table">
+                        <!-- Facebook -->
+                        <tr>
+                            <th scope="row">
+                                <label for="social_facebook"><?php _e('Facebook URL', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="url" name="apus_theme_options[social_facebook]" id="social_facebook" value="<?php echo esc_url($options['social_facebook'] ?? ''); ?>" class="regular-text" placeholder="https://facebook.com/yourpage" />
+                            </td>
+                        </tr>
+
+                        <!-- Twitter -->
+                        <tr>
+                            <th scope="row">
+                                <label for="social_twitter"><?php _e('Twitter URL', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="url" name="apus_theme_options[social_twitter]" id="social_twitter" value="<?php echo esc_url($options['social_twitter'] ?? ''); ?>" class="regular-text" placeholder="https://twitter.com/youraccount" />
+                            </td>
+                        </tr>
+
+                        <!-- Instagram -->
+                        <tr>
+                            <th scope="row">
+                                <label for="social_instagram"><?php _e('Instagram URL', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="url" name="apus_theme_options[social_instagram]" id="social_instagram" value="<?php echo esc_url($options['social_instagram'] ?? ''); ?>" class="regular-text" placeholder="https://instagram.com/youraccount" />
+                            </td>
+                        </tr>
+
+                        <!-- LinkedIn -->
+                        <tr>
+                            <th scope="row">
+                                <label for="social_linkedin"><?php _e('LinkedIn URL', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="url" name="apus_theme_options[social_linkedin]" id="social_linkedin" value="<?php echo esc_url($options['social_linkedin'] ?? ''); ?>" class="regular-text" placeholder="https://linkedin.com/company/yourcompany" />
+                            </td>
+                        </tr>
+
+                        <!-- YouTube -->
+                        <tr>
+                            <th scope="row">
+                                <label for="social_youtube"><?php _e('YouTube URL', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="url" name="apus_theme_options[social_youtube]" id="social_youtube" value="<?php echo esc_url($options['social_youtube'] ?? ''); ?>" class="regular-text" placeholder="https://youtube.com/yourchannel" />
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+
+                <!-- Content Tab -->
+                <div id="content" class="apus-tab-pane">
+                    <h2><?php _e('Content Settings', 'apus-theme'); ?></h2>
+                    <p class="description"><?php _e('Configure content display settings for posts, pages, and archives.', 'apus-theme'); ?></p>
+
+                    <table class="form-table">
+                        <!-- Excerpt Length -->
+                        <tr>
+                            <th scope="row">
+                                <label for="excerpt_length"><?php _e('Excerpt Length', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="number" name="apus_theme_options[excerpt_length]" id="excerpt_length" value="<?php echo esc_attr($options['excerpt_length'] ?? 55); ?>" class="small-text" min="10" max="500" />
+                                <p class="description"><?php _e('Number of words to show in excerpt', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Excerpt More -->
+                        <tr>
+                            <th scope="row">
+                                <label for="excerpt_more"><?php _e('Excerpt More Text', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="text" name="apus_theme_options[excerpt_more]" id="excerpt_more" value="<?php echo esc_attr($options['excerpt_more'] ?? '...'); ?>" class="regular-text" />
+                                <p class="description"><?php _e('Text to append at the end of excerpts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Default Post Layout -->
+                        <tr>
+                            <th scope="row">
+                                <label for="default_post_layout"><?php _e('Default Post Layout', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <select name="apus_theme_options[default_post_layout]" id="default_post_layout">
+                                    <option value="right-sidebar" <?php selected($options['default_post_layout'] ?? 'right-sidebar', 'right-sidebar'); ?>><?php _e('Right Sidebar', 'apus-theme'); ?></option>
+                                    <option value="left-sidebar" <?php selected($options['default_post_layout'] ?? 'right-sidebar', 'left-sidebar'); ?>><?php _e('Left Sidebar', 'apus-theme'); ?></option>
+                                    <option value="no-sidebar" <?php selected($options['default_post_layout'] ?? 'right-sidebar', 'no-sidebar'); ?>><?php _e('No Sidebar (Full Width)', 'apus-theme'); ?></option>
+                                </select>
+                                <p class="description"><?php _e('Default layout for single posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Default Page Layout -->
+                        <tr>
+                            <th scope="row">
+                                <label for="default_page_layout"><?php _e('Default Page Layout', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <select name="apus_theme_options[default_page_layout]" id="default_page_layout">
+                                    <option value="right-sidebar" <?php selected($options['default_page_layout'] ?? 'right-sidebar', 'right-sidebar'); ?>><?php _e('Right Sidebar', 'apus-theme'); ?></option>
+                                    <option value="left-sidebar" <?php selected($options['default_page_layout'] ?? 'right-sidebar', 'left-sidebar'); ?>><?php _e('Left Sidebar', 'apus-theme'); ?></option>
+                                    <option value="no-sidebar" <?php selected($options['default_page_layout'] ?? 'right-sidebar', 'no-sidebar'); ?>><?php _e('No Sidebar (Full Width)', 'apus-theme'); ?></option>
+                                </select>
+                                <p class="description"><?php _e('Default layout for pages', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Archive Posts Per Page -->
+                        <tr>
+                            <th scope="row">
+                                <label for="archive_posts_per_page"><?php _e('Archive Posts Per Page', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="number" name="apus_theme_options[archive_posts_per_page]" id="archive_posts_per_page" value="<?php echo esc_attr($options['archive_posts_per_page'] ?? 10); ?>" class="small-text" min="1" max="100" />
+                                <p class="description"><?php _e('Number of posts to show on archive pages. Set to 0 to use WordPress default.', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Show Featured Image on Single Posts -->
+                        <tr>
+                            <th scope="row">
+                                <label for="show_featured_image_single"><?php _e('Show Featured Image', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[show_featured_image_single]" id="show_featured_image_single" value="1" <?php checked(isset($options['show_featured_image_single']) ? $options['show_featured_image_single'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Display featured image at the top of single posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Show Author Box -->
+                        <tr>
+                            <th scope="row">
+                                <label for="show_author_box"><?php _e('Show Author Box', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[show_author_box]" id="show_author_box" value="1" <?php checked(isset($options['show_author_box']) ? $options['show_author_box'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Display author information box on single posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Enable Comments on Posts -->
+                        <tr>
+                            <th scope="row">
+                                <label for="enable_comments_posts"><?php _e('Enable Comments on Posts', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[enable_comments_posts]" id="enable_comments_posts" value="1" <?php checked(isset($options['enable_comments_posts']) ? $options['enable_comments_posts'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Allow comments on blog posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Enable Comments on Pages -->
+                        <tr>
+                            <th scope="row">
+                                <label for="enable_comments_pages"><?php _e('Enable Comments on Pages', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[enable_comments_pages]" id="enable_comments_pages" value="1" <?php checked(isset($options['enable_comments_pages']) ? $options['enable_comments_pages'] : false, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Allow comments on pages', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Show Post Meta -->
+                        <tr>
+                            <th scope="row">
+                                <label for="show_post_meta"><?php _e('Show Post Meta', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[show_post_meta]" id="show_post_meta" value="1" <?php checked(isset($options['show_post_meta']) ? $options['show_post_meta'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Display post meta information (date, author, etc.)', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Show Post Tags -->
+                        <tr>
+                            <th scope="row">
+                                <label for="show_post_tags"><?php _e('Show Post Tags', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[show_post_tags]" id="show_post_tags" value="1" <?php checked(isset($options['show_post_tags']) ? $options['show_post_tags'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Display tags on single posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Show Post Categories -->
+                        <tr>
+                            <th scope="row">
+                                <label for="show_post_categories"><?php _e('Show Post Categories', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[show_post_categories]" id="show_post_categories" value="1" <?php checked(isset($options['show_post_categories']) ? $options['show_post_categories'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Display categories on single posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+
+                <!-- Performance Tab -->
+                <div id="performance" class="apus-tab-pane">
+                    <h2><?php _e('Performance Settings', 'apus-theme'); ?></h2>
+                    <p class="description"><?php _e('Optimize your site performance with these settings. Be careful when enabling these options.', 'apus-theme'); ?></p>
+
+                    <table class="form-table">
+                        <!-- Enable Lazy Loading -->
+                        <tr>
+                            <th scope="row">
+                                <label for="enable_lazy_loading"><?php _e('Enable Lazy Loading', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[enable_lazy_loading]" id="enable_lazy_loading" value="1" <?php checked(isset($options['enable_lazy_loading']) ? $options['enable_lazy_loading'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Enable lazy loading for images to improve page load times', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Remove Emoji Scripts -->
+                        <tr>
+                            <th scope="row">
+                                <label for="performance_remove_emoji"><?php _e('Remove Emoji Scripts', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[performance_remove_emoji]" id="performance_remove_emoji" value="1" <?php checked(isset($options['performance_remove_emoji']) ? $options['performance_remove_emoji'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Remove WordPress emoji scripts and styles (reduces HTTP requests)', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Remove Embeds -->
+                        <tr>
+                            <th scope="row">
+                                <label for="performance_remove_embeds"><?php _e('Remove Embeds', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[performance_remove_embeds]" id="performance_remove_embeds" value="1" <?php checked(isset($options['performance_remove_embeds']) ? $options['performance_remove_embeds'] : false, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Remove WordPress embed scripts if you don\'t use oEmbed', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Remove Dashicons on Frontend -->
+                        <tr>
+                            <th scope="row">
+                                <label for="performance_remove_dashicons"><?php _e('Remove Dashicons', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[performance_remove_dashicons]" id="performance_remove_dashicons" value="1" <?php checked(isset($options['performance_remove_dashicons']) ? $options['performance_remove_dashicons'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Remove Dashicons from frontend for non-logged in users', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Defer JavaScript -->
+                        <tr>
+                            <th scope="row">
+                                <label for="performance_defer_js"><?php _e('Defer JavaScript', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[performance_defer_js]" id="performance_defer_js" value="1" <?php checked(isset($options['performance_defer_js']) ? $options['performance_defer_js'] : false, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Add defer attribute to JavaScript files (may break some scripts)', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Minify HTML -->
+                        <tr>
+                            <th scope="row">
+                                <label for="performance_minify_html"><?php _e('Minify HTML', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[performance_minify_html]" id="performance_minify_html" value="1" <?php checked(isset($options['performance_minify_html']) ? $options['performance_minify_html'] : false, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Minify HTML output to reduce page size', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Disable Gutenberg -->
+                        <tr>
+                            <th scope="row">
+                                <label for="performance_disable_gutenberg"><?php _e('Disable Gutenberg', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[performance_disable_gutenberg]" id="performance_disable_gutenberg" value="1" <?php checked(isset($options['performance_disable_gutenberg']) ? $options['performance_disable_gutenberg'] : false, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Disable Gutenberg editor and revert to classic editor', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+
+                <!-- Related Posts Tab -->
+                <div id="related-posts" class="apus-tab-pane">
+                    <h2><?php _e('Related Posts Settings', 'apus-theme'); ?></h2>
+                    <p class="description"><?php _e('Configure related posts display on single post pages.', 'apus-theme'); ?></p>
+
+                    <table class="form-table">
+                        <!-- Enable Related Posts -->
+                        <tr>
+                            <th scope="row">
+                                <label for="enable_related_posts"><?php _e('Enable Related Posts', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <label class="apus-switch">
+                                    <input type="checkbox" name="apus_theme_options[enable_related_posts]" id="enable_related_posts" value="1" <?php checked(isset($options['enable_related_posts']) ? $options['enable_related_posts'] : true, true); ?> />
+                                    <span class="apus-slider"></span>
+                                </label>
+                                <p class="description"><?php _e('Show related posts at the end of single posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Related Posts Count -->
+                        <tr>
+                            <th scope="row">
+                                <label for="related_posts_count"><?php _e('Number of Related Posts', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="number" name="apus_theme_options[related_posts_count]" id="related_posts_count" value="<?php echo esc_attr($options['related_posts_count'] ?? 3); ?>" class="small-text" min="1" max="12" />
+                                <p class="description"><?php _e('How many related posts to display', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Related Posts Taxonomy -->
+                        <tr>
+                            <th scope="row">
+                                <label for="related_posts_taxonomy"><?php _e('Relate Posts By', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <select name="apus_theme_options[related_posts_taxonomy]" id="related_posts_taxonomy">
+                                    <option value="category" <?php selected($options['related_posts_taxonomy'] ?? 'category', 'category'); ?>><?php _e('Category', 'apus-theme'); ?></option>
+                                    <option value="tag" <?php selected($options['related_posts_taxonomy'] ?? 'category', 'tag'); ?>><?php _e('Tag', 'apus-theme'); ?></option>
+                                    <option value="both" <?php selected($options['related_posts_taxonomy'] ?? 'category', 'both'); ?>><?php _e('Category and Tag', 'apus-theme'); ?></option>
+                                </select>
+                                <p class="description"><?php _e('How to determine related posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Related Posts Title -->
+                        <tr>
+                            <th scope="row">
+                                <label for="related_posts_title"><?php _e('Related Posts Title', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <input type="text" name="apus_theme_options[related_posts_title]" id="related_posts_title" value="<?php echo esc_attr($options['related_posts_title'] ?? __('Related Posts', 'apus-theme')); ?>" class="regular-text" />
+                                <p class="description"><?php _e('Title to display above related posts section', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Related Posts Columns -->
+                        <tr>
+                            <th scope="row">
+                                <label for="related_posts_columns"><?php _e('Columns', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <select name="apus_theme_options[related_posts_columns]" id="related_posts_columns">
+                                    <option value="2" <?php selected($options['related_posts_columns'] ?? 3, 2); ?>><?php _e('2 Columns', 'apus-theme'); ?></option>
+                                    <option value="3" <?php selected($options['related_posts_columns'] ?? 3, 3); ?>><?php _e('3 Columns', 'apus-theme'); ?></option>
+                                    <option value="4" <?php selected($options['related_posts_columns'] ?? 3, 4); ?>><?php _e('4 Columns', 'apus-theme'); ?></option>
+                                </select>
+                                <p class="description"><?php _e('Number of columns to display related posts', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+
+                <!-- Advanced Tab -->
+                <div id="advanced" class="apus-tab-pane">
+                    <h2><?php _e('Advanced Settings', 'apus-theme'); ?></h2>
+                    <p class="description"><?php _e('Advanced customization options. Use with caution.', 'apus-theme'); ?></p>
+
+                    <table class="form-table">
+                        <!-- Custom CSS -->
+                        <tr>
+                            <th scope="row">
+                                <label for="custom_css"><?php _e('Custom CSS', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <textarea name="apus_theme_options[custom_css]" id="custom_css" rows="10" class="large-text code"><?php echo esc_textarea($options['custom_css'] ?? ''); ?></textarea>
+                                <p class="description"><?php _e('Add custom CSS code. This will be added to the &lt;head&gt; section.', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Custom JS Header -->
+                        <tr>
+                            <th scope="row">
+                                <label for="custom_js_header"><?php _e('Custom JavaScript (Header)', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <textarea name="apus_theme_options[custom_js_header]" id="custom_js_header" rows="10" class="large-text code"><?php echo esc_textarea($options['custom_js_header'] ?? ''); ?></textarea>
+                                <p class="description"><?php _e('Add custom JavaScript code. This will be added to the &lt;head&gt; section. Do not include &lt;script&gt; tags.', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+
+                        <!-- Custom JS Footer -->
+                        <tr>
+                            <th scope="row">
+                                <label for="custom_js_footer"><?php _e('Custom JavaScript (Footer)', 'apus-theme'); ?></label>
+                            </th>
+                            <td>
+                                <textarea name="apus_theme_options[custom_js_footer]" id="custom_js_footer" rows="10" class="large-text code"><?php echo esc_textarea($options['custom_js_footer'] ?? ''); ?></textarea>
+                                <p class="description"><?php _e('Add custom JavaScript code. This will be added before the closing &lt;/body&gt; tag. Do not include &lt;script&gt; tags.', 'apus-theme'); ?></p>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+
+            </div>
+        </div>
+
+        <?php submit_button(__('Save All Settings', 'apus-theme'), 'primary large', 'submit', true); ?>
+    </form>
+</div>
+
+<!-- Import Modal -->
+<div id="apus-import-modal" class="apus-modal" style="display:none;">
+    <div class="apus-modal-content">
+        <span class="apus-modal-close">&times;</span>
+        <h2><?php _e('Import Options', 'apus-theme'); ?></h2>
+        <p><?php _e('Paste your exported options JSON here:', 'apus-theme'); ?></p>
+        <textarea id="apus-import-data" rows="10" class="large-text code"></textarea>
+        <p>
+            <button type="button" class="button button-primary" id="apus-import-submit"><?php _e('Import', 'apus-theme'); ?></button>
+            <button type="button" class="button" id="apus-import-cancel"><?php _e('Cancel', 'apus-theme'); ?></button>
+        </p>
+    </div>
+</div>

wp-content/themes/apus-theme/inc/admin/related-posts-options.php

@@ -0,0 +1,272 @@
+<?php
+/**
+ * Related Posts Configuration Options
+ *
+ * This file provides helper functions and documentation for configuring
+ * related posts functionality via WordPress options.
+ *
+ * @package Apus_Theme
+ * @since 1.0.0
+ */
+
+// Exit if accessed directly
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+/**
+ * Get all related posts options with their current values
+ *
+ * @return array Array of options with their values
+ */
+function apus_get_related_posts_options() {
+    return array(
+        'enabled' => array(
+            'key'     => 'apus_related_posts_enabled',
+            'value'   => get_option('apus_related_posts_enabled', true),
+            'type'    => 'boolean',
+            'default' => true,
+            'label'   => __('Enable Related Posts', 'apus-theme'),
+            'description' => __('Show related posts section at the end of single posts', 'apus-theme'),
+        ),
+        'title' => array(
+            'key'     => 'apus_related_posts_title',
+            'value'   => get_option('apus_related_posts_title', __('Related Posts', 'apus-theme')),
+            'type'    => 'text',
+            'default' => __('Related Posts', 'apus-theme'),
+            'label'   => __('Section Title', 'apus-theme'),
+            'description' => __('Title displayed above related posts', 'apus-theme'),
+        ),
+        'count' => array(
+            'key'     => 'apus_related_posts_count',
+            'value'   => get_option('apus_related_posts_count', 3),
+            'type'    => 'number',
+            'default' => 3,
+            'min'     => 1,
+            'max'     => 12,
+            'label'   => __('Number of Posts', 'apus-theme'),
+            'description' => __('Maximum number of related posts to display', 'apus-theme'),
+        ),
+        'columns' => array(
+            'key'     => 'apus_related_posts_columns',
+            'value'   => get_option('apus_related_posts_columns', 3),
+            'type'    => 'select',
+            'default' => 3,
+            'options' => array(
+                1 => __('1 Column', 'apus-theme'),
+                2 => __('2 Columns', 'apus-theme'),
+                3 => __('3 Columns', 'apus-theme'),
+                4 => __('4 Columns', 'apus-theme'),
+            ),
+            'label'   => __('Grid Columns', 'apus-theme'),
+            'description' => __('Number of columns in the grid layout (responsive)', 'apus-theme'),
+        ),
+        'show_excerpt' => array(
+            'key'     => 'apus_related_posts_show_excerpt',
+            'value'   => get_option('apus_related_posts_show_excerpt', true),
+            'type'    => 'boolean',
+            'default' => true,
+            'label'   => __('Show Excerpt', 'apus-theme'),
+            'description' => __('Display post excerpt in related posts cards', 'apus-theme'),
+        ),
+        'excerpt_length' => array(
+            'key'     => 'apus_related_posts_excerpt_length',
+            'value'   => get_option('apus_related_posts_excerpt_length', 20),
+            'type'    => 'number',
+            'default' => 20,
+            'min'     => 5,
+            'max'     => 100,
+            'label'   => __('Excerpt Length', 'apus-theme'),
+            'description' => __('Number of words in the excerpt', 'apus-theme'),
+        ),
+        'show_date' => array(
+            'key'     => 'apus_related_posts_show_date',
+            'value'   => get_option('apus_related_posts_show_date', true),
+            'type'    => 'boolean',
+            'default' => true,
+            'label'   => __('Show Date', 'apus-theme'),
+            'description' => __('Display publication date in related posts', 'apus-theme'),
+        ),
+        'show_category' => array(
+            'key'     => 'apus_related_posts_show_category',
+            'value'   => get_option('apus_related_posts_show_category', true),
+            'type'    => 'boolean',
+            'default' => true,
+            'label'   => __('Show Category', 'apus-theme'),
+            'description' => __('Display category badge on related posts', 'apus-theme'),
+        ),
+        'bg_colors' => array(
+            'key'     => 'apus_related_posts_bg_colors',
+            'value'   => get_option('apus_related_posts_bg_colors', array(
+                '#1a73e8', '#e91e63', '#4caf50', '#ff9800', '#9c27b0', '#00bcd4',
+            )),
+            'type'    => 'color_array',
+            'default' => array(
+                '#1a73e8', // Blue
+                '#e91e63', // Pink
+                '#4caf50', // Green
+                '#ff9800', // Orange
+                '#9c27b0', // Purple
+                '#00bcd4', // Cyan
+            ),
+            'label'   => __('Background Colors', 'apus-theme'),
+            'description' => __('Colors used for posts without featured images', 'apus-theme'),
+        ),
+    );
+}
+
+/**
+ * Update a related posts option
+ *
+ * @param string $option_key The option key (without 'apus_related_posts_' prefix)
+ * @param mixed  $value The new value
+ * @return bool True if updated successfully
+ */
+function apus_update_related_posts_option($option_key, $value) {
+    $full_key = 'apus_related_posts_' . $option_key;
+    return update_option($full_key, $value);
+}
+
+/**
+ * Reset related posts options to defaults
+ *
+ * @return bool True if reset successfully
+ */
+function apus_reset_related_posts_options() {
+    $options = apus_get_related_posts_options();
+    $success = true;
+
+    foreach ($options as $option) {
+        if (!update_option($option['key'], $option['default'])) {
+            $success = false;
+        }
+    }
+
+    return $success;
+}
+
+/**
+ * Example: Programmatically configure related posts
+ *
+ * This function shows how to configure related posts options programmatically.
+ * You can call this from your functions.php or a plugin.
+ *
+ * @return void
+ */
+function apus_example_configure_related_posts() {
+    // Example usage - uncomment to use:
+
+    // Enable related posts
+    // update_option('apus_related_posts_enabled', true);
+
+    // Set custom title
+    // update_option('apus_related_posts_title', __('You Might Also Like', 'apus-theme'));
+
+    // Show 4 related posts
+    // update_option('apus_related_posts_count', 4);
+
+    // Use 2 columns layout
+    // update_option('apus_related_posts_columns', 2);
+
+    // Show excerpt with 30 words
+    // update_option('apus_related_posts_show_excerpt', true);
+    // update_option('apus_related_posts_excerpt_length', 30);
+
+    // Show date and category
+    // update_option('apus_related_posts_show_date', true);
+    // update_option('apus_related_posts_show_category', true);
+
+    // Custom background colors for posts without images
+    // update_option('apus_related_posts_bg_colors', array(
+    //     '#FF6B6B', // Red
+    //     '#4ECDC4', // Teal
+    //     '#45B7D1', // Blue
+    //     '#FFA07A', // Coral
+    //     '#98D8C8', // Mint
+    //     '#F7DC6F', // Yellow
+    // ));
+}
+
+/**
+ * Filter hook example: Modify related posts query
+ *
+ * This example shows how to customize the related posts query.
+ * Add this to your functions.php or child theme.
+ */
+function apus_example_modify_related_posts_query($args, $post_id) {
+    // Example: Order by date instead of random
+    // $args['orderby'] = 'date';
+    // $args['order'] = 'DESC';
+
+    // Example: Only show posts from the last 6 months
+    // $args['date_query'] = array(
+    //     array(
+    //         'after' => '6 months ago',
+    //     ),
+    // );
+
+    // Example: Exclude specific category
+    // $args['category__not_in'] = array(5); // Replace 5 with category ID
+
+    return $args;
+}
+// add_filter('apus_related_posts_args', 'apus_example_modify_related_posts_query', 10, 2);
+
+/**
+ * Get documentation for related posts configuration
+ *
+ * @return array Documentation array
+ */
+function apus_get_related_posts_documentation() {
+    return array(
+        'overview' => array(
+            'title' => __('Related Posts Overview', 'apus-theme'),
+            'content' => __(
+                'The related posts feature automatically displays relevant posts at the end of each blog post. ' .
+                'Posts are related based on shared categories and displayed in a responsive Bootstrap grid.',
+                'apus-theme'
+            ),
+        ),
+        'features' => array(
+            'title' => __('Key Features', 'apus-theme'),
+            'items' => array(
+                __('Automatic category-based matching', 'apus-theme'),
+                __('Responsive Bootstrap 5 grid layout', 'apus-theme'),
+                __('Configurable number of posts and columns', 'apus-theme'),
+                __('Support for posts with and without featured images', 'apus-theme'),
+                __('Beautiful color backgrounds for posts without images', 'apus-theme'),
+                __('Customizable excerpt length', 'apus-theme'),
+                __('Optional display of dates and categories', 'apus-theme'),
+                __('Smooth hover animations', 'apus-theme'),
+                __('Print-friendly styles', 'apus-theme'),
+                __('Dark mode support', 'apus-theme'),
+            ),
+        ),
+        'configuration' => array(
+            'title' => __('How to Configure', 'apus-theme'),
+            'methods' => array(
+                'database' => array(
+                    'title' => __('Via WordPress Options API', 'apus-theme'),
+                    'code' => "update_option('apus_related_posts_enabled', true);\nupdate_option('apus_related_posts_count', 4);",
+                ),
+                'filter' => array(
+                    'title' => __('Via Filter Hook', 'apus-theme'),
+                    'code' => "add_filter('apus_related_posts_args', function(\$args, \$post_id) {\n    \$args['posts_per_page'] = 6;\n    return \$args;\n}, 10, 2);",
+                ),
+            ),
+        ),
+        'customization' => array(
+            'title' => __('Customization Examples', 'apus-theme'),
+            'examples' => array(
+                array(
+                    'title' => __('Change title and layout', 'apus-theme'),
+                    'code' => "update_option('apus_related_posts_title', 'También te puede interesar');\nupdate_option('apus_related_posts_columns', 4);",
+                ),
+                array(
+                    'title' => __('Customize colors', 'apus-theme'),
+                    'code' => "update_option('apus_related_posts_bg_colors', array(\n    '#FF6B6B',\n    '#4ECDC4',\n    '#45B7D1'\n));",
+                ),
+            ),
+        ),
+    );
+}

wp-content/themes/apus-theme/inc/admin/theme-options.php

@@ -0,0 +1,214 @@
+<?php
+/**
+ * Theme Options Admin Page
+ *
+ * @package Apus_Theme
+ * @since 1.0.0
+ */
+
+// Exit if accessed directly
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+/**
+ * Add admin menu
+ */
+function apus_add_admin_menu() {
+    add_theme_page(
+        __('Apus Theme Options', 'apus-theme'),        // Page title
+        __('Theme Options', 'apus-theme'),             // Menu title
+        'manage_options',                               // Capability
+        'apus-theme-options',                           // Menu slug
+        'apus_render_options_page',                     // Callback function
+        30                                              // Position
+    );
+}
+add_action('admin_menu', 'apus_add_admin_menu');
+
+/**
+ * Render the options page
+ */
+function apus_render_options_page() {
+    // Check user capabilities
+    if (!current_user_can('manage_options')) {
+        wp_die(__('You do not have sufficient permissions to access this page.', 'apus-theme'));
+    }
+
+    // Load the template
+    include get_template_directory() . '/inc/admin/options-page-template.php';
+}
+
+/**
+ * Enqueue admin scripts and styles
+ */
+function apus_enqueue_admin_scripts($hook) {
+    // Only load on our theme options page
+    if ($hook !== 'appearance_page_apus-theme-options') {
+        return;
+    }
+
+    // Enqueue WordPress media uploader
+    wp_enqueue_media();
+
+    // Enqueue admin styles
+    wp_enqueue_style(
+        'apus-admin-options',
+        get_template_directory_uri() . '/assets/admin/css/theme-options.css',
+        array(),
+        APUS_VERSION
+    );
+
+    // Enqueue admin scripts
+    wp_enqueue_script(
+        'apus-admin-options',
+        get_template_directory_uri() . '/assets/admin/js/theme-options.js',
+        array('jquery', 'wp-color-picker'),
+        APUS_VERSION,
+        true
+    );
+
+    // Localize script
+    wp_localize_script('apus-admin-options', 'apusAdminOptions', array(
+        'ajaxUrl'           => admin_url('admin-ajax.php'),
+        'nonce'             => wp_create_nonce('apus_admin_nonce'),
+        'strings'           => array(
+            'selectImage'   => __('Select Image', 'apus-theme'),
+            'useImage'      => __('Use Image', 'apus-theme'),
+            'removeImage'   => __('Remove Image', 'apus-theme'),
+            'confirmReset'  => __('Are you sure you want to reset all options to default values? This cannot be undone.', 'apus-theme'),
+            'saved'         => __('Settings saved successfully!', 'apus-theme'),
+            'error'         => __('An error occurred while saving settings.', 'apus-theme'),
+        ),
+    ));
+}
+add_action('admin_enqueue_scripts', 'apus_enqueue_admin_scripts');
+
+/**
+ * Add settings link to theme actions
+ */
+function apus_add_settings_link($links) {
+    $settings_link = '<a href="' . admin_url('themes.php?page=apus-theme-options') . '">' . __('Settings', 'apus-theme') . '</a>';
+    array_unshift($links, $settings_link);
+    return $links;
+}
+add_filter('theme_action_links_' . get_template(), 'apus_add_settings_link');
+
+/**
+ * AJAX handler for resetting options
+ */
+function apus_reset_options_ajax() {
+    check_ajax_referer('apus_admin_nonce', 'nonce');
+
+    if (!current_user_can('manage_options')) {
+        wp_send_json_error(array('message' => __('Insufficient permissions.', 'apus-theme')));
+    }
+
+    // Delete options to reset to defaults
+    delete_option('apus_theme_options');
+
+    wp_send_json_success(array('message' => __('Options reset to defaults successfully.', 'apus-theme')));
+}
+add_action('wp_ajax_apus_reset_options', 'apus_reset_options_ajax');
+
+/**
+ * AJAX handler for exporting options
+ */
+function apus_export_options_ajax() {
+    check_ajax_referer('apus_admin_nonce', 'nonce');
+
+    if (!current_user_can('manage_options')) {
+        wp_send_json_error(array('message' => __('Insufficient permissions.', 'apus-theme')));
+    }
+
+    $options = get_option('apus_theme_options', array());
+
+    wp_send_json_success(array(
+        'data' => json_encode($options, JSON_PRETTY_PRINT),
+        'filename' => 'apus-theme-options-' . date('Y-m-d') . '.json'
+    ));
+}
+add_action('wp_ajax_apus_export_options', 'apus_export_options_ajax');
+
+/**
+ * AJAX handler for importing options
+ */
+function apus_import_options_ajax() {
+    check_ajax_referer('apus_admin_nonce', 'nonce');
+
+    if (!current_user_can('manage_options')) {
+        wp_send_json_error(array('message' => __('Insufficient permissions.', 'apus-theme')));
+    }
+
+    if (!isset($_POST['import_data'])) {
+        wp_send_json_error(array('message' => __('No import data provided.', 'apus-theme')));
+    }
+
+    $import_data = json_decode(stripslashes($_POST['import_data']), true);
+
+    if (json_last_error() !== JSON_ERROR_NONE) {
+        wp_send_json_error(array('message' => __('Invalid JSON data.', 'apus-theme')));
+    }
+
+    // Sanitize imported data
+    $sanitized_data = apus_sanitize_options($import_data);
+
+    // Update options
+    update_option('apus_theme_options', $sanitized_data);
+
+    wp_send_json_success(array('message' => __('Options imported successfully.', 'apus-theme')));
+}
+add_action('wp_ajax_apus_import_options', 'apus_import_options_ajax');
+
+/**
+ * Add admin notices
+ */
+function apus_admin_notices() {
+    $screen = get_current_screen();
+    if ($screen->id !== 'appearance_page_apus-theme-options') {
+        return;
+    }
+
+    // Check if settings were updated
+    if (isset($_GET['settings-updated']) && $_GET['settings-updated'] === 'true') {
+        ?>
+        <div class="notice notice-success is-dismissible">
+            <p><?php _e('Settings saved successfully!', 'apus-theme'); ?></p>
+        </div>
+        <?php
+    }
+}
+add_action('admin_notices', 'apus_admin_notices');
+
+/**
+ * Register theme options in Customizer as well (for preview)
+ */
+function apus_customize_register($wp_customize) {
+    // Add a panel for theme options
+    $wp_customize->add_panel('apus_theme_options', array(
+        'title'       => __('Apus Theme Options', 'apus-theme'),
+        'description' => __('Configure theme options (Also available in Theme Options page)', 'apus-theme'),
+        'priority'    => 10,
+    ));
+
+    // General Section
+    $wp_customize->add_section('apus_general', array(
+        'title'    => __('General Settings', 'apus-theme'),
+        'panel'    => 'apus_theme_options',
+        'priority' => 10,
+    ));
+
+    // Enable breadcrumbs
+    $wp_customize->add_setting('apus_theme_options[enable_breadcrumbs]', array(
+        'default'           => true,
+        'type'              => 'option',
+        'sanitize_callback' => 'apus_sanitize_checkbox',
+    ));
+
+    $wp_customize->add_control('apus_theme_options[enable_breadcrumbs]', array(
+        'label'   => __('Enable Breadcrumbs', 'apus-theme'),
+        'section' => 'apus_general',
+        'type'    => 'checkbox',
+    ));
+}
+add_action('customize_register', 'apus_customize_register');