Pricing

PHP Filters

Table of Contents
  1. gkt_enqueue_*
  2. gkt_icons_list
  3. gkt_custom_typography
  4. gkt_shapes_list

gkt_enqueue_*

Ghost Kit PHP filters cover the parts of the plugin a site is most likely to change. Four groups are documented here: turning off a bundled library, adding icons to the picker, adding typography options and adding shapes to the Shape Divider block. Add the calls to your theme’s functions.php or to a plugin of your own.

<?php

add_filter( 'gkt_enqueue_plugin_swiper', '__return_false' );
Event
gkt_enqueue_plugin_jarallax
gkt_enqueue_plugin_motion
gkt_enqueue_plugin_luxon
gkt_enqueue_plugin_lottie_player
gkt_enqueue_plugin_swiper
gkt_enqueue_plugin_gist_simple
gkt_enqueue_plugin_gmaps
gkt_enqueue_google_recaptcha

gkt_icons_list

By default, the icon picker contains FontAwesome icons. You can add any SVG icons you want extend icon picker using the PHP filter:

<?php

// add icons list.
add_filter( 'gkt_icons_list', 'my_gkt_icons' );
function my_gkt_icons( $icons ) {
    $icons['my-icons-pack'] = array(
        'name' => 'My Icons',
        'icons' => array(
            array(
                'keys' => 'adobe,brand',
                'svg' => '<svg class="ghostkit-svg-icon ghostkit-svg-icon-fa" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M315.5 64h170.9v384L315.5 64zm-119 0H25.6v384L196.5 64zM256 206.1L363.5 448h-73l-30.7-76.8h-78.7L256 206.1z"></path></svg>',
            ),
            array(
                'keys' => 'adobe,brand',
                'svg' => '<svg class="ghostkit-svg-icon ghostkit-svg-icon-fa" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M315.5 64h170.9v384L315.5 64zm-119 0H25.6v384L196.5 64zM256 206.1L363.5 448h-73l-30.7-76.8h-78.7L256 206.1z"></path></svg>',
            ),
            ...
        ),
    );

    return $icons;
}

gkt_custom_typography

By default, Typography options are used for Body, Headings, and Buttons. You can add custom options by extending typography using the PHP filter:

add_filter( 'gkt_custom_typography', 'my_gkt_custom_typography' );
function my_gkt_custom_typography( $custom_typography ) {

    // Add typography options for `.my-selector`.
    $custom_typography['my-selector'] = array(
        'label' => esc_html__( 'My Selector', '@@text_domain' ),
        'defaults' => array(
            'font-family-category' => 'default',
            'font-family' => '',
            'font-size' => '',
            'font-weight' => '',
            'line-height' => '',
            'letter-spacing' => '',
        ),
        'output' => array(
            array(
                'selectors' => '.my-selector',
            ),
            array(
                'selectors' => '.editor-styles-wrapper .my-selector',
                'editor' => true,
            ),
        ),
    );

    // Add typography options for `.my-selector-2` with Font Size and Font Weight control only.
    $custom_typography['my-selector-2'] = array(
        'label' => esc_html__( 'My Selector 2', '@@text_domain' ),
        'defaults' => array(
            'font-size' => '10px',
            'font-weight' => '600',
        ),
        'output' => array(
            array(
                'selectors' => '.my-selector-2',
            ),
            array(
                'selectors' => '.editor-styles-wrapper .my-selector-2',
                'editor' => true,
            ),
        ),
    );

    return $custom_typography;
}

gkt_shapes_list

By default, the Shapes Divider block contains 12 predefined SVG shapes. You can extend the shapes list using the PHP filter:

<?php

// add shapes list.
add_filter( 'gkt_shapes_list', 'my_gkt_shapes' );
function my_gkt_shapes( $shapes ) {
    $shapes['my-shapes'] = array(
        'name' => 'My Shapes',
        'shapes' => array(
            array(
                'label'                 => 'Wave',
                'name'                  => 'wave',
                'allow_flip_vertical'   => true,
                'allow_flip_horizontal' => true,
                'path'                  => ghostkit()->plugin_path . '/gutenberg/shapes/wave.svg',
            ),
            array(
                'label'                 => 'Waves',
                'name'                  => 'waves',
                'allow_flip_vertical'   => true,
                'allow_flip_horizontal' => true,
                'path'                  => ghostkit()->plugin_path . '/gutenberg/shapes/waves.svg',
            ),
            ...
        ),
    );

    return $shapes;
}
Was this page helpful?
Yes No