### Install Bootscore Theme via Composer

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Installs the Bootscore theme using Composer, a dependency manager for PHP. This method is recommended for development environments and integrates well with modern PHP workflows.

```bash
composer require bootscore/bootscore
```

--------------------------------

### Install Bootscore Theme via Wget

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Installs the Bootscore theme by downloading the ZIP archive from GitHub using wget, then unzipping and moving it to the themes directory. This method is suitable for server environments where direct file access is available.

```bash
cd /path/to/wp-content/themes/
wget https://github.com/bootscore/bootscore/archive/main.zip
unzip main.zip
mv bootscore-main bootscore
```

--------------------------------

### Install Bootscore Theme via Git Clone

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Installs the Bootscore theme by cloning the official GitHub repository directly into the WordPress themes directory. This is a common method for developers who want to work with the theme's source code.

```bash
cd /path/to/wp-content/themes/
git clone https://github.com/bootscore/bootscore.git
```

--------------------------------

### Bootstrap Integration with WordPress

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/README.md

Details Bootstrap framework fundamentals and its integration into WordPress themes. Covers the grid system, components, utilities, and responsive design patterns with practical examples.

```APIDOC
Bootstrap Integration with WordPress:
  Purpose: Guides on integrating the Bootstrap 5 framework into WordPress themes.
  Topics Covered:
    - Bootstrap 5 framework overview: architecture, grid system, components, utilities.
    - Three methods for integrating Bootstrap into WordPress themes.
    - Bootstrap-enhanced WordPress templates (e.g., navbar, navigation walker).
    - Responsive design patterns and mobile-first approach.
    - SASS customization techniques for Bootstrap.
    - Creating custom Bootstrap components within WordPress.
    - Best practices for performance, accessibility, and WordPress integration.
  Dependencies: Bootstrap framework, WordPress theme.
  Usage: Apply Bootstrap classes and components within WordPress theme templates and PHP functions.
  Limitations: Requires understanding of both Bootstrap and WordPress templating.
  References: [twbs/bootstrap](https://github.com/twbs/bootstrap)
```

--------------------------------

### Custom Header Functionality Example

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Illustrates a conceptual approach to adding custom header functionality directly in code, contrasting with using theme customizer options. This highlights Bootscore's 'code over configuration' philosophy.

```php
// Instead of customizer options
function my_custom_header() {
    // Add custom header functionality
}
```

--------------------------------

### Install Bootstrap via NPM and Import SCSS

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Demonstrates installing Bootstrap using NPM and importing its SCSS files into a custom stylesheet. This method is suitable for projects requiring custom Bootstrap theming and a build process.

```bash
npm install bootstrap
```

```scss
// Import Bootstrap
@import "../../node_modules/bootstrap/scss/bootstrap";

// Custom styles
.my-custom-class {
  // Your styles here
}
```

--------------------------------

### Activate Bootscore Theme Programmatically

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Activates the Bootscore theme programmatically using the WordPress switch_theme function. This can be used within theme setup functions or custom scripts for automated theme switching.

```php
// WordPress admin or programmatically
switch_theme('bootscore');
```

--------------------------------

### PHP: WordPress Theme Setup and Enqueueing

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

The `functions.php` file is used to add theme-specific functionality, support for features like post thumbnails and HTML5, register navigation menus, enqueue scripts and styles, and define widget areas.

```php
<?php
/**
 * Theme setup and initialization
 */
function your_theme_setup() {
    // Add theme support for various features
    add_theme_support('post-thumbnails');
    add_theme_support('automatic-feed-links');
    add_theme_support('title-tag');
    add_theme_support('html5', array(
        'search-form',
        'comment-form',
        'comment-list',
        'gallery',
        'caption',
    ));
    
    // Register navigation menus
    register_nav_menus(array(
        'primary' => __('Primary Menu', 'textdomain'),
        'footer'  => __('Footer Menu', 'textdomain'),
    ));
}
add_action('after_setup_theme', 'your_theme_setup');

/**
 * Enqueue scripts and styles
 */
function your_theme_scripts() {
    wp_enqueue_style('theme-style', get_stylesheet_uri());
    wp_enqueue_script('theme-script', get_template_directory_uri() . '/assets/js/main.js', array('jquery'), '1.0.0', true);
}
add_action('wp_enqueue_scripts', 'your_theme_scripts');

/**
 * Register widget areas
 */
function your_theme_widgets_init() {
    register_sidebar(array(
        'name'          => __('Primary Sidebar', 'textdomain'),
        'id'            => 'sidebar-1',
        'description'   => __('Add widgets here.', 'textdomain'),
        'before_widget' => '<section id="%1$s" class="widget %2$s">',
        'after_widget'  => '</section>',
        'before_title'  => '<h2 class="widget-title">',
        'after_title'   => '</h2>',
    ));
}
add_action('widgets_init', 'your_theme_widgets_init');
```

--------------------------------

### Bootstrap Grid System Basics (HTML)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Provides a fundamental example of Bootstrap's grid system, which is based on flexbox and supports up to 12 columns. This snippet shows how to create rows and columns to structure content responsively.

```html
<div class="container">
  <div class="row">
    <div class="col-md-8">
      <h1>Main Content</h1>
      <p>This column takes 8/12 of the width on medium screens and up.</p>
    </div>
    <div class="col-md-4">
      <h2>Sidebar</h2>
      <p>This column takes 4/12 of the width on medium screens and up.</p>
    </div>
  </div>
</div>
```

--------------------------------

### Implement Performance Best Practices (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Provides examples of performance optimization techniques in WordPress. This snippet demonstrates conditional script loading, where a specific script is enqueued only on a particular page ('contact' page in this case) to reduce unnecessary loading and improve page speed.

```php
// Conditional script loading
function load_scripts_conditionally() {
    if (is_page('contact')) {
        wp_enqueue_script('contact-form');
    }
}
add_action('wp_enqueue_scripts', 'load_scripts_conditionally');

```

--------------------------------

### Bootstrap Card Component Example (HTML)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Demonstrates the basic structure of a Bootstrap card component, a versatile content container. Cards can include headers, footers, images, text, and action links, making them ideal for displaying related content.

```html
<div class="card">
  <img src="..." class="card-img-top" alt="...">
  <div class="card-body">
    <h5 class="card-title">Card title</h5>
    <p class="card-text">Some quick example text to build on the card title.</p>
    <a href="#" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
```

--------------------------------

### Define Custom Color Variable Example

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Demonstrates defining a custom color variable directly in PHP code, aligning with Bootscore's preference for code-based configuration over admin interfaces. This is an alternative to using SCSS variables for simple color definitions.

```php
// Instead of theme options
$custom_color = '#your-color'; // Define in code
```

--------------------------------

### Bootstrap Spacing Utilities

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Illustrates Bootstrap's spacing utility classes for managing margins and padding. Examples show applying spacing on all sides, specific sides (top), and auto margins for centering.

```html
<!-- Margin -->
<div class="m-4">Margin on all sides</div>
<div class="mt-3">Margin top</div>
<div class="mx-auto">Horizontal margin auto</div>

<!-- Padding -->
<div class="p-3">Padding on all sides</div>
<div class="py-4">Padding top and bottom</div>
```

--------------------------------

### Bootstrap Basic Navbar

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Provides an HTML example of a basic responsive navigation bar using Bootstrap's navbar components. It includes a brand link, a toggler button for mobile views, and a collapsible navigation menu.

```html
<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <div class="container-fluid">
    <a class="navbar-brand" href="#">Navbar</a>
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav">
        <li class="nav-item">
          <a class="nav-link active" href="#">Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#">About</a>
        </li>
      </ul>
    </div>
  </div>
</nav>
```

--------------------------------

### Bootstrap Display Utilities

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Showcases Bootstrap's display utility classes for controlling element rendering. Examples include hiding elements, setting them to block, flex, or grid containers.

```html
<div class="d-none">Hidden element</div>
<div class="d-block">Block element</div>
<div class="d-flex">Flex container</div>
<div class="d-grid">Grid container</div>
```

--------------------------------

### Custom SCSS Utility Classes

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/04-sass-compiler.md

Defines custom SCSS utility classes for spacing, background gradients, patterns, and animations. Includes examples for WordPress image block styling.

```scss
// _custom.scss - Custom utility classes

// Spacing utilities
.py-6 { padding-top: 4rem; padding-bottom: 4rem; }
.py-7 { padding-top: 5rem; padding-bottom: 5rem; }
.py-8 { padding-top: 6rem; padding-bottom: 6rem; }

// Background utilities
.bg-gradient-primary {
  background: linear-gradient(45deg, $primary, lighten($primary, 10%));
}

.bg-pattern {
  background-image: url('data:image/svg+xml,<svg...>');
  background-repeat: repeat;
}

// Animation utilities
.fade-in {
  animation: fadeIn 0.5s ease-in;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

// WordPress-specific utilities
.wp-block-image {
  img {
    @extend .img-fluid;
  }
  
  &.is-style-rounded {
    img {
      border-radius: $border-radius-lg;
    }
  }
}
```

--------------------------------

### Custom SCSS for Components

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/04-sass-compiler.md

Provides examples of creating custom SCSS for specific components, such as a custom button style with gradients and hover effects, and integrating with WordPress block styles using `@extend`.

```scss
// components/_buttons.scss - Custom button styles

.btn-custom {
  background: linear-gradient(45deg, $primary, $secondary);
  border: none;
  color: white;
  transition: all 0.3s ease;
  
  &:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  }
  
  &.btn-lg {
    padding: 1rem 2rem;
    font-size: 1.2rem;
  }
}

// WordPress-specific button styles
.wp-block-button {
  .wp-block-button__link {
    @extend .btn;
    @extend .btn-primary;
  }
  
  &.is-style-outline {
    .wp-block-button__link {
      @extend .btn-outline-primary;
    }
  }
}
```

--------------------------------

### Creating Custom WordPress Components with SCSS

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Demonstrates how to create custom WordPress-specific components using Bootstrap's extendable classes (`@extend`). This example defines styles for a post card and a sidebar widget, inheriting and customizing Bootstrap's card and other utilities.

```scss
// Custom WordPress-specific components

.wp-post-card {
  @extend .card;
  
  .wp-post-thumbnail {
    @extend .card-img-top;
  }
  
  .wp-post-content {
    @extend .card-body;
  }
  
  .wp-post-title {
    @extend .card-title;
    @extend .h5;
  }
  
  .wp-post-excerpt {
    @extend .card-text;
  }
  
  .wp-post-meta {
    @extend .card-footer;
    @extend .bg-transparent;
    font-size: 0.875rem;
    color: $text-muted;
  }
}

.wp-sidebar-widget {
  @extend .card;
  @extend .mb-4;
  
  .widget-title {
    @extend .card-header;
    @extend .h6;
    @extend .mb-0;
  }
  
  .widget-content {
    @extend .card-body;
  }
}
```

--------------------------------

### Responsive Grid Layout (HTML)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Demonstrates Bootstrap's responsive grid system, stacking columns on mobile and arranging them side-by-side on larger screens. This example shows a two-column layout where content takes full width on mobile and splits into 8/12 and 4/12 on medium screens and up.

```html
<!-- Stack vertically on mobile, side by side on larger screens -->
<div class="row">
    <div class="col-12 col-md-8">
        <h1>Main Content</h1>
        <p>This content will be full width on mobile and 8/12 width on medium screens and up.</p>
    </div>
    <div class="col-12 col-md-4">
        <h2>Sidebar</h2>
        <p>This sidebar will be full width on mobile and 4/12 width on medium screens and up.</p>
    </div>
</div>
```

--------------------------------

### Download Theme from GitHub (Bash)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Provides the command-line instructions to download the Bootscore theme directly from its GitHub repository. This method is suitable for users familiar with Git or command-line operations.

```bash
git clone https://github.com/bootscore/bootscore.git
cd bootscore
# Then upload the 'bootscore' directory to /wp-content/themes/
```

--------------------------------

### Contribute to Bootscore Theme

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Provides the command-line steps for contributing to the Bootscore theme on GitHub. This includes forking the repository, cloning it locally, creating a feature branch, making changes, committing, and pushing for a pull request.

```git
# Fork the repository
git clone https://github.com/your-username/bootscore.git
cd bootscore

# Create feature branch
git checkout -b feature/new-feature

# Make changes and commit
git commit -m "Add new feature"

# Push and create pull request
git push origin feature/new-feature
```

--------------------------------

### WordPress Theme Development Fundamentals

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/README.md

Covers essential WordPress theme creation knowledge, including theme structure, core files (style.css, functions.php), template hierarchy, and WordPress APIs like Customizer and CPTs.

```APIDOC
WordPress Theme Development Fundamentals:
  Purpose: Provides foundational knowledge for creating WordPress themes.
  Topics Covered:
    - Theme structure and requirements
    - Core theme files: style.css, functions.php, index.php, etc.
    - Template hierarchy and file naming conventions
    - WordPress APIs: Customizer API, Post Types, Taxonomies, Widgets API
    - Theme support features and declarations (e.g., `add_theme_support()`)
    - Best practices: Security, performance, accessibility, internationalization (i18n)
  Dependencies: WordPress installation.
  Usage: Essential knowledge for any WordPress theme developer.
  Limitations: Focuses on core WordPress, specific theme frameworks may add complexity.
  References: [WordPress/WordPress](https://github.com/WordPress/WordPress), [WordPress/wordpress-develop](https://github.com/WordPress/wordpress-develop)
```

--------------------------------

### Create a Child Theme for Bootscore

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Sets up a child theme for Bootscore, which is recommended for making customizations without altering the parent theme files. This involves creating a style.css file to declare the parent theme and a functions.php file to enqueue the parent stylesheet.

```php
<?php
// child-theme/style.css
/*
Template: bootscore
Theme Name: Bootscore Child
Version: 1.0
*/

// child-theme/functions.php
<?php
function bootscore_child_enqueue_styles() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
}
add_action('wp_enqueue_scripts', 'bootscore_child_enqueue_styles');
```

--------------------------------

### Bootscore Theme Architecture Overview

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Illustrates the core components and their integration within the Bootscore WordPress theme. It highlights the relationship between WordPress Core, Bootstrap 5, and the built-in SASS Compiler.

```text
Bootscore Theme
├── WordPress Core Integration
│   ├── Template Hierarchy
│   ├── Hooks & Filters
│   ├── WordPress APIs
│   └── Theme Support Features
├── Bootstrap 5 Framework
│   ├── Grid System
│   ├── Components
│   ├── Utilities
│   └── JavaScript Modules
└── Built-in SASS Compiler
    ├── SCSS Processing
    ├── Bootstrap Customization
    ├── Auto-compilation
    └── Production Optimization
```

--------------------------------

### PHP: WordPress Theme Setup for Bootstrap Compatibility

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Configures WordPress theme support for HTML5 elements and responsive embeds, and enables wide alignment. This ensures better compatibility and integration with Bootstrap's styling and layout features.

```php
// Ensure Bootstrap doesn't conflict with WordPress styles
function bootstrap_theme_setup() {
    // Remove default WordPress styles that conflict with Bootstrap
    add_theme_support('html5', array(
        'search-form',
        'comment-form',
        'comment-list',
        'gallery',
        'caption',
    ));
    
    // Add theme support for responsive embeds
    add_theme_support('responsive-embeds');
    
    // Add theme support for wide alignment
    add_theme_support('align-wide');
}
add_action('after_setup_theme', 'bootstrap_theme_setup');
```

--------------------------------

### Bootscore SASS Compiler Overview

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/README.md

Details Bootscore's unique PHP-based SASS compilation system, eliminating the need for Node.js, Gulp, or other build tools. Covers SCSS file structure, compilation process, development workflow, and customization techniques.

```APIDOC
Bootscore SASS Compiler:
  Purpose: Compiles SCSS files into CSS using PHP, removing build tool dependencies.
  Features:
    - PHP-based compilation
    - No Node.js, Gulp, or Webpack required
    - SCSS file structure and organization
    - Step-by-step compilation process
    - Development workflow (live compilation, file watching)
    - Bootstrap variable customization
    - Custom SCSS techniques
    - Production vs. development modes
    - Troubleshooting and debug tools
    - Dynamic SCSS generation
    - Hot reloading
  Dependencies: PHP environment.
  Usage: Typically integrated into the theme's build or development process managed by Bootscore itself.
  Limitations: Relies on the PHP environment's capabilities for compilation speed and features.
  Related: Bootstrap integration, theme customization.
```

--------------------------------

### Customizing Bootstrap with SASS Variables (SCSS)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Provides an example of a custom SCSS file for overriding Bootstrap's default SASS variables. This allows for easy theming by modifying colors, typography, grid breakpoints, and container widths before importing Bootstrap.

```scss
// _custom-variables.scss

// Color system
$primary: #007bff;
$secondary: #6c757d;
$success: #28a745;
$info: #17a2b8;
$warning: #ffc107;
$danger: #dc3545;
$light: #f8f9fa;
$dark: #343a40;

// Typography
$font-family-sans-serif: "Helvetica Neue", Arial, sans-serif;
$font-size-base: 1rem;
$line-height-base: 1.5;

// Grid breakpoints
$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px
);

// Container max widths
$container-max-widths: (
  sm: 540px,
  md: 720px,
  lg: 960px,
  xl: 1140px,
  xxl: 1320px
);

// Import Bootstrap
@import "bootstrap";
```

--------------------------------

### Bootstrap 5 SCSS Integration and Customization

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Illustrates how to integrate and customize Bootstrap 5 within the theme's SCSS files. It shows overriding default Bootstrap variables and importing the Bootstrap source files, followed by adding custom styles.

```scss
// Override Bootstrap variables
$primary: #your-color;
$secondary: #your-secondary-color;

// Import Bootstrap
@import "bootstrap/bootstrap";

// Add custom styles
.your-custom-class {
    // Your styles here
}
```

--------------------------------

### PHP: Basic WordPress Index Template

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

The `index.php` file serves as the fallback template for displaying posts when no more specific template is found. It uses WordPress loop functions to fetch and display post titles, excerpts, and navigation.

```php
<?php get_header(); ?>

<main id="main" class="site-main">
    <?php if (have_posts()) : ?>
        <?php while (have_posts()) : the_post(); ?>
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <div class="entry-content">
                    <?php the_excerpt(); ?>
                </div>
            </article>
        <?php endwhile; ?>
        
        <?php the_posts_navigation(); ?>
    <?php else : ?>
        <p><?php esc_html_e('No posts found.', 'textdomain'); ?></p>
    <?php endif; ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>
```

--------------------------------

### Automatic SCSS Compilation (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Demonstrates the theme's built-in PHP functionality for automatically compiling SCSS files into CSS. It utilizes the ScssPhp library to process the main SCSS file and write the output to style.css, enabling dynamic styling updates.

```php
function bootscore_compile_scss() {
    $scss_file = get_template_directory() . '/scss/style.scss';
    $css_file = get_template_directory() . '/style.css';
    
    // Compile SCSS to CSS automatically
    if (file_exists($scss_file)) {
        $compiler = new ScssPhp\ScssPhp\Compiler();
        $compiled_css = $compiler->compile(file_get_contents($scss_file));
        file_put_contents($css_file, $compiled_css);
    }
}
```

--------------------------------

### Responsive Images (HTML)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Shows how to make images responsive using Bootstrap's 'img-fluid' class, ensuring they scale nicely across different screen sizes. It also demonstrates creating an image container with a fixed aspect ratio using Bootstrap's 'ratio' utility.

```html
<!-- Responsive image -->
<img src="image.jpg" class="img-fluid" alt="Responsive image">

<!-- Image with specific aspect ratio -->
<div class="ratio ratio-16x9">
    <img src="image.jpg" alt="16:9 aspect ratio image">
</div>
```

--------------------------------

### Customize WooCommerce with Bootscore Hooks

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/05-woocommerce-integration.md

This PHP code snippet demonstrates how to customize WooCommerce functionality using Bootscore-specific hooks. It includes examples for removing default styles, implementing custom breadcrumbs, modifying product display, and customizing the add-to-cart button and checkout fields. These customizations leverage WordPress's add_filter and add_action to modify WooCommerce's behavior.

```php
// Customize WooCommerce with Bootscore-specific hooks
function bootscore_woocommerce_customizations() {
    // Remove default WooCommerce styles
    add_filter('woocommerce_enqueue_styles', '__return_empty_array');
    
    // Custom breadcrumb
    remove_action('woocommerce_before_main_content', 'woocommerce_breadcrumb', 20);
    add_action('woocommerce_before_main_content', 'bootscore_custom_breadcrumb', 20);
    
    // Remove sidebar from shop pages
    remove_action('woocommerce_sidebar', 'woocommerce_get_sidebar', 10);
    
    // Custom product gallery
    remove_action('woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20);
    add_action('woocommerce_before_single_product_summary', 'bootscore_product_gallery', 20);
    
    // Custom add to cart button
    remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);
    add_action('woocommerce_single_product_summary', 'bootscore_custom_add_to_cart', 30);
    
    // Custom checkout fields
    add_filter('woocommerce_checkout_fields', 'bootscore_custom_checkout_fields');
    
    // Custom cart item removal
    add_action('wp_ajax_woocommerce_remove_cart_item', 'bootscore_ajax_remove_cart_item');
    add_action('wp_ajax_nopriv_woocommerce_remove_cart_item', 'bootscore_ajax_remove_cart_item');
}
add_action('init', 'bootscore_woocommerce_customizations');

// Custom breadcrumb
function bootscore_custom_breadcrumb() {
    if (is_woocommerce()) {
        echo '<nav aria-label="breadcrumb" class="woocommerce-breadcrumb-wrapper mb-4">';
        echo '<ol class="breadcrumb">';
        
        $breadcrumbs = wc_get_breadcrumb();
        $last_key = array_key_last($breadcrumbs);
        
        foreach ($breadcrumbs as $key => $breadcrumb) {
            if ($key === $last_key) {
                echo '<li class="breadcrumb-item active" aria-current="page">' . esc_html($breadcrumb[0]) . '</li>';
            } else {
                echo '<li class="breadcrumb-item"><a href="' . esc_url($breadcrumb[1]) . '">' . esc_html($breadcrumb[0]) . '</a></li>';
            }
        }
        
        echo '</ol>';
        echo '</nav>';
    }
}

// Custom checkout fields
function bootscore_custom_checkout_fields($fields) {
    // Add Bootstrap classes to all fields
    foreach ($fields as $fieldset_key => $fieldset) {
        foreach ($fieldset as $field_key => $field) {
            $fields[$fieldset_key][$field_key]['class'][] = 'form-group';
            $fields[$fieldset_key][$field_key]['input_class'][] = 'form-control';
        }
    }
    
    // Custom field modifications
    $fields['billing']['billing_first_name']['class'] = array('col-md-6');
    $fields['billing']['billing_last_name']['class'] = array('col-md-6');
    $fields['billing']['billing_email']['class'] = array('col-md-6');
    $fields['billing']['billing_phone']['class'] = array('col-md-6');
    
    return $fields;
}

```

--------------------------------

### Bootscore WooCommerce Integration

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/README.md

Explains Bootscore's comprehensive WooCommerce support, providing Bootstrap-styled templates for e-commerce functionality. Covers AJAX cart, product pages, shop archives, checkout, and account page customizations.

```APIDOC
Bootscore WooCommerce Integration:
  Purpose: Integrates WooCommerce with Bootstrap 5 styling and Bootscore theme features.
  Features:
    - Complete WooCommerce template structure
    - AJAX cart system with off-canvas functionality
    - Real-time cart updates
    - Bootstrap-styled product pages, shop archives, checkout, and account pages
    - Customization hooks and filters for WooCommerce
    - Performance optimization, security, and accessibility best practices
  Dependencies: WooCommerce plugin, Bootscore theme.
  Usage: Install WooCommerce and activate Bootscore theme. Customizations are made via theme files and hooks.
  Limitations: Requires understanding of both WooCommerce and WordPress theme development.
  Related: Bootscore theme architecture, WordPress theme development fundamentals.
```

--------------------------------

### Internationalization and Text Domain Loading

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Sets up internationalization for a WordPress theme by loading the text domain. This allows the theme to be translated into different languages using translation files, ensuring all user-facing strings are properly managed.

```php
// Load text domain
function your_theme_load_textdomain() {
    load_theme_textdomain('textdomain', get_template_directory() . '/languages');
}
add_action('after_setup_theme', 'your_theme_load_textdomain');

// Translatable strings
_e('Hello World', 'textdomain');
echo __('Translated text', 'textdomain');
printf(__('Hello %s', 'textdomain'), $name);
```

--------------------------------

### WordPress Custom Post Types API (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Explains how to register custom post types (CPTs) to manage specialized content like portfolios or products. The `register_post_type` function is used, requiring an array of arguments defining labels, public visibility, archive support, and features like title and editor. This is hooked into the 'init' action.

```php
function create_portfolio_post_type() {
    register_post_type('portfolio',
        array(
            'labels' => array(
                'name' => __('Portfolio'),
                'singular_name' => __('Portfolio Item')
            ),
            'public' => true,
            'has_archive' => true,
            'supports' => array('title', 'editor', 'thumbnail'),
            'menu_icon' => 'dashicons-portfolio'
        )
    );
}
add_action('init', 'create_portfolio_post_type');

```

--------------------------------

### Declare WordPress Theme Support Features (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Illustrates how to declare support for various WordPress features within a theme. This is done using `add_theme_support()` calls within a function hooked to the 'after_setup_theme' action. Supported features include post thumbnails, custom image sizes, HTML5 markup, custom logos, headers, backgrounds, and editor styles.

```php
function your_theme_setup() {
    // Featured images
    add_theme_support('post-thumbnails');
    
    // Custom image sizes
    add_image_size('hero-image', 1200, 600, true);
    
    // Automatic feed links
    add_theme_support('automatic-feed-links');
    
    // HTML5 markup
    add_theme_support('html5', array(
        'search-form',
        'comment-form',
        'comment-list',
        'gallery',
        'caption'
    ));
    
    // Custom logo
    add_theme_support('custom-logo', array(
        'height'      => 100,
        'width'       => 400,
        'flex-height' => true,
        'flex-width'  => true,
    ));
    
    // Custom header
    add_theme_support('custom-header', array(
        'default-image' => get_template_directory_uri() . '/assets/img/header.jpg',
        'width'         => 1200,
        'height'        => 400,
        'flex-width'    => true,
        'flex-height'   => true,
    ));
    
    // Custom background
    add_theme_support('custom-background', array(
        'default-color' => 'ffffff',
    ));
    
    // Editor styles
    add_theme_support('editor-styles');
    add_editor_style('assets/css/editor-style.css');
    
    // Wide alignment (Gutenberg)
    add_theme_support('align-wide');
    
    // Responsive embeds
    add_theme_support('responsive-embeds');
}
add_action('after_setup_theme', 'your_theme_setup');

```

--------------------------------

### WordPress Theme Customizer API (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Shows how to register new options and controls within the WordPress Theme Customizer. This API allows users to dynamically change theme settings like colors or layouts. It requires a function hooked into 'customize_register' to add sections, settings, and controls.

```php
function your_theme_customize_register($wp_customize) {
    // Add a section
    $wp_customize->add_section('your_theme_colors', array(
        'title'    => __('Theme Colors', 'textdomain'),
        'priority' => 30,
    ));
    
    // Add a setting
    $wp_customize->add_setting('primary_color', array(
        'default'           => '#0073aa',
        'sanitize_callback' => 'sanitize_hex_color',
    ));
    
    // Add a control
    $wp_customize->add_control(new WP_Customize_Color_Control($wp_customize, 'primary_color', array(
        'label'    => __('Primary Color', 'textdomain'),
        'section'  => 'your_theme_colors',
        'settings' => 'primary_color',
    )));
}
add_action('customize_register', 'your_theme_customize_register');

```

--------------------------------

### Bootstrap Architecture Structure (SCSS)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Illustrates the core directory structure of the Bootstrap framework, highlighting key SCSS files for configuration, mixins, normalization, grid, utilities, and components. This structure is essential for understanding how Bootstrap is organized and customized.

```scss
bootstrap/
├── scss/
│   ├── _variables.scss     # Configuration variables
│   ├── _mixins.scss        # Reusable mixins
│   ├── _root.scss          # CSS custom properties
│   ├── _reboot.scss        # Cross-browser normalization
│   ├── _grid.scss          # Grid system
│   ├── _utilities.scss     # Utility classes
│   └── _components/        # Individual components
├── js/
│   ├── dist/               # Compiled JavaScript
│   └── src/                # Source JavaScript modules
└── dist/
    ├── css/                # Compiled CSS files
    └── js/                 # Compiled JavaScript files
```

--------------------------------

### WordPress Custom Taxonomies API (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Details how to create custom taxonomies for organizing content, such as categories for custom post types. The `register_taxonomy` function is used, specifying the taxonomy name, the post type it applies to, and its arguments like label and hierarchical structure. This is also hooked into the 'init' action.

```php
function create_portfolio_taxonomy() {
    register_taxonomy(
        'portfolio_category',
        'portfolio',
        array(
            'label' => __('Portfolio Categories'),
            'hierarchical' => true,
            'public' => true,
        )
    );
}
add_action('init', 'create_portfolio_taxonomy');

```

--------------------------------

### SCSS for Layout and Header Customization

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/04-sass-compiler.md

Illustrates SCSS for customizing layout elements like the site header, including gradients, sticky positioning, and typography for brand and navigation links. Includes responsive adjustments.

```scss
// layout/_header.scss - Header customizations

.site-header {
  background: linear-gradient(135deg, $primary 0%, $secondary 100%);
  position: sticky;
  top: 0;
  z-index: 1030;
  
  .navbar-brand {
    font-weight: 700;
    font-size: 1.5rem;
    
    img {
      max-height: 40px;
      width: auto;
    }
  }
  
  .navbar-nav {
    .nav-link {
      color: rgba(255, 255, 255, 0.9);
      font-weight: 500;
      
      &:hover {
        color: white;
      }
    }
  }
}

// Responsive header adjustments
@include media-breakpoint-down(lg) {
  .site-header {
    .navbar-brand {
      font-size: 1.25rem;
    }
    
    .navbar-collapse {
      background: rgba(0, 0, 0, 0.1);
      margin-top: 1rem;
      border-radius: $border-radius;
      padding: 1rem;
    }
  }
}
```

--------------------------------

### Bootstrap Text Utilities

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/02-bootstrap-integration.md

Demonstrates Bootstrap's text utility classes for alignment, color, and font weight. These classes allow for quick styling of text elements.

```html
<p class="text-start">Left aligned text</p>
<p class="text-center">Center aligned text</p>
<p class="text-end">Right aligned text</p>
<p class="text-primary">Primary color text</p>
<p class="fw-bold">Bold text</p>
```

--------------------------------

### Customize SCSS Variables for Colors and Fonts

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Customizes the theme's appearance by modifying SCSS variables in the _variables.scss file. This allows for easy theming of primary colors, secondary colors, typography, and font sizes.

```scss
// Color customization
$primary: #007bff;
$secondary: #6c757d;
$success: #28a745;

// Typography
$font-family-sans-serif: "Your Font", sans-serif;
$font-size-base: 1rem;
```

--------------------------------

### Implement Security Best Practices (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Highlights essential security practices in WordPress development. This includes sanitizing user input using functions like `sanitize_text_field()` and escaping output data with functions such as `esc_html()`, `esc_url()`, and `esc_attr()` to prevent cross-site scripting (XSS) and other vulnerabilities.

```php
// Sanitize input
$user_input = sanitize_text_field($_POST['user_input']);

// Escape output
echo esc_html($user_input);
echo esc_url($url);
echo esc_attr($attribute);

```

--------------------------------

### Add Support for Custom Logo

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/03-bootscore-introduction.md

Enables the custom logo feature in WordPress for the Bootscore theme, allowing users to upload and display their own logo. This function defines the dimensions and flexibility of the logo display.

```php
// Add theme support for custom logo
add_theme_support('custom-logo', array(
    'height'      => 100,
    'width'       => 400,
    'flex-height' => true,
    'flex-width'  => true,
));
```

--------------------------------

### CSS: Theme Header Information

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

The `style.css` file is the main stylesheet for a WordPress theme. It requires a specific header comment block containing essential theme metadata like name, description, version, and author.

```css
/*
Theme Name: Your Theme Name
Description: Theme description
Version: 1.0.0
Author: Your Name
Text Domain: your-theme-textdomain
*/
```

--------------------------------

### Add Skip Link for Accessibility in WordPress

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Implements a skip-to-content link for improved accessibility. This PHP function hooks into WordPress to output a link that allows users to bypass navigation and jump directly to the main content area, enhancing keyboard navigation.

```php
// Skip link for accessibility
function add_skip_link() {
    echo '<a class="skip-link screen-reader-text" href="#main">' . __('Skip to content', 'textdomain') . '</a>';
}
add_action('wp_body_open', 'add_skip_link');
```

--------------------------------

### Create Custom Page Template (PHP)

Source: https://github.com/adgooroo/bootscore-theme-docs/blob/main/01-wordpress-theme-fundamentals.md

Demonstrates how to create a custom page template in WordPress. This involves adding a specific comment block at the top of a PHP file and then using the template in the WordPress admin area. It includes basic HTML structure and WordPress template tags like `the_title()` and `the_content()`.

```php
<?php
/*
Template Name: Custom Landing Page
*/

get_header(); ?>

<div class="custom-landing-page">
    <?php while (have_posts()) : the_post(); ?>
        <div class="hero-section">
            <h1><?php the_title(); ?></h1>
            <?php if (has_post_thumbnail()) : ?>
                <div class="hero-image">
                    <?php the_post_thumbnail('large'); ?>
                </div>
            <?php endif; ?>
        </div>
        
        <div class="content-section">
            <?php the_content(); ?>
        </div>
    <?php endwhile; ?>
</div>

<?php get_footer(); ?>

```