我自己制作了一个自定义小部件，我能够在小部件区域看到它但我无法使用Visual Composer插件在编辑器中找到它。我的小部件有什么问题吗？我的小部件只是使用Wordpress.org提供的这个例子：
/**
* Adds Foo_Widget widget.
*/
class Foo_Widget extends WP_Widget {
/**
* Register widget with WordPress.
*/
function __construct() {
parent::__construct(
'foo_widget', // Base ID
__( 'Widget Title', 'text_domain' ), // Name
array( 'description' => __( 'A Foo Widget', 'text_domain' ), ) // Args
);
}
/**
* Front-end display of widget.
*
* @see WP_Widget::widget()
*
* @param array $args Widget arguments.
* @param array $instance Saved values from database.
*/
public function widget( $args, $instance ) {
echo $args['before_widget'];
if ( ! empty( $instance['title'] ) ) {
echo $args['before_title'] . apply_filters( 'widget_title', $instance['title'] ). $args['after_title'];
}
echo __( 'Hello, World!', 'text_domain' );
echo $args['after_widget'];
}
/**
* Back-end widget form.
*
* @see WP_Widget::form()
*
* @param array $instance Previously saved values from database.
*/
public function form( $instance ) {
$title = ! empty( $instance['title'] ) ? $instance['title'] : __( 'New title', 'text_domain' );
?>
<p>
<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>">
</p>
<?php
}
/**
* Sanitize widget form values as they are saved.
*
* @see WP_Widget::update()
*
* @param array $new_instance Values just sent to be saved.
* @param array $old_instance Previously saved values from database.
*
* @return array Updated safe values to be saved.
*/
public function update( $new_instance, $old_instance ) {
$instance = array();
$instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : '';
return $instance;
}
} // class Foo_Widget
答案 0 :(得分：8)
你必须为视觉作曲家创作专用这是例子
<?php
/*
Plugin Name: Extend Visual Composer Plugin Example
Plugin URI: http://wpbakery.com/vc
Description: Extend Visual Composer with your own set of shortcodes.
Version: 0.1.1
Author: WPBakery
Author URI: http://wpbakery.com
License: GPLv2 or later
*/
/*
This example/starter plugin can be used to speed up Visual Composer plugins creation process.
More information can be found here: http://kb.wpbakery.com/index.php?title=Category:Visual_Composer
*/
// don't load directly
if (!defined('ABSPATH')) die('-1');
class VCExtendAddonClass {
function __construct() {
// We safely integrate with VC with this hook
add_action( 'init', array( $this, 'integrateWithVC' ) );
// Use this when creating a shortcode addon
add_shortcode( 'bartag', array( $this, 'renderMyBartag' ) );
// Register CSS and JS
add_action( 'wp_enqueue_scripts', array( $this, 'loadCssAndJs' ) );
}
public function integrateWithVC() {
// Check if Visual Composer is installed
if ( ! defined( 'WPB_VC_VERSION' ) ) {
// Display notice that Visual Compser is required
add_action('admin_notices', array( $this, 'showVcVersionNotice' ));
return;
}
/*
Add your Visual Composer logic here.
Lets call vc_map function to "register" our custom shortcode within Visual Composer interface.
More info: http://kb.wpbakery.com/index.php?title=Vc_map
*/
vc_map( array(
"name" => __("My Bar Shortcode", 'vc_extend'),
"description" => __("Bar tag description text", 'vc_extend'),
"base" => "bartag",
"class" => "",
"controls" => "full",
"icon" => plugins_url('assets/asterisk_yellow.png', __FILE__), // or css class name which you can reffer in your css file later. Example: "vc_extend_my_class"
"category" => __('Content', 'js_composer'),
//'admin_enqueue_js' => array(plugins_url('assets/vc_extend.js', __FILE__)), // This will load js file in the VC backend editor
//'admin_enqueue_css' => array(plugins_url('assets/vc_extend_admin.css', __FILE__)), // This will load css file in the VC backend editor
"params" => array(
array(
"type" => "textfield",
"holder" => "div",
"class" => "",
"heading" => __("Text", 'vc_extend'),
"param_name" => "foo",
"value" => __("Default params value", 'vc_extend'),
"description" => __("Description for foo param.", 'vc_extend')
),
array(
"type" => "colorpicker",
"holder" => "div",
"class" => "",
"heading" => __("Text color", 'vc_extend'),
"param_name" => "color",
"value" => '#FF0000', //Default Red color
"description" => __("Choose text color", 'vc_extend')
),
array(
"type" => "textarea_html",
"holder" => "div",
"class" => "",
"heading" => __("Content", 'vc_extend'),
"param_name" => "content",
"value" => __("<p>I am test text block. Click edit button to change this text.</p>", 'vc_extend'),
"description" => __("Enter your content.", 'vc_extend')
),
)
) );
}
/*
Shortcode logic how it should be rendered
*/
public function renderMyBartag( $atts, $content = null ) {
extract( shortcode_atts( array(
'foo' => 'something',
'color' => '#FF0000'
), $atts ) );
$content = wpb_js_remove_wpautop($content, true); // fix unclosed/unwanted paragraph tags in $content
$output = "<div style='color:{$color};' data-foo='${foo}'>{$content}</div>";
return $output;
}
/*
Load plugin css and javascript files which you may need on front end of your site
*/
public function loadCssAndJs() {
wp_register_style( 'vc_extend_style', plugins_url('assets/vc_extend.css', __FILE__) );
wp_enqueue_style( 'vc_extend_style' );
// If you need any javascript files on front end, here is how you can load them.
//wp_enqueue_script( 'vc_extend_js', plugins_url('assets/vc_extend.js', __FILE__), array('jquery') );
}
/*
Show notice if your plugin is activated but Visual Composer is not
*/
public function showVcVersionNotice() {
$plugin_data = get_plugin_data(__FILE__);
echo '
<div class="updated">
<p>'.sprintf(__('<strong>%s</strong> requires <strong><a href="http://bit.ly/vcomposer" target="_blank">Visual Composer</a></strong> plugin to be installed and activated on your site.', 'vc_extend'), $plugin_data['Name']).'</p>
</div>';
}
}
// Finally initialize code
new VCExtendAddonClass();