How to create custom elementor widget
Create a plugin compatible with Elementor Plugin wordpress - Part 01/03 - Juan Jimenez - https://juanjimeneztj.com/
Review the video and the steps to follow to configure the plugin, it is very important for the correct operation of it.
Repository:
-- SSH: git@github.com:juanjimeneztj/a-filters-gsweb.git
-- HTTPS: https://github.com/juanjimeneztj/a-filters-gsweb.git
Index.php
<?php
// Silence is golden.a-filters-gsweb.php
<?php
/*
Plugin Name: A Filters GSWEB
Description: Posts filter.
Version: 1.0.0
Author: Juan Jimenez
Author: URI: https://juanjimeneztj.com/
License: GPL2+
Text Domain: Juan Jimenez
*/
if(!defined('ABSPATH')) exit;
final class a_filters_gsweb{
const VERSION = '1.0.0';
const MINIMUM_ELEMENTOR_VERSION = '2.0.0';
const MINIMUM_PHP_VERSION = '7.0';
public function __construct(){
add_action('init', array($this,'i18n'));
add_action('plugins_loaded', array($this, 'init'));
}
public function i18n(){
load_plugin_textdomain('a-filters-gsweb');
}
public function init(){
if(! did_action('elementor/loaded')){
add_action('admin_notice',array($this, 'admin_notice_missing_main_plugi n'));
return;
}
if(! version_compare(ELEMENTOR_VERSION, self::MINIMUM_ELEMENTOR_VERSION, '>=')){
add_action('admin_notice',array($this, 'admin_notice_minimum_elementor_vers ion'));
return;
}
if(version_compare(PHP_VERSION, self::MINIMUM_PHP_VERSION, '<')){
add_action('admin_notice',array($this, 'admin_notice_minimum_php_versio n'));
return;
}
require_once('plugin.php');
}
public function admin_notice_missing_main_plugin(){
if(isset($_GET['activate'])){
unset($_GET['activate']);
}
$msg = sprintf(
esc_html__('"%1$s" requires "%2$s" to be installed and activated.', 'a-filt ers-gsweb'),
'<strong>' . esc_html__('A Filters GSWEB', 'a-filters-gsweb') . '</strong>',
'<strong>' . esc_html__('Elementor', 'a-filters-gsweb') . '</strong>'
);
printf('<div class="notice notice-warning is-dismissible">%1$s</div>', $msg);
}
public function admin_notice_minimum_elementor_version(){
if(isset($_GET['activate'])){
unset($_GET['activate']);
}
$msg = sprintf(
esc_html__('"%1$s" requires "%2$s" version %3$s or greater.', 'a-filters-gs web'),
'<strong>' . esc_html__('A Filters GSWEB', 'a-filters-gsweb') . '</strong>',
'<strong>' . esc_html__('Elementor', 'a-filters-gsweb') . '</strong>',
self::MINIMUM_ELEMENTOR_VERSION
);
printf('<div class="notice notice-warning is-dismissible">%1$s</div>', $msg);
}
public function admin_notice_minimum_php_version(){
if(isset($_GET['activate'])){
unset($_GET['activate']);
}
$msg = sprintf(
esc_html__('"%1$s" requires "%2$s" version %3$s or greater.', 'a-filters-gs web'),
'<strong>' . esc_html__('A Filters GSWEB', 'a-filters-gsweb') . '</strong>',
'<strong>' . esc_html__('PHP', 'a-filters-gsweb') . '</strong>',
self::MINIMUM_PHP_VERSION
);
printf('<div class="notice notice-warning is-dismissible">%1$s</div>', $msg);
}
}
new a_filters_gsweb();
plugin.php
<?php
namespace JuanJimenezTJAFiltersGSWEB;
class Plugin {
private static $_instance = null;
public static function instance(){
if(is_null(self::$_instance)){
self::$_instance = new self();
}
return self::$_instance;
}
public function include_widgets_files(){
require_once(__DIR__.'/widgets/a-filters-gsweb-widget.php');
require_once(__DIR__.'/widgets/inline-editing.php');
}
public function register_widgets(){
$this->include_widgets_files();
\Elementor\Plugin::instance()->widgets_manager->register_widget_type( new Widgets\a_filters_gsweb() );
\Elementor\Plugin::instance()->widgets_manager->register_widget_type( new Widgets\Inline_Editing() );
}
public function __construct(){
add_action('elementor/widgets/widgets_registered',[$this, 'register_widgets']);
}
}
Plugin::instance();
widgets/inline-editing.php
<?php
namespace JuanJimenezTJAFiltersGSWEB\Widgets;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
if(!defined('ABSPATH')) exit;
class Inline_Editing extends Widget_Base{
public function get_name(){
return 'inline-editing-example';
}
public function get_title(){
return __('Inline Editing', 'a-filters-gsweb');
}
public function get_icon(){
return 'fa fa-pencil';
}
public function get_categories(){
return ['general'];
}
protected function _register_controls(){
$this->start_controls_section(
'section_content',
[
'label' => __('content', 'a-filters-gsweb'),
]
);
$this->add_control(
'title',
[
'label' => __('Title', 'a-filters-gsweb'),
'type' => Controls_Manager::TEXT,
'default' => __('Title', 'a-filters-gsweb'),
]
);
$this->end_controls_section();
}
protected function render(){
$settings = $this->get_settings_for_display();
$this->add_inline_editing_attributes('title','none');
?>
<h1 <?php echo $this->get_render_attribute_string('title') ?>><?php echo $settings['title']?></h1>
<?php
}
protected function _content_template(){
?>
<#
view.addInlineEditingAttributes('title','none');
#>
<h1 {{{ view.getRenderAttributeString('title') }}}>{{{ settings.title }}}</h1>
<?php
}
}
widgets/a-filters-gsweb-widget.php
<?php
namespace JuanJimenezTJAFiltersGSWEB\Widgets;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
if(!defined('ABSPATH')) exit;
class a_filters_gsweb extends Widget_Base{
public function get_name(){
return 'a-filters-gsweb';
}
public function get_title(){
return __('A Filters GSWEB', 'a-filters-gsweb');
}
public function get_icon(){
return 'eicon-tags';
}
public function get_categories(){
return ['basic'];
}
public function get_script_depends(){
return ['a-filters-gsweb'];
}
protected function _register_controls(){
$this->start_controls_section(
'section_content',
[
'label' => __('content', 'a-filters-gsweb'),
]
);
$this->add_control(
'title',
[
'label' => __('Title', 'a-filters-gsweb'),
'type' => Controls_Manager::TEXT,
'placeholder' => 'Enter here the title'
]
);
$this->end_controls_section();
}
protected function render(){
$settings = $this->get_settings_for_display();
$html = "<div><h1>".$settings['title']."</h1></div>";
echo $html;
}
protected function _content_template(){
?>
<div>
<#
if(settings.title){
#>
<h1>{{{ settings.title }}}</h1>
<#
}
#>
</div>
<?php
}
}