Hot as hell, this is the top-bar widget Link

How it works

Enhance your theme’s versatility by effortlessly adjusting template layouts with customizable filters and actions.

Contents

Filters

Filters provide a flexible way to modify project elements in the child-theme’s functions.php file without requiring a copy of a template file. This ensures an update-proof approach to customization while allowing for creative adjustments.

How it works

Many classes and other elements are wrapped in filters, enabling modifications without storing template copies in a child theme. A basic filter consists of:

  • A filter name, e.g., bootscore/example/filter/name
  • A returnable value, such as a string containing one or more CSS classes
<div class="<?= esc_attr(apply_filters('bootscore/example/filter/name', 'one or more classes')); ?>">
...
</div>

Result in frontend:

<div class="one or more classes">
...
</div>

To modify these classes via a child theme, a custom function is required. This function must:

  • Have a unique function name my_fancy_filter_function
  • Return the modified value (in this case, CSS classes)
  • Be hooked into the appropriate filter bootscore/example/filter/name
/**
 * Change one or more classes into my-custom-class
 */
function my_fancy_filter_function() {
  return "my-custom-class";
}
add_filter('bootscore/example/filter/name', 'my_fancy_filter_function', 10, 2);

Result in frontend

<div class="my-custom-class">
...
</div>

Location

When a filter is used in multiple files, an additional location argument can specify where it is applied:

<?= esc_attr(apply_filters('bootscore/example/filter/name', 'one or more classes', 'location-in-which-template-this-filter-is-used')); ?>

For example, the bootscore/class/container filter is present in several template files:

In header.php:

<?= esc_attr(apply_filters('bootscore/class/container', 'container', 'header')); ?>

In archive.php:

<?= esc_attr(apply_filters('bootscore/class/container', 'container', 'archive')); ?>

Applying a basic filter without specifying a location modifies all instances:

/**
 * Change entire container classes
 */
function change_entire_containers() {
  return "container-fluid";
}
add_filter('bootscore/class/container', 'change_entire_containers', 10, 2);

To modify only a specific instance, the location parameter can be checked:

/**
 * Change container class in a single file
 */
function change_container_in_single_file($string, $location) {
  if ($location == 'header') {
    return "container-fluid";
  }
  return $string;
}
add_filter('bootscore/class/container', 'change_container_in_single_file', 10, 2);

For multiple locations, conditions can be expanded:

/**
 * Change container classes in selected files
 */
function change_container_in_selected_files($string, $location) {
  if ($location == 'header' || $location == 'footer-top' || $location == 'footer-columns' || $location == 'footer-info') {
    return "container-fluid";
  }
  return $string;
}
add_filter('bootscore/class/container', 'change_container_in_selected_files', 10, 2);

Filters reference list

Drawer

Theme

Loop

Actions

While filters modify existing content, actions are used to add new elements. Actions can be used for various tasks, such as inserting a message, opening a <div> in one action and closing it in another, or adding more complex functionality.

How it works

A basic action looks like this:

<?php do_action( 'bootscore_before_masthead' ); ?>

To add content at this action hook, the following are required:

  • An unique function name (e.g., my_fancy_action_function)
  • The action name (e.g., bootscore_before_masthead)
  • An echo statement to output content
/**
 * Add an alert message before the masthead.
 */
function add_alert_before_masthead() {
  echo '<div class="alert alert-danger" role="alert">This is an important message!</div>';
}
add_action('bootscore_before_masthead', 'add_alert_before_masthead');

Location

When an action is used in multiple files, an additional location argument can specify where it is applied:

<?php do_action( 'bootscore_after_primary_open', 'page-sidebar-left' ); ?>

Applying a basic action without specifying a location adds content to all instances:

/**
 * Add an alert message after primary open.
 */
function add_alert_after_primary_open() {
  echo '<div class="alert alert-danger" role="alert">This is an important message!</div>';
}
add_action('bootscore_after_primary_open', 'add_alert_after_primary_open');

To modify only a specific instance, the location parameter can be checked:

/**
 * Add an alert message after primary open for 'page-sidebar-left' location.
 */
function add_alert_after_primary_open($location) {
  if ($location == 'page-sidebar-left') {
    echo '<div class="alert alert-warning" role="alert">This is a warning alert for page-sidebar-left!</div>';
  }
}
add_action('bootscore_after_primary_open', 'add_alert_after_primary_open');

For multiple locations, the conditions can be expanded:

/**
 * Add an alert message after primary open for 'page-sidebar-left' and 'archive' location.
 */
function add_alert_after_primary_open($location) {
  if ($location == 'page-sidebar-left' || $location == 'archive') {
    echo '<div class="alert alert-warning" role="alert">This is a warning alert for page-sidebar-left and archive!</div>';
  }
}
add_action('bootscore_after_primary_open', 'add_alert_after_primary_open');

Visual guide

The following snippet will hook an alert alert-warning to all actions to create a visual map, as shown in the screenshot in header.php. If an action has a location, it will also be displayed.

Header Actions
/**
 * Generate hooks for all Bootscore actions
 */
$bootscore_hooks = [
  'bootscore_before_masthead',
  'bootscore_after_masthead_open',
  'bootscore_before_navbar_brand',
  'bootscore_after_navbar_brand',
  'bootscore_after_nav_toggler',
  'bootscore_before_masthead_close',
  'bootscore_after_masthead',
  'bootscore_after_primary_open',
  'bootscore_before_title',
  'bootscore_after_title',
  'bootscore_before_single_pagination',
  'bootscore_before_loop',
  'bootscore_before_loop_item',
  'bootscore_custom_loop_item',
  'bootscore_before_loop_thumbnail',
  'bootscore_after_loop_thumbnail',
  'bootscore_before_loop_title',
  'bootscore_after_loop_title',
  'bootscore_after_loop_tags',
  'bootscore_loop_item_after_card_body',
  'bootscore_after_loop_item',
  'bootscore_after_loop',
  'bootscore_after_featured_image',
  'bootscore_before_entry_footer',
  'bootscore_before_loop_pagination',
  'bootscore_loop_pagination',
  'bootscore_before_sidebar_widgets',
  'bootscore_after_sidebar_widgets',
  'bootscore_before_my_offcanvas_account',
  'bootscore_before_footer',
  'bootscore_footer_columns_before_container',
  'bootscore_footer_columns_after_container_open',
  'bootscore_footer_columns_before_container_close',
  'bootscore_footer_columns_after_container',
  'bootscore_footer_info_after_container_open',
  'bootscore_before_mini_cart_footer',
];

// Add hooks dynamically
foreach ($bootscore_hooks as $hook) {
  add_action($hook, function ($location = null) use ($hook) {
    $output = '<div class="alert alert-warning"><code>' . esc_html($hook) . '</code>';
    if ($location) {
      $output .= ' (Location: <strong>' . esc_html($location) . '</strong>)';
    }
    $output .= '</div>';
    echo $output;
  });
}

Action reference list

Loop