如何在wordpress上创建elementor的小部件类别

时间:2019-03-24 07:37:32

标签: php wordpress web elementor

我想在wordpress上的元素编辑器中添加一个新类别。 我找到了链接https://developers.elementor.com/creating-a-new-widget/, 但我不知道该怎么办。因为我是初学者。 如何将代码添加到什么文件。 我的意思是一步一步。 如何在任何路径下制作php文件,以及如何包含该php文件? 我可以为此创建一个新的php文件吗?或将它们插入当前的element或php文件?

4 个答案:

答案 0 :(得分:2)

在您的插件文件夹中创建一个单独的文件(例如:helper.php),并将其包含在您的主插件加载器文件中。将以下代码粘贴到帮助文件中。这将在Elementor的小部件侧栏中创建一个单独的类别。

<?php 
namespace Elementor;

function category_elementor_init(){
    Plugin::instance()->elements_manager->add_category(
        'category-for-elementor',
        [
            'title'  => 'Elementor Category',
            'icon' => 'font'
        ],
        1
    );
}
add_action('elementor/init', 'Elementor\category_elementor_init');

答案 1 :(得分:2)

就像文档一样:Getting Started for extending Elementor

首先创建一个自定义插件,希望您知道如何创建一个自定义插件:Create plugins in wordpress

简短演示: 请记住,完整的 Elementor核心是用 OOP 编写的。 假设插件名称为 ElementorTest

<?php
/**
 * Plugin Name: ElementorTest
 * Plugin URI:  https://example.com/plugins/ElementorTest/
 * Description: Basic Elementor Extension
 * Version:     1.1
 * Author:      Ahmed Maruf
 * Author URI:  https://author.example.com/
 * License:     GPL2
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: elementortestplugin
 * Domain Path: /languages
 */

现在,我们需要确保对我们的插件php文件没有没有直接访问权限,并让我们创建 基本框架通过 Elementor 创建扩展名/小工具的方法。参考:Initialize the plugin

<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly.
}



final class Elementor_Test_Extension {

        const VERSION = "1.1"; //Your plugin version
        const MINIMUM_ELEMENTOR_VERSION = "2.0.0"; //Minimum Elementor Version Required
        const MINIMUM_PHP_VERSION = "7.0"; //Minimum PHP version required to run your plugin

        private static $_instance = null;
        /*The plugin class should use a singleton design pattern to make sure it loads only once*/
        public static function instance() {
            if ( is_null( self::$_instance ) ) {
             self::$_instance = new self();
         }return self::$_instance;

     }
     /*

      The constructor should initiate the plugin. The init process should check for basic requirements and then then run the plugin logic. Note that If one of the basic plugin requirements fails the plugin logic won’t run.
      */
      public function __construct() {
        add_action( 'plugins_loaded', [ $this, 'init' ] );
    }
    /*Initialize all the basic requirements to run the plugin logic*/
    public function init() {
        load_plugin_textdomain( 'elementortestplugin' );

        // Check if Elementor installed and activated
        if ( ! did_action( 'elementor/loaded' ) ) {
            add_action( 'admin_notices', [ $this, 'admin_notice_missing_main_plugin' ] );
            return;
        }

        // Check for required Elementor version
        if ( ! version_compare( ELEMENTOR_VERSION, self::MINIMUM_ELEMENTOR_VERSION, '>=' ) ) {
            add_action( 'admin_notices', [ $this, 'admin_notice_minimum_elementor_version' ] );
            return;
        }

        // Check for required PHP version
        if ( version_compare( PHP_VERSION, self::MINIMUM_PHP_VERSION, '<' ) ) {
            add_action( 'admin_notices', [ $this, 'admin_notice_minimum_php_version' ] );
            return;
        }

        // Add Plugin actions when rest requirements are passed
        add_action( 'elementor/widgets/widgets_registered', [ $this, 'init_widgets' ] );     

    }
    /*Callback function for the action hook admin notices*/
    public function admin_notice_missing_main_plugin() {

        if ( isset( $_GET['activate'] ) ) unset( $_GET['activate'] );

        $message = sprintf(
            /* translators: 1: Plugin name 2: Elementor */
            esc_html__( '"%1$s" requires "%2$s" to be installed and activated.', 'elementortestplugin' ),
            '<strong>' . esc_html__( 'Elementor Test Extension', 'elementortestplugin' ) . '</strong>',
            '<strong>' . esc_html__( 'Elementor', 'elementortestplugin' ) . '</strong>'
        );

        printf( '<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message );

    }

    /*Callback function for action hook admin notices upon elementor version not matching*/
    public function admin_notice_minimum_elementor_version() {

        if ( isset( $_GET['activate'] ) ) unset( $_GET['activate'] );

        $message = sprintf(
            /* translators: 1: Plugin name 2: Elementor 3: Required Elementor version */
            esc_html__( '"%1$s" requires "%2$s" version %3$s or greater.', 'elementortestplugin' ),
            '<strong>' . esc_html__( 'Elementor Test Extension', 'elementortestplugin' ) . '</strong>',
            '<strong>' . esc_html__( 'Elementor', 'elementortestplugin' ) . '</strong>',
            self::MINIMUM_ELEMENTOR_VERSION
        );

        printf( '<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message );

    }
    /*Callback function for action hood admin notices upon php version not matched*/
    public function admin_notice_minimum_php_version() {

        if ( isset( $_GET['activate'] ) ) unset( $_GET['activate'] );

        $message = sprintf(
            /* translators: 1: Plugin name 2: PHP 3: Required PHP version */
            esc_html__( '"%1$s" requires "%2$s" version %3$s or greater.', 'elementortestplugin' ),
            '<strong>' . esc_html__( 'Elementor Test Extension', 'elementortestplugin' ) . '</strong>',
            '<strong>' . esc_html__( 'PHP', 'elementortestplugin' ) . '</strong>',
            self::MINIMUM_PHP_VERSION
        );

        printf( '<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message );

    }

    /*
    @Callback function for the action hook elementor/widgets/widgets_registered
    @Create the folder widgets and the file under you custom plugin /widgets/test-widget.php
    */
    public function init_widgets() {

        // Include Widget files
        require_once( __DIR__ . '/widgets/test-widget.php' );

        // Register widget by creating the class in the file you have created naming as test-widget.php
        \Elementor\Plugin::instance()->widgets_manager->register_widget_type( new \Elementor_Test_Widget() );

    }

    public function includes() {}

}
Elementor_Test_Extension::instance();

现在在youtplugin / widgets / test-widget.php下创建一个类。参考:Creating the core widget functionality

class Elementor_Test_Widget extends \Elementor\Widget_Base
{
    /**
     * Define your core logic for the widget
     */
    public function __construct()
    {

    }
}

休息很容易说明。对于小部件类别,骨架也相似。希望这会有所帮助。

答案 2 :(得分:0)

谢谢您的回答,艾哈迈德。我已经跟着你走了。 但是我有一个要解决的问题。我添加了以下代码,但找不到测试类别。什么都没发生。

(test-widget.php)

/**
 * Elementor oEmbed Widget.
 *
 * Elementor widget that inserts an embbedable content into the page, from any given URL.
 *
 * @since 1.0.0
 */
class Elementor_Test_Widget extends \Elementor\Widget_Base {

    /**
     * Get widget name.
     *
     * Retrieve oEmbed widget name.
     *
     * @since 1.0.0
     * @access public
     *
     * @return string Widget name.
     */
    public function get_name() {
        return 'test';
    }

    /**
     * Get widget title.
     *
     * Retrieve oEmbed widget title.
     *
     * @since 1.0.0
     * @access public
     *
     * @return string Widget title.
     */
    public function get_title() {
        return __( 'test', 'ElementorTest' );
    }

    /**
     * Get widget icon.
     *
     * Retrieve oEmbed widget icon.
     *
     * @since 1.0.0
     * @access public
     *
     * @return string Widget icon.
     */
    public function get_icon() {
        return 'fa fa-code';
    }

    /**
     * Get widget categories.
     *
     * Retrieve the list of categories the oEmbed widget belongs to.
     *
     * @since 1.0.0
     * @access public
     *
     * @return array Widget categories.
     */
    public function get_categories() {
        return [ 'general' ];
    }

    /**
     * Register oEmbed widget controls.
     *
     * Adds different input fields to allow the user to change and customize the widget settings.
     *
     * @since 1.0.0
     * @access protected
     */
    protected function _register_controls() {

        $this->start_controls_section(
            'content_section',
            [
                'label' => __( 'Content', 'ElementorTest' ),
                'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
            ]
        );

        $this->add_control(
            'url',
            [
                'label' => __( 'URL to embed', 'ElementorTest' ),
                'type' => \Elementor\Controls_Manager::TEXT,
                'input_type' => 'url',
                'placeholder' => __( 'https://your-link.com', 'ElementorTest' ),
            ]
        );

        $this->end_controls_section();

    }

    /**
     * Render oEmbed widget output on the frontend.
     *
     * Written in PHP and used to generate the final HTML.
     *
     * @since 1.0.0
     * @access protected
     */
    protected function render() {

        $settings = $this->get_settings_for_display();

        $html = wp_oembed_get( $settings['url'] );

        echo '<div class="test-elementor-widget">';

        echo ( $html ) ? $html : $settings['url'];

        echo '</div>';

    }

}         函数add_elementor_widget_categories($ elements_manager){

        $elements_manager->add_category(
            'first-category',
            [
                'title' => __( 'First Category', 'ElementorTest' ),
                'icon' => 'fa fa-plug',
            ]
        );
        $elements_manager->add_category(
            'second-category',
            [
                'title' => __( 'Second Category', 'ElementorTest' ),
                'icon' => 'fa fa-plug',
            ]
        );

    }
    add_action( 'elementor/elements/categories_registered', 'add_elementor_widget_categories' );

请检查一下1

并进行检查。2

(ElementorTest.php)

/**
 * Plugin Name: ElementorTest
 * Plugin URI:  https://localhost:4431/wp/plugins/ElementorTest/
 * Description: Basic Elementor Extension
 * Version:     1.1
 * Author:      Ahmed Maruf
 * Author URI:  https://localhost:4431/wp/
 * Text Domain: elementortestplugin
 * Domain Path: /languages
 */
if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly.
}



final class Elementor_Test_Extension {

        const VERSION = "1.1"; //Your plugin version
        const MINIMUM_ELEMENTOR_VERSION = "2.0.0"; //Minimum Elementor Version Required
        const MINIMUM_PHP_VERSION = "7.0"; //Minimum PHP version required to run your plugin

        private static $_instance = null;
        /*The plugin class should use a singleton design pattern to make sure it loads only once*/
        public static function instance() {
            if ( is_null( self::$_instance ) ) {
             self::$_instance = new self();
         }return self::$_instance;

     }
     /*

      The constructor should initiate the plugin. The init process should check for basic requirements and then then run the plugin logic. Note that If one of the basic plugin requirements fails the plugin logic won’t run.
      */
      public function __construct() {
        add_action( 'plugins_loaded', [ $this, 'init' ] );
    }
    /*Initialize all the basic requirements to run the plugin logic*/
    public function init() {
        load_plugin_textdomain( 'elementortestplugin' );

        // Check if Elementor installed and activated
        if ( ! did_action( 'elementor/loaded' ) ) {
            add_action( 'admin_notices', [ $this, 'admin_notice_missing_main_plugin' ] );
            return;
        }

        // Check for required Elementor version
        if ( ! version_compare( ELEMENTOR_VERSION, self::MINIMUM_ELEMENTOR_VERSION, '>=' ) ) {
            add_action( 'admin_notices', [ $this, 'admin_notice_minimum_elementor_version' ] );
            return;
        }

        // Check for required PHP version
        if ( version_compare( PHP_VERSION, self::MINIMUM_PHP_VERSION, '<' ) ) {
            add_action( 'admin_notices', [ $this, 'admin_notice_minimum_php_version' ] );
            return;
        }

        // Add Plugin actions when rest requirements are passed
        add_action( 'elementor/widgets/widgets_registered', [ $this, 'init_widgets' ] );     

    }
    /*Callback function for the action hook admin notices*/
    public function admin_notice_missing_main_plugin() {

        if ( isset( $_GET['activate'] ) ) unset( $_GET['activate'] );

        $message = sprintf(
            /* translators: 1: Plugin name 2: Elementor */
            esc_html__( '"%1$s" requires "%2$s" to be installed and activated.', 'elementortestplugin' ),
            '<strong>' . esc_html__( 'Elementor Test Extension', 'elementortestplugin' ) . '</strong>',
            '<strong>' . esc_html__( 'Elementor', 'elementortestplugin' ) . '</strong>'
        );

        printf( '<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message );

    }

    /*Callback function for action hook admin notices upon elementor version not matching*/
    public function admin_notice_minimum_elementor_version() {

        if ( isset( $_GET['activate'] ) ) unset( $_GET['activate'] );

        $message = sprintf(
            /* translators: 1: Plugin name 2: Elementor 3: Required Elementor version */
            esc_html__( '"%1$s" requires "%2$s" version %3$s or greater.', 'elementortestplugin' ),
            '<strong>' . esc_html__( 'Elementor Test Extension', 'elementortestplugin' ) . '</strong>',
            '<strong>' . esc_html__( 'Elementor', 'elementortestplugin' ) . '</strong>',
            self::MINIMUM_ELEMENTOR_VERSION
        );

        printf( '<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message );

    }
    /*Callback function for action hood admin notices upon php version not matched*/
    public function admin_notice_minimum_php_version() {

        if ( isset( $_GET['activate'] ) ) unset( $_GET['activate'] );

        $message = sprintf(
            /* translators: 1: Plugin name 2: PHP 3: Required PHP version */
            esc_html__( '"%1$s" requires "%2$s" version %3$s or greater.', 'elementortestplugin' ),
            '<strong>' . esc_html__( 'Elementor Test Extension', 'elementortestplugin' ) . '</strong>',
            '<strong>' . esc_html__( 'PHP', 'elementortestplugin' ) . '</strong>',
            self::MINIMUM_PHP_VERSION
        );

        printf( '<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message );

    }

    /*
    @Callback function for the action hook elementor/widgets/widgets_registered
    @Create the folder widgets and the file under you custom plugin /widgets/test-widget.php
    */
    public function init_widgets() {

        // Include Widget files
        require_once( __DIR__ . '/widgets/test-widget.php' );

        // Register widget by creating the class in the file you have created naming as test-widget.php
        \Elementor\Plugin::instance()->widgets_manager->register_widget_type( new \Elementor_Test_Widget() );

    }

    public function includes() {}

}
Elementor_Test_Extension::instance();

答案 3 :(得分:0)

非常感谢! 我现在做了一个新的小部件类别。 我想制作新的部分和控件。

[请检查以下链接。] [希望制作新的部分和控件]

[1]:https:cl.ly/b29f0a0b09da