bs Code Highlighter

Installation

[products ids=”2606″]

1. Buy plugin
2. In your admin panel, go to Plugins > and click the Add New button.
3. Click Upload Plugin and Choose File, then select the Plugin’s .zip file. Click Install Now.
4. Click Activate to use your new Plugin right away.

Usage

Add a CSS class such as language-html or language-scss in the code block’s Advanced tab.

<div class="dark-mode-switch form-check">
  <label class="form-check-label">
    <input class="bs-theme-switcher form-check-input" type="checkbox">
    Dark theme?
  </label>
</div>

<div class="dark-mode-switch form-check">
  <label class="form-check-label">
    <input class="bs-theme-switcher form-check-input" type="checkbox">
    Dark theme?
  </label>
</div>

Currently supported languages

PHP

// 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);

CSS

.card {
  color: var(--bs-light);
  background-color: var(--bs-dark);
}

.card a {
  color: var(--bs-danger);
}

.card h2 a {
  color: var(--bs-warning);
}

SCSS

.card {
  color: var(--#{$prefix}light);
  background-color: var(--#{$prefix}dark);

  a {
    color: var(--#{$prefix}danger);
  }

  h2 {
    a {
      color: var(--#{$prefix}warning);
    }
  }
}

JavaScript

document.addEventListener('DOMContentLoaded', () => {
  const alertEl = document.querySelector('.alert')
  if (alertEl) {
    alertEl.addEventListener('closed.bs.alert', () => {
      console.log('Alert closed')
    })
  }
})

TypeScript

document.addEventListener('DOMContentLoaded', (): void => {
  const alertEl: HTMLElement | null = document.querySelector('.alert')
  if (alertEl) {
    alertEl.addEventListener('closed.bs.alert', (): void => {
      console.log('Alert closed')
    })
  }
})

jQuery

$(window).resize(function () {
  if (window.matchMedia("(max-width: 767px)").matches) {
    $('.filter-buttons').removeClass('btn-group');
  } else {
    $('.filter-buttons').addClass('btn-group');
  }
}).trigger("resize");

Shortcode

[bs-loop type="post" display="isotope" layout="overlay" tax="category" terms="post-demos, post-demos-2" gap="3" row-cols-md="2" row-cols-lg="3" context="hide-category hide-meta hide-read-more hide-tags" search="true"]

JSON

"require": {
  "composer/installers": "^2.1",
  // other existing dependencies if any here
},
"repositories":[ // add the wpackagist repo, packagist is included by default
        {
            "type":"composer",
            "url":"https://wpackagist.org",
            "only": [
                "wpackagist-plugin/*",
                "wpackagist-theme/*"
            ]
        }
    ],
"extra": { //configuration for composer/installers:
  "installer-paths": {
    "wordpress/wp-content/plugins/mu-plugins/{$name}/": ["type:wordpress-muplugin"],
    "wordpress/wp-content/plugins/{$name}/": ["type:wordpress-plugin"],
    "wordpress/wp-content/themes/{$name}/": ["type:wordpress-theme"]
  }
}