redux-box-shadow-extension

Redux Framework Box Shadow Extension

Redux Framework Box Shadow Extensio is an Extension for well known WordPress theme options framework "Redux" to create a field for Box Shadow.

Preview

How to Include in Redux Framework?

You should have knowledge about how to install extensions in Redux Framwork.

This link may help you. https://docs.reduxframework.com/core/advanced/loading-extensions/

Initialize box shadow field in theme options file

array(         
    'id'      => 'box-shadow',
    'type'    => 'box_shadow',
    'title'   => __('Box Shadow', 'redux-framework-demo'),
    'units'   => array( 'px', 'em', 'rem' ),
    'output'  => ( '.header' ),
    'opacity' => true,
    'rgba'    => true,
    'default' => array (
        'horizontal'   => '5px', // can be negative value
        'vertical'     => '5px', // can be negative value
        'blur'         => '5px',
        'spread'       => '5px',
        'opacity'      => '1.0',
        'shadow-color' => '#f71313',
        'shadow-type'  => 'inset', // 'inset' or 'outside'
        'units'        => 'px',
    ),
),

How to use in frontend?

You have the array of values which can be used to create the css box shadow.

Array ( 
    [horizontal] = > 5px 
    [vertical]     => 5px
    [blur]         => 5px
    [spread]       => 5px
    [opacity]      => 1
    [units]        => px
    [shadow-color] => #f71313
    [shadow-type]  => inset
    [rgba]         => rgba(247,19,19,1)
)