shortcode = 'ut_custom_link';
add_action( 'init', array( $this, 'ut_map_shortcode' ) );
add_shortcode( $this->shortcode, array( $this, 'ut_create_shortcode' ) );
}
function ut_map_shortcode( $atts, $content = NULL ) {
if( function_exists( 'vc_map' ) ) {
vc_map(
array(
'name' => esc_html__( 'Custom Link', 'ut_shortcodes' ),
'base' => $this->shortcode,
'icon' => UT_SHORTCODES_URL . '/admin/img/vc_icons/fancy-link.png',
'category' => 'Information',
'class' => 'ut-vc-icon-module ut-information-module',
'content_element' => true,
'params' => array(
array(
'type' => 'vc_link',
'heading' => esc_html__( 'Link', 'ut_shortcodes' ),
'admin_label' => true,
'param_name' => 'link',
'group' => 'General'
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Alignment', 'ut_shortcodes' ),
'param_name' => 'align',
'group' => 'General',
'value' => array(
esc_html__( 'center', 'ut_shortcodes' ) => 'center',
esc_html__( 'left' , 'ut_shortcodes' ) => 'left',
esc_html__( 'right' , 'ut_shortcodes' ) => 'right',
),
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Add Icon to Link?', 'unitedthemes' ),
'param_name' => 'icon',
'group' => 'General',
'value' => array(
esc_html__( 'no', 'ut_shortcodes' ) => '',
esc_html__( 'yes', 'ut_shortcodes' ) => 'yes'
)
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Icon library', 'ut_shortcodes' ),
'description' => esc_html__( 'Select icon library.', 'ut_shortcodes' ),
'param_name' => 'icon_type',
'group' => 'General',
'value' => array(
esc_html__( 'Brooklyn Icons', 'ut_shortcodes' ) => 'bklynicons',
esc_html__( 'Font Awesome', 'ut_shortcodes' ) => 'fontawesome',
//esc_html__( 'Custom Icon', 'ut_shortcodes' ) => 'custom',
),
'dependency' => array(
'element' => 'icon',
'value' => 'yes',
),
),
array(
'type' => 'iconpicker',
'heading' => esc_html__( 'Choose Icon', 'ut_shortcodes' ),
'param_name' => 'icon_fontawesome',
'group' => 'General',
'dependency' => array(
'element' => 'icon_type',
'value' => 'fontawesome',
),
),
array(
'type' => 'iconpicker',
'heading' => esc_html__( 'Choose Icon', 'ut_shortcodes' ),
'param_name' => 'icon_bklyn',
'group' => 'General',
'settings' => array(
'emptyIcon' => true,
'type' => 'bklynicons',
),
'dependency' => array(
'element' => 'icon_type',
'value' => 'bklynicons',
),
),
/*array(
'type' => 'attach_image',
'heading' => esc_html__( 'Custom Icon', 'ut_shortcodes' ),
'param_name' => 'icon_image',
'group' => 'General',
'dependency' => array(
'element' => 'icon_type',
'value' => 'custom',
),
),*/
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Icon Position', 'unitedthemes' ),
'param_name' => 'icon_position',
'group' => 'General',
'value' => array(
esc_html__( 'before', 'ut_shortcodes' ) => 'before',
esc_html__( 'after', 'ut_shortcodes' ) => 'after'
),
'dependency' => array(
'element' => 'icon',
'value' => 'yes',
),
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Add Hover Animation to Icon?', 'unitedthemes' ),
'param_name' => 'icon_animation',
'group' => 'General',
'value' => array(
esc_html__( 'no', 'ut_shortcodes' ) => '',
esc_html__( 'yes', 'ut_shortcodes' ) => 'yes'
),
'dependency' => array(
'element' => 'icon',
'value' => 'yes',
),
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Text Transform', 'ut_shortcodes' ),
'param_name' => 'text_transform',
'group' => 'Link Font Settings',
'value' => array(
esc_html__( 'Select Text Transform' , 'ut_shortcodes' ) => '',
esc_html__( 'capitalize' , 'ut_shortcodes' ) => 'capitalize',
esc_html__( 'uppercase', 'ut_shortcodes' ) => 'uppercase',
esc_html__( 'lowercase', 'ut_shortcodes' ) => 'lowercase'
),
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Font Weight', 'ut_shortcodes' ),
'param_name' => 'font_weight',
'group' => 'Link Font Settings',
'value' => array(
esc_html__( 'Select Font Weight' , 'ut_shortcodes' ) => '',
esc_html__( 'normal' , 'ut_shortcodes' ) => 'normal',
esc_html__( 'bold' , 'ut_shortcodes' ) => 'bold'
),
),
array(
'type' => 'colorpicker',
'heading' => esc_html__( 'Link Color', 'ut_shortcodes' ),
'param_name' => 'link_color',
'group' => 'Link Colors'
),
array(
'type' => 'colorpicker',
'heading' => esc_html__( 'Link Hover Color', 'ut_shortcodes' ),
'param_name' => 'link_color_hover',
'group' => 'Link Colors'
),
array(
'type' => 'colorpicker',
'heading' => esc_html__( 'Icon Color', 'ut_shortcodes' ),
'param_name' => 'icon_color',
'group' => 'Link Colors'
),
array(
'type' => 'colorpicker',
'heading' => esc_html__( 'Icon Hover Color', 'ut_shortcodes' ),
'param_name' => 'icon_color_hover',
'group' => 'Link Colors'
),
// Animation
array(
'type' => 'animation_style',
'heading' => __( 'Animation Effect', 'ut_shortcodes' ),
'description' => __( 'Select image animation effect.', 'ut_shortcodes' ),
'group' => 'Animation',
'param_name' => 'effect',
'settings' => array(
'type' => array(
'in',
'out',
'other',
),
)
),
array(
'type' => 'textfield',
'heading' => esc_html__( 'Animation Duration', 'unitedthemes' ),
'description' => esc_html__( 'Animation time in seconds e.g. 1s', 'unitedthemes' ),
'param_name' => 'animation_duration',
'group' => 'Animation',
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Animate Once?', 'unitedthemes' ),
'description' => esc_html__( 'Animate only once when reaching the viewport, animate everytime when reaching the viewport or make the animation infinite? By default the animation executes everytime when the element becomes visible in viewport, means when leaving the viewport the animation will be reseted and starts again when reaching the viewport again. By setting this option to yes, the animation executes exactly once. By setting it to infinite, the animation loops all the time, no matter if the element is in viewport or not.', 'unitedthemes' ),
'param_name' => 'animate_once',
'group' => 'Animation',
'value' => array(
esc_html__( 'yes', 'unitedthemes' ) => 'yes',
esc_html__( 'no' , 'unitedthemes' ) => 'no',
esc_html__( 'infinite', 'unitedthemes' ) => 'infinite',
)
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Animate Image on Tablet?', 'ut_shortcodes' ),
'param_name' => 'animate_tablet',
'group' => 'Animation',
'edit_field_class' => 'vc_col-sm-6',
'value' => array(
esc_html__( 'no', 'ut_shortcodes' ) => 'false',
esc_html__( 'yes' , 'ut_shortcodes' ) => 'true'
),
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Animate Image on Mobile?', 'ut_shortcodes' ),
'param_name' => 'animate_mobile',
'group' => 'Animation',
'edit_field_class' => 'vc_col-sm-6',
'value' => array(
esc_html__( 'no', 'ut_shortcodes' ) => 'false',
esc_html__( 'yes' , 'ut_shortcodes' ) => 'true'
),
),
array(
'type' => 'dropdown',
'heading' => esc_html__( 'Delay Animation?', 'ut_shortcodes' ),
'description' => esc_html__( 'Time in milliseconds until the image appears. e.g. 200', 'ut_shortcodes' ),
'param_name' => 'delay',
'group' => 'Animation',
'edit_field_class' => 'vc_col-sm-6',
'value' => array(
esc_html__( 'no', 'ut_shortcodes' ) => 'false',
esc_html__( 'yes' , 'ut_shortcodes' ) => 'true'
)
),
array(
'type' => 'textfield',
'heading' => esc_html__( 'Delay Timer', 'ut_shortcodes' ),
'description' => esc_html__( 'Time in milliseconds until the next image appears. e.g. 200', 'ut_shortcodes' ),
'param_name' => 'delay_timer',
'group' => 'Animation',
'edit_field_class' => 'vc_col-sm-6',
'dependency' => array(
'element' => 'delay',
'value' => 'true',
)
),
// custom CSS class
array(
'type' => 'textfield',
'heading' => esc_html__( 'CSS Class', 'ut_shortcodes' ),
'description' => esc_html__( 'Style particular content element differently - add a class name and refer to it in custom CSS.', 'ut_shortcodes' ),
'param_name' => 'class',
'group' => 'General'
),
// Design Options
array(
'type' => 'css_editor',
'param_name' => 'css',
'group' => esc_html__( 'Design Options', 'ut_shortcodes' ),
),
)
)
); /* end mapping */
}
}
function ut_create_shortcode( $atts, $content = NULL ) {
extract( shortcode_atts( array (
'link' => '',
'align' => 'center',
'icon' => '',
'icon_type' => 'bklynicons',
'icon_fontawesome' => '',
'icon_image' => '',
'icon_bklyn' => '',
'icon_position' => 'before',
'icon_animation' => '',
'font_weight' => '',
'text_transform' => '',
'link_color' => '',
'link_color_hover' => '',
'icon_color' => '',
'icon_color_hover' => '',
'effect' => '',
'animate_once' => 'yes',
'animate_mobile' => false,
'animate_tablet' => false,
'delay' => 'false',
'delay_timer' => '200',
'animation_duration'=> '',
'css' => '',
'class' => ''
), $atts ) );
$link_icon = false;
$url = '#';
// classes
$attributes = array();
$classes = array();
$classes[] = $class;
if( $icon_animation ) {
$classes[] = 'ut-custom-link-module-with-animation';
}
$classes[] = 'ut-custom-link-module-icon-' . $icon_position;
$classes[] = 'ut-custom-link-module-' . $align;
// animation effect
if( !empty( $effect ) && $effect != 'none' ) {
$attributes['data-effect'] = esc_attr( $effect );
$attributes['data-animateonce'] = esc_attr( $animate_once );
$attributes['data-delay'] = $delay == 'true' ? esc_attr( $delay_timer ) : 0;
if( !empty( $animation_duration ) ) {
$attributes['data-animation-duration'] = esc_attr( $animation_duration );
}
$classes[] = 'ut-animate-element';
$classes[] = 'animated';
if( !$animate_tablet ) {
$classes[] = 'ut-no-animation-tablet';
}
if( !$animate_mobile ) {
$classes[] = 'ut-no-animation-mobile';
}
if( $animate_once == 'infinite' ) {
$classes[] = 'infinite';
}
}
// attributes string
$attributes = implode(' ', array_map(
function ($v, $k) { return sprintf("%s=\"%s\"", $k, $v); },
$attributes,
array_keys( $attributes )
) );
// link settings
if( function_exists('vc_build_link') && $link ) {
$link = vc_build_link( $link );
// assign link
$url = !empty( $link['url'] ) ? $link['url'] : '#';
}
$target = !empty( $link['target'] ) ? $link['target'] : '_self';
$title = !empty( $link['title'] ) ? $link['title'] : '';
$rel = !empty( $link['rel'] ) ? 'rel="' . esc_attr( trim( $link['rel'] ) ) . '"' : '';
// icon settings
if( $icon_type == 'bklynicons' && !empty( $icon_bklyn ) ) {
$link_icon = $icon_bklyn;
} else {
if( strpos( $icon_fontawesome, 'fa fa-' ) === false ) {
$link_icon = str_replace('fa-', 'fa fa-', $icon_fontawesome );
} else {
$link_icon = $icon_fontawesome;
}
}
// inline custom css
$id = uniqid("ut_cl_");
$css_style = '';
if( $align ) {
$css_style .= '#' . $id . ' { text-align:' . $align . '; }';
}
if( !empty( $link_color ) ) {
$css_style .= '#' . $id . ' a { color:' . $link_color . '; }';
}
if( !empty( $link_color_hover ) ) {
$css_style .= '#' . $id . ' a:hover { color:' . $link_color_hover . '; }';
$css_style .= '#' . $id . ' a:active { color:' . $link_color_hover . '; }';
$css_style .= '#' . $id . ' a:focus { color:' . $link_color_hover . '; }';
}
if( !empty( $icon_color ) ) {
$css_style .= '#' . $id . ' a i { color:' . $icon_color . '; }';
}
if( !empty( $icon_color_hover ) ) {
$css_style .= '#' . $id . ' a:hover i { color:' . $icon_color_hover . '; }';
$css_style .= '#' . $id . ' a:active i { color:' . $icon_color_hover . '; }';
$css_style .= '#' . $id . ' a:focus i { color:' . $icon_color_hover . '; }';
}
if( !empty( $font_weight ) ) {
$css_style .= '#' . $id . ' { font-weight:' . $font_weight . '; }';
}
if( !empty( $text_transform ) ) {
$css_style .= '#' . $id . ' { text-transform:' . $text_transform . '; }';
}
/* start output */
$output = '';
// add css to output
if( !empty( $css_style ) ) {
$output .= ut_minify_inline_css( '' );
}
$output .= '';
if( defined( 'WPB_VC_VERSION' ) ) {
return '' . $output . '
';
}
return $output;
}
}
}
new UT_Custom_Link;