Unyson theme framework Backup & Demo Content extension will help you backup and or restore your WordpRess installation and provides demo installation utility for Creatus WordPress theme. If you wish to disable it please locate Unyson in left side vertical menu. Than click on Backup & Restore extension Deactivate button to deactivate. To find out more about this extension please visit Unyson Backup & Demo Content Extension manual.

The post Backup and Demo appeared first on Themezly™.

Unyson theme framework Breadcrumbs extension creates navigation menu for the pages that can be placed anywhere in the theme. If you wish to disable it please locate Unyson in left side vertical menu. Than click on Breadcrumbs extension Deactivate button to deactivate.

Please note that theme hero and page title sections are using this extension. If this extension is disabled a fallback to simple breadcrumbs function is activated.

To find out more about Unyson Breadcrumbs extension please visit Unyson Breadcrumbs Extension manual.

The post Breadcrumbs appeared first on Themezly™.

Creatus WordPress Theme is built on top of Unyson theme framework and comes with all it's built in options types. Beside the Unsyon defaults, we have built 30+ additional option types that made the theme development process easier.

In this section you can find only highlighted and mostly used option types and their usage examples. Any option types that are not listed in this section are for internal use only and their support is limited.

The post Option types overview appeared first on Themezly™.

Thz Ace is a code editor text area that is using ace.js for syntax highlighting.

option snippet

'option_name' => array(
    'type' => 'thz-ace',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value'=>'',
    'mode'=>'html', // css,html,javascript,json
    'theme'=>'chrome', // chrome, tomorrow_night
    'height'=>250
)

The post Thz Ace appeared first on Themezly™.

Thz Background is option type with multiple background selection such as none, color, gradient, image, video or shape.

option snippet simple

'option_name' => array(
    'type' => 'thz-background',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value'=> array(),
    //'disable' => array('image','color','video','gradient','shape'),
)

option snippet full

'option_name' => array(
    'type' => 'thz-background',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value'=> array(
        'type' => 'none',
        'color' => '',
        'image' => '',
        'repeat' => 'no-repeat',
        'position' => 'left-top',
        'size' => 'cover',
        'attachment' => 'scroll',
        'gradient-style' => 'linear', // linear, radial
        'gradient-angle' => '0',
        'gradient-size' => 'farthest-corner',//closest-corner, closest-side,farthest-corner,farthest-side
        'gradient-shape' => 'circle',//circle,ellipse
        'gradient-h-poz' => '50',
        'gradient-v-poz' => '50',
        'gradient-start' => '0',
        'gradient-start-color' => '#ffffff',
        'gradient-add-stop' => array(),
        'gradient-end' => '100',
        'gradient-end-color' => 'color_1',
        'video-link' => '',
        'video-poster' => '',
        'video-sound' => 0,
        'video-loop' => 1,
        'shape' => array(
            's' =>'waves', // shape name
            'p' =>'bottom', // shape position
            'f' =>'no', // shape flip
            'c' =>'color_1', // shape color
            'b' =>'',//  background color
            'w' => 100,// shape  width
            'h' =>''//  shape height
        )
    )
)

The post Thz Background appeared first on Themezly™.

Thz Box Style is full layout option type with visual reference for border, border radius and background.

option snippet simple

'option_name' => array(
    'type' => 'thz-box-style',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value'=> array(),
    'preview' => true, // display border,boxshadow and bacground preview,
    'popup' => true, // display option in a popup
    'button-text' =>  esc_html__('Customize box style', '{domain}'), // popup button text
    // displays only margin and padding
    'disable' => array('layout','borders','boxshadow','borderradius','boxsize','background') 

    /*
      Disable array disables specific option sections 
        layout
        padding
        margin
        borders
        borderradius
        boxsize
        boxshadow
        background
        video // display background but disable background video option
    */
)

option snippet full

'option_name' => array(
    'type' => 'thz-box-style',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value'=> array(
        'layout' => array(
            'display' => 'default',
            'float' => 'default',
            'clear' => 'default',
            'overflow' => 'default',
            'opacity' => '',
            'visibility' => 'default',
            'position' => 'default',
            'top' => 'auto',
            'right' => 'auto',
            'bottom' => 'auto',
            'left' => 'auto',
            'z-index' => 'auto',
        ),
        'padding' => array(
            'top' => '',
            'right' => '',
            'bottom' => '',
            'left' => '',
        ) ,
        'margin' => array(
            'top' => '',
            'right' => '',
            'bottom' => '',
            'left' => '',
        ) ,
        'borders' => array(
            'all'=> 'same',         
            'top'=> array(
                'w' => '',
                's' => 'solid',
                'c' => ''
            ),
            'right'=> array(
                'w' => '',
                's' => 'solid',
                'c' => ''
            ),
            'bottom'=> array(
                'w' => '',
                's' => 'solid',
                'c' => ''
            ),
            'left'=> array(
                'w' => '',
                's' => 'solid',
                'c' => ''
            )
        ),
        'borderradius' => array(
            'top-left' => '',
            'top-right' => '',
            'bottom-right' => '',
            'bottom-left' => '',
        ),
        'boxsize' => array(
            'width' => '',
            'height' => '',
            'min-width' => '',
            'min-height' => '',
            'max-width' => '',
            'max-height' => ''
        ),
        'boxshadow' => array(),
        'background' => array(
            'type' => 'none',
        ),
        'css'=>''
    )
)

option snippet frontend print helper function

// css print
$box_style          = thz_get_theme_option('option_name');
$box_style_print    = thz_print_box_css($box_style);
if(!empty($box_style_print)){
    $css = '.some_element{'.$box_style_print.'}';
}

The post Thz Box Style appeared first on Themezly™.

Thz Button is a button generator option type.

option snippet

'option_name' => array(
    'type' => 'thz-button',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value' => array(
        'buttonText'=>'Button',
        'activeColor' => 'theme',
        'buttonSizeClass' => 'small',
    ),
)

The post Thz Button appeared first on Themezly™.

Thz Color Picker is color picker option type with multiple color sets that include theme color palette combos, flat and material UI colors and it also accepts rgba color values.

option snippet

'option_name' => array(
    'type' => 'thz-color-picker',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value'=> '',
)

Note that palette colors are saved as palete color names eg; color_1, color_2. To convert them to color code values use the palette color processing function;

frontend pallete color processing function

$color = thz_get_option('option_name');
$color = thz_replace_palette_colors( $color );

The post Thz Color Picker appeared first on Themezly™.

Thz Icon option type is an option type that will help you select an icon from 3400+ custom picked icons.

option snippet simple

'option_name' => array(
    'type' => 'thz-icon',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value' => 'thzicon thzicon-themezly',
)

option snippet array

'option_name' => array(
    'type' => 'thz-icon',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value' => array(
        'icon' => 'thzicon thzicon-themezly',
        'size' => 28,
        'color' => 'color_1'
    ),
)

Adding custom icons to existing icons set

To add custom icons to thz-icon option type add following filter in your child-theme functions.php file;

function my_filter_font_icon_packs ($packs){

    $packs =  array(
        'myicons' => array(
            'title' => 'Icons pack name',
            'css_class_prefix' => 'icon_css_prefix', // eg; fa
            'css_file_path' => thz_theme_file_path('/some_child_theme_folder/style.css'),
            'css_file_uri' => thz_theme_file_uri('/some_child_theme_folder/style.css'),
        )
    );

    return $packs;
}

add_filter('thz_filter_font_icon_packs', 'my_filter_font_icon_packs');

Note that you need to enque frontent icons stylesheet on your own.

Transient used to save custom icon pack is thz_custom_font_icon_packs and is refreshed every 7 days. Transient can be deleted when filter is removed or with delete_transient('thz_custom_font_icon_packs') function.

The post Thz Icon appeared first on Themezly™.

Thz Multi Option is an option type that combines multiple option types in to one.

option snippet

'option_name' => array(
    'type' => 'thz-multi-options',
    'label' => __('Option label', '{domain}'),
    'desc' => esc_html__('Option description.', '{domain}'),
    'help' => esc_html__('Option help.', '{domain}'),
    'value' => array(
        'icon' => 'fa fa-rocket',
        'spinner' => 28,
        'short-text' => 'short text',
        'text' => 'text',
        'short-select' => 'two',
        'select' => 'two',
        'checkboxes' => array(
            'two' => true
        ),
        'radio' => 'two',
        'color' => 'color_1'
    ),
    'breakafter'=>'select',
    'thz_options' => array(
        'icon' => array(
            'type' => 'icon',
            'title' => esc_html__('icon', '{domain}'),
        ),
        'spinner' => array(
            'type' => 'spinner',
            'title' => esc_html__('spinner', '{domain}'),
            'addon' => 'px'
        ),
        'short-text' => array(
            'type' => 'short-text',
            'title' => esc_html__('short-text', '{domain}'),
        ),
        'text' => array(
            'type' => 'text',
            'title' => esc_html__('text', '{domain}'),
        ),
        'short-select' => array(
            'type' => 'short-select',
            'title' => esc_html__('short-select', '{domain}'),
            'choices' => array(
                'one' => esc_html__('1', '{domain}'),
                'two' => esc_html__('2', '{domain}'),
                'three' => esc_html__('3', '{domain}'),
            )
        ),
        'select' => array(
            'type' => 'short-select',
            'title' => esc_html__('select', '{domain}'),
            'choices' => array(
                'one' => esc_html__('1', '{domain}'),
                'two' => esc_html__('2', '{domain}'),
                'three' => esc_html__('3', '{domain}'),
            )
        ),
        'checkboxes' => array(
            'type' => 'checkboxes',
            'title' => esc_html__('checkboxes', '{domain}'),
            'choices' => array(
                'one' => esc_html__('1', '{domain}'),
                'two' => esc_html__('2', '{domain}'),
                'three' => esc_html__('3', '{domain}'),
            )
        ),
        'radio' => array(
            'type' => 'radio',
            'title' => esc_html__('radio', '{domain}'),
            'choices' => array(
                'one' => esc_html__('1', '{domain}'),
                'two' => esc_html__('2', '{domain}'),
                'three' => esc_html__('3', '{domain}'),
            )
        ),
        'color' => array(
            'type' => 'color',
            'title' => esc_html__('color', '{domain}'),
            'box' => true
        )
    )
)

The post Thz Multi Options appeared first on Themezly™.