For the past few years, my journey with the Mantine UI library on various NextJS projects in TypeScript has been nothing short of transformative. The decision to adopt this library was driven by its remarkable ease of use and the exceptional quality of its documentation, which is both well-crafted and meticulously organized.

Read More

We have released the v1.1.5 version of WP Bones with several fixes, improvements and new features. In particular, we have re-designed the demo branch along with the master/boilerplate to start to develop a WordPress plugin. Don’t forget to have a look at the Wiki. We have also created a Discussion to contribute in a better way.

From a framework perspective, we decided to remove the Illuminate Eloquent ORM from the composer. In short, it won’t be installed by default anymore.
Anyway, you will be able to continue to use that out of the box. This means that WP Bones will continue to support the bootstrap of the Illuminate as the previous version.

Read More

As you know, with styled-component you may extend an HTML tag and define an attribute immediately. That’s very useful when you need to use a component often.

// styled.ts
export const IconDisabled = styled(Icon).attrs({
  src: "/images/ssl/unsecure.png",

Today I’m excited to introduce you WP Bones, a plugin framework for WordPress written with Composer. WP Bones providing a set of tools and rules to facilitate the WordPress plugin. Also, the aim of Bones is to be able to write a Plugin such as Laravel Framework application.

Read More

As you know, the php artisan command has the --ansi option to force the ANSI colour output. Anyway, if you have developed your artisan command, you may wish to display its output in ANSI colour mode, you can force it by using:


Of course, you may put the above code in your construct method.

When you are writing a Laravel package, usually you need a config file.
Also, we will publish the config file in the “boot” method of the service provider.
Then, in the “register” method you can get the configuration and use it when you create the instance of “Facade”.

Let’s see a typical config file:

Read More

If you are including jQuery by using a cdn such as, Laravel Mix will emit an error when compiling your scripts. First of all, you have to copy on the root of your project a fresh copy of default `webpack.config.js` (see here for more details). Next, comment the following lines:

module.exports.plugins = (module.exports.plugins || []).concat([
    new webpack.ProvidePlugin(Mix.autoload || {
        //jQuery: 'jquery',
        //$: 'jquery',
        //jquery: 'jquery',
        //'window.jQuery': 'jquery'

When you are using a Custom Post Type with its Custom Post Taxonomies, you could need to detect if a particular category is displayed in a post. So, I write a simple WordPress shortocode you can use to detect a particular category and then display the content of the post.

To achieve that, you can add the following code in your functions.php file:


add_shortcode( 'wp_is_category_cpt', 'wp_is_category_cpt' );

if ( ! function_exists( 'wp_is_category_cpt' ) ) {

  function wp_is_category_cpt( $atts = [], $content = null )
    global $post;

    $defaults = [
      'post_type' => false,
      'taxonomy'  => false,
      'category'  => false,

    $atts = shortcode_atts( $defaults, $atts, 'wp_is_category_cpt' );

    if ( empty( $atts[ 'post_type' ] ) || empty( $atts[ 'taxonomy' ] ) || empty( $atts[ 'category' ] ) ) {
      return $content;

    if ( $post->post_type === $atts[ 'post_type' ] && has_term( $atts[ 'category' ], $atts[ 'taxonomy' ] ) ) {
      return $content;

    return "";

Next, in your post content you can use:

[wp_is_category_cpt post_type="wp_cpt" taxonomy="wp_tax" category="cars"]
  This content will be visible when this post is displayed
  by "wp_cpt" custom post type, in the category "cars" for taxonomy "wp_tax"

The wp_cpt and wp_tax are the Custom Post Type slug id and Custom Post Taxonomy slug id. The category argument is the category slug.

From PHP 5.3 we can use some amazing new interfaces so magical. One of them is ArrayAccess. This interface provides a set of methods that we can use to implement the array behavior in a stdClass. Let’s see an example:

Read More

Of course, you know dangerouslySetInnerHTML attribute. This is very useful when you need to insert a custom own HTML in your page.

…is React’s replacement for using innerHTML in the browser DOM. In general, setting HTML from code is risky because it’s easy to inadvertently expose your users to a cross-site scripting (XSS) attack. So, you can set HTML directly from React, but you have to type out dangerouslySetInnerHTML and pass an object with a __html key, to remind yourself that it’s dangerous.

Read More