我正在尝试为 wpbakery 创建自定义元素，我对这件事很陌生。我创建了一个应该用于 2 个不同目的的元素，即用户可以显示按钮或社交媒体链接。下面是我试过的代码：
//frontend
add_shortcode( 'expert', 'expert_func' );
function expert_func( $atts, $content = null ) { // New function parameter $content is added!
extract(
shortcode_atts(
array(
'expert_image' => 'expert_image',
'title' => '',
),
$atts
)
);
$img_url = wp_get_attachment_image_src( $expert_image, "full");
extract(
shortcode_atts(
array(
'expert_exp_image' => 'expert_exp_image',
'title' => '',
),
$atts
)
);
$exp_img_url = wp_get_attachment_image_src( $expert_exp_image, "full");
extract(
shortcode_atts(
array(
'exp_btn_url' => 'exp_btn_url',
),
$atts
)
);
extract(
shortcode_atts(
array(
'Twitter' => 'Twitter',
'Facebook' => 'Facebook',
'Linkedn' => 'Linkedn',
'Instagram' => 'Instagram',
),
$atts
)
);
$btn_link = '';
$result .='<div class="inner__card">
<div class="expert-img">
<img src="'. $img_url[0] .'">
</div>
<div class="expert-details">
<p class="name">'.$atts['expert_name'].'</p>
<p class="designation">'.$atts['expert_designation'].'</p>
<div class="expect-experience">
<div class="expect-experience-no">
<img src="'. $exp_img_url[0] .'" alt="experience-10">
</div>
<div class="expect-experience-text">
<p>'.$atts['expert_short_desc'].'</span></p>
</div>
</div>
<p class="details">'.$atts['expert_description'].'</p>';
if($exp_btn_url!=''){
$result .='<div class="expert-btn">';
if ($exp_btn_url) {
$exp_btn_url = vc_build_link($exp_btn_url);
$a_href = $exp_btn_url['url'];
$a_title = $exp_btn_url['title'];
$a_target = $exp_btn_url['target'];
$icon_box_link = array('href="' . esc_attr($a_href) . '"', 'title="' . esc_attr($a_title) . '"', 'target="' . esc_attr($a_target) . '"');
$btn_link = '<a class="learn-btn" ' . implode(' ', $icon_box_link) . '>' . esc_attr($a_title) . '</a>';
}
$result .= $btn_link;
}
$result .= '<a href="'.$exp_btn_url.'" class="learn-btn">Learn More</a>';
}
else{
$result .='<div class="card-socail">
<div class="social-buttons">
<!-- TwitterButton -->
<a href="'.$atts['Twitter'].'" target="blank" class="social-margin">
<div class="social-icon twitter">
<i class="fa fa-twitter" aria-hidden="true"></i>
</div>
</a>
<!-- facebook Button -->
<a href="'.$atts['Facebook'].'" target="blank" class="social-margin">
<div class="social-icon facebook">
<i class="fa fa-facebook" aria-hidden="true"></i>
</div>
</a>
<!-- LinkedIn Button -->
<a href="'.$atts['Linkedn'].'" class="social-margin" target="blank">
<div class="social-icon linkedin">
<i class="fa fa-linkedin" aria-hidden="true"></i>
</div>
</a>
<!-- Instagram Button -->
<a href="'.$atts['Instagram'].'" target="blank" class="social-margin">
<div class="social-icon behance">
<i class="fa fa-instagram" aria-hidden="true"></i>
</div>
</a>
</div>
</div>';
}
$result .=' </div>
</div>
</div>';
//print_r($atts);
return $result;
}
//backend
add_action( 'vc_before_init', 'expert_integrateWithVC' );
function expert_integrateWithVC() {
vc_map( array(
"name" => __( "Expert", "my-text-domain" ),
"base" => "expert",
"class" => "",
"category" => __( "Clicksplode Elements", "my-text-domain"),
"params" => array(
array(
"type" => "attach_image",
"holder" => "div",
"class" => "",
"heading" => __( "Choose Expert Image", "my-text-domain" ),
"param_name" => "expert_image",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Expert Name", "my-text-domain" ),
"param_name" => "expert_name",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Expert Designation", "my-text-domain" ),
"param_name" => "expert_designation",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "attach_image",
"holder" => "div",
"class" => "",
"heading" => __( "Add Year of Expirience image", "my-text-domain" ),
"param_name" => "expert_exp_image",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Expert's Expirience Short Description", "my-text-domain" ),
"param_name" => "expert_short_desc",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textarea",
"holder" => "div",
"class" => "",
"heading" => __( "Short Description of Expert", "my-text-domain" ),
"param_name" => "expert_description",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "vc_link",
"holder" => "div",
"class" => "",
"heading" => __( "Choose Rediect URL", "my-text-domain" ),
"param_name" => "exp_btn_url",
"value" => __( "", "my-text-domain" ),
"description" => __( "Add Short Description", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Add Twitter URL", "my-text-domain" ),
"param_name" => "Twitter",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Add Facebook URL", "my-text-domain" ),
"param_name" => "Facebook",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Add Linkedn URL", "my-text-domain" ),
"param_name" => "Linkedn",
"value" => __( "", "my-text-domain" )
),
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __( "Add Instagram URL", "my-text-domain" ),
"param_name" => "Instagram",
"value" => __( "", "my-text-domain" )
)
)
) );
}
我知道上面的代码不正确，但我只想显示用户是否将 url 添加到按钮而不是社交媒体按钮应该被隐藏，如果用户添加社交媒体链接而不是按钮应该被隐藏。请在附件中找到
