Skip to content

Latest commit

 

History

History
62 lines (53 loc) · 1.73 KB

README.md

File metadata and controls

62 lines (53 loc) · 1.73 KB

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

IMAGE ALT TEXT HERE

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