]> _ Git - c6-wordpress.git/commitdiff
WIP #2686 @1
authornael <nael@cubedesigners.com>
Wed, 24 Apr 2019 16:33:25 +0000 (18:33 +0200)
committernael <nael@cubedesigners.com>
Wed, 24 Apr 2019 16:33:25 +0000 (18:33 +0200)
wp-content/mu-plugins/cube/src/Elementor/Setup.php
wp-content/mu-plugins/cube/src/Elementor/Widgets/Heading.php [new file with mode: 0644]
wp-content/themes/c6/resources/assets/styles/widgets/heading.styl [new file with mode: 0644]

index 0bf74edb6d06dda5caff8e67df2a35e91a39d3a1..a6298ad83a378d2230d899969f1bcd0fb231a8ed 100644 (file)
@@ -33,6 +33,7 @@ class Setup {
         $elementor->widgets_manager->register_widget_type( new Widgets\PageHeading() );
         $elementor->widgets_manager->register_widget_type( new Widgets\HeroBlock() );
         $elementor->widgets_manager->register_widget_type( new Widgets\TextBlock() );
+        $elementor->widgets_manager->register_widget_type( new Widgets\Heading() );
     }
 
     protected function _customise_sections() {
diff --git a/wp-content/mu-plugins/cube/src/Elementor/Widgets/Heading.php b/wp-content/mu-plugins/cube/src/Elementor/Widgets/Heading.php
new file mode 100644 (file)
index 0000000..70fcf19
--- /dev/null
@@ -0,0 +1,147 @@
+<?php
+
+namespace Cube\Elementor\Widgets;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+use Elementor\Scheme_Color;
+
+
+/**
+ * Class Subtitle
+ * @package Cube\Elementor\Widgets
+ */
+class Heading extends Widget_Base
+{
+
+    // Widget name / ID
+    public function get_name() {
+        return 'cube-heading';
+    }
+
+    // Elementor widget title
+    public function get_title() {
+        return __('Custom Heading', 'cube');
+    }
+
+    // Elementor interface icon
+    public function get_icon() {
+        return 'eicon-align-left';
+    }
+
+    // Where to display the widget in the Elementor interface
+    public function get_categories() {
+        return ['theme-elements'];
+    }
+
+    /**
+     * List of scripts the widget depends on.
+     * Used to set scripts dependencies required to run the widget.
+     *
+     * @since 1.0.0
+     * @access public
+     * @return array Widget scripts dependencies.
+     */
+    public function get_script_depends() {
+        return [];
+    }
+
+    /**
+     * Register the 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(
+            'section_content',
+            [
+                'label' => __('Content', 'cube'),
+            ]
+        );
+
+        $this->add_control(
+            'title',
+            [
+                'label' => __('Title', 'elementor'),
+                'type' => Controls_Manager::TEXTAREA,
+                'placeholder' => __('Enter your title', 'elementor'),
+                'default' => '',
+            ]
+        );
+
+        $this->add_control(
+            'subtitle',
+            [
+                'label' => __('Subtitle', 'cube'),
+                'type' => Controls_Manager::TEXT,
+                'default' => '',
+            ]
+        );
+
+        $this->end_controls_section();
+
+    }
+
+    /**
+     * Render the widget output on the frontend.
+     * Written in PHP and used to generate the final HTML.
+     *
+     * @since 1.0.0
+     * @access protected
+     */
+    protected function render() {
+
+        $subtitle = $this->get_settings('subtitle');
+        $title = $this->get_settings('title');
+
+        // Inline Editing settings
+        $this->add_inline_editing_attributes('subtitle', 'none');
+        $this->add_inline_editing_attributes('title', 'none');
+
+        // CSS Classes for elements
+        $this->add_render_attribute('subtitle', 'class', ['heading-subtitle']);
+        $this->add_render_attribute('title', 'class', ['heading-title']);
+
+        // Rendered content
+        echo '<div class="heading"> ';
+        if (!empty($subtitle)) echo "<h3 {$this->get_render_attribute_string('subtitle')}>$subtitle</h3>";
+        if (!empty($title)) echo "<h2 {$this->get_render_attribute_string('title')}>$title</h2>";
+
+        echo '</div> ';
+    }
+
+    /**
+     * Render text editor widget output in the editor.
+     *
+     * Written as a Backbone JavaScript template and used to generate the live preview.
+     *
+     * @since 1.0.0
+     * @access protected
+     */
+    protected function _content_template() {
+        ?>
+        <#
+        view.addRenderAttribute( 'subtitle', 'class', ['heading-subtitle']);
+        view.addRenderAttribute( 'title', 'class', ['heading-title']);
+
+        view.addInlineEditingAttributes( 'subtitle', 'none' );
+        view.addInlineEditingAttributes( 'title', 'none' );
+
+        #>
+        <div class="heading">
+
+            <# if ('' !== settings.subtitle) { #>
+            <h3 {{{ view.getRenderAttributeString( 'subtitle' ) }}}>{{{ settings.subtitle }}}</h3>
+            <# } #>
+
+            <# if ('' !== settings.title) { #>
+            <h2 {{{ view.getRenderAttributeString( 'title' ) }}}>{{{ settings.title }}}</h2>
+            <# } #>
+        </div>
+        <?php
+    }
+
+}
diff --git a/wp-content/themes/c6/resources/assets/styles/widgets/heading.styl b/wp-content/themes/c6/resources/assets/styles/widgets/heading.styl
new file mode 100644 (file)
index 0000000..335c20d
--- /dev/null
@@ -0,0 +1,20 @@
+.heading
+  position: relative
+
+  &-subtitle
+    writing-mode: vertical-lr
+    transform: rotate(180deg)
+    text-orientation: sideways
+    margin: 0
+    position: absolute
+    transform-origin: top right
+    top: 5.5em
+    left: -5em
+    border-left: 2px solid
+    padding-left: 0.25em
+    text-transform: uppercase
+    font-size: 12px fixed
+    color: $colors.orange
+
+  &-title
+    font-weight: 700
\ No newline at end of file