Elementor或WordPress会在我的定制小部件中随机添加单词“ARRAY”

时间:2019-09-11 作者:Alder French

我正在为elementor构建一个自定义小部件,以帮助我的客户自己向网站添加项目,而无需编码知识。我差点就完成了,突然遇到了一个非常奇怪的问题。我设置了一个链接到新页面的按钮,出于某种原因,它将文本“array”放入自身。

我尝试通过编辑html直接将文本放入“数组”文本所在的位置。当我在wordpress上更新或进入预览模式时,此文本消失,单词“array”再次出现。我甚至在按钮上添加了一个字段,我的客户或我可以在其中添加我们自己的文本来解决这个问题,但现在文本前面只加了“array”。见下文。

之前:Before

之后:After

我所有的相关代码都在我的awesomesauce中。我的小部件代码所在的php文件。

<?php
namespace ElementorAwesomesauce\\Widgets;

use Elementor\\Widget_Base;
use Elementor\\Controls_Manager;

if ( ! defined( \'ABSPATH\' ) ) exit; // Exit if accessed directly

/**
 * @since 1.1.0
 */
class Awesomesauce extends Widget_Base {

  /**
   * Retrieve the widget name.
   *
   * @since 1.1.0
   *
   * @access public
   *
   * @return string Widget name.
   */
  public function get_name() {
    return \'awesomesauce\';
  }

  /**
   * Retrieve the widget title.
   *
   * @since 1.1.0
   *
   * @access public
   *
   * @return string Widget title.
   */
  public function get_title() {
    return __( \'Awesomesauce\', \'elementor-awesomesauce\' );
  }

  /**
   * Retrieve the widget icon.
   *
   * @since 1.1.0
   *
   * @access public
   *
   * @return string Widget icon.
   */
  public function get_icon() {
    return \'fa fa-pencil\';
  }

  /**
   * Retrieve the list of categories the widget belongs to.
   *
   * Used to determine where to display the widget in the editor.
   *
   * Note that currently Elementor supports only one category.
   * When multiple categories passed, Elementor uses the first one.
   *
   * @since 1.1.0
   *
   * @access public
   *
   * @return array Widget categories.
   */
  public function get_categories() {
    return [ \'general\' ];
  }

  /**
   * Register the widget controls.
   *
   * Adds different input fields to allow the user to change and customize the widget settings.
   *
   * @since 1.1.0
   *
   * @access protected
   */
  protected function _register_controls() {
    $this->start_controls_section(
      \'section_content\',
      [
        \'label\' => __( \'Content\', \'elementor-awesomesauce\' ),
      ]
    );

    $this->add_control(
      \'title\',
      [
        \'label\' => __( \'Title\', \'elementor-awesomesauce\' ),
        \'type\' => Controls_Manager::TEXT,
        \'default\' => __( \'Car Title\', \'elementor-awesomesauce\' ),
      ]
    );

    $this->add_control(
      \'description\',
      [
        \'label\' => __( \'Description\', \'elementor-awesomesauce\' ),
        \'type\' => Controls_Manager::TEXTAREA,
        \'default\' => __( \'Sold or Currently available\', \'elementor-awesomesauce\' ),
      ]
    );

    $this->add_control(
      \'content\',
      [
        \'label\' => __( \'Content\', \'elementor-awesomesauce\' ),
        \'type\' => Controls_Manager::WYSIWYG,
        \'default\' => __( \'Remove this text and insert media\', \'elementor-awesomesauce\' ),
      ]
    );

    $this->add_control(
            \'link\',
            [
                \'label\' => __( \'Link\', \'elementor-awesomesauce\' ),
                \'type\' => Controls_Manager::URL,
                \'dynamic\' => [
                    \'active\' => true,
                ],
                \'placeholder\' => __( \'https://your-link.com\', \'elementor-awesomesauce\' ),
                \'default\' => [
                    \'url\' => \'#\',
                ],

            ]
        );

    $this->add_control(
            \'text\',
            [
                \'label\' => __( \'Text\', \'elementor\' ),
                \'type\' => Controls_Manager::TEXT,
                \'dynamic\' => [
                    \'active\' => true,
                ],
                \'default\' => __( \'Click here\', \'elementor\' ),
                \'placeholder\' => __( \'Click here\', \'elementor\' ),
            ]
        );


    $this->end_controls_section();
  }

  /**
   * Render the widget output on the frontend.
   *
   * Written in PHP and used to generate the final HTML.
   *
   * @since 1.1.0
   *
   * @access protected
   */
  protected function render() {
    $settings = $this->get_settings_for_display();

    $this->add_inline_editing_attributes( \'title\', \'none\' );
    $this->add_inline_editing_attributes( \'description\', \'basic\' );
    $this->add_inline_editing_attributes( \'content\', \'advanced\' );
    $this->add_inline_editing_attributes( \'link\', \'none\');
    $this->add_inline_editing_attributes( \'text\', \'basic\');

    // Add render attributes to add classes to html elements h2, article, figure, and div

    $this->add_render_attribute( \'title\', \'class\', \'title is-5\');
    $this->add_render_attribute( \'description\', \'class\', \'subtitle\');
    $this->add_render_attribute( \'content\', \'class\', \'image is-4by3\');
    $this->add_render_attribute( \'link\', \'class\', \'button is-rounded is-fullwidth\');

    $this->add_render_attribute( \'wrapper\', \'class\', \'tile is-parent\');
    $this->add_render_attribute( \'wrappertwo\', \'class\', \'tile is-child box\');
    $this->add_render_attribute( \'text\', \'class\', \'subtitle has-text-right\');

    ?>

    <div <?php echo $this->get_render_attribute_string( \'wrapper\' ); ?>><?php echo $settings[\'wrapper\']; ?>
      <div <?php echo $this->get_render_attribute_string( \'wrappertwo\' ); ?>><?php echo $settings[\'wrappertwo\']; ?>
        <h2 <?php echo $this->get_render_attribute_string( \'title\' ); ?>><?php echo $settings[\'title\']; ?></h2>
        <div <?php echo $this->get_render_attribute_string( \'description\' ); ?>><?php echo $settings[\'description\']; ?></div>
        <div <?php echo $this->get_render_attribute_string( \'content\' ); ?>><?php echo $settings[\'content\']; ?></div>
        <div <?php echo $this->get_render_attribute_string( \'link\' ); ?>><?php echo $settings[\'link\']; ?>
          <div <?php echo $this->get_render_attribute_string( \'text\'); ?>><?php echo $settings[\'text\']; ?></div>
        </div>
      </div>

    </div>


    <?php
  }

  /**
   * Render the widget output in the editor.
   *
   * Written as a Backbone JavaScript template and used to generate the live preview.
   *
   * @since 1.1.0
   *
   * @access protected
   */
  protected function _content_template() {
    ?>
    <#
    view.addInlineEditingAttributes( \'title\', \'none\' );
    view.addInlineEditingAttributes( \'description\', \'basic\' );
    view.addInlineEditingAttributes( \'content\', \'advanced\' );
    view.addInlineEditingAttributes( \'car_image\', \'advanced\');
    #>
    <div \' + view.getRenderAttributeString( \'wrapper\' ) + \' >
      <article \' + view.getRenderAttributeString( \'wrappertwo\' ) + \' >
        <h2 class="title is-5" {{{ view.getRenderAttributeString( \'title\' ) }}}>{{{ settings.title }}}</h2>
        <div class="subtitle" {{{ view.getRenderAttributeString( \'description\' ) }}}>{{{ settings.description }}}</div>
        <figure class="image is-4by3" {{{ view.getRenderAttributeString( \'content\' ) }}}>{{{ settings.content }}}</figure>
            <a href="{{ settings.link.url }}" class="button is-rounded is-fullwidth">
              <span {{{ view.getRenderAttributeString( \'text\' ) }}}>{{{ settings.text }}}</span>
            </a>
      </article>
    </div>
    <?php
  }
}

1 个回复
最合适的回答,由SO网友:Liton Arefin 整理而成


我指出了一些事情-
首先,没有锚(a)标记
其次,当您呈现URL时,您需要的输出参数很少,例如“URL”、“id”。在您的案例中,您需要“url”。我已经编辑了完整的代码库,并为您带来新鲜感<请看一下,我已经测试过了。

<?php
  namespace ElementorAwesomesauce\\Widgets;

  use Elementor\\Widget_Base;
  use Elementor\\Controls_Manager;

  if ( ! defined( \'ABSPATH\' ) ) exit; // Exit if accessed directly

  /**
   * @since 1.1.0
   */
  class Awesomesauce extends Widget_Base {
    /**
     * Retrieve the widget name.
     *
     * @since 1.1.0
     *
     * @access public
     *
     * @return string Widget name.
     */
    public function get_name() {
      return \'awesomesauce\';
    }

    /**
     * Retrieve the widget title.
     *
     * @since 1.1.0
     *
     * @access public
     *
     * @return string Widget title.
     */
    public function get_title() {
      return __( \'Awesomesauce\', \'elementor-awesomesauce\' );
    }

    /**
     * Retrieve the widget icon.
     *
     * @since 1.1.0
     *
     * @access public
     *
     * @return string Widget icon.
     */
    public function get_icon() {
      return \'fa fa-pencil\';
    }

    /**
     * Retrieve the list of categories the widget belongs to.
     *
     * Used to determine where to display the widget in the editor.
     *
     * Note that currently Elementor supports only one category.
     * When multiple categories passed, Elementor uses the first one.
     *
     * @since 1.1.0
     *
     * @access public
     *
     * @return array Widget categories.
     */
    public function get_categories() {
      return [ \'general\' ];
    }

    /**
     * Register the widget controls.
     *
     * Adds different input fields to allow the user to change and customize the widget settings.
     *
     * @since 1.1.0
     *
     * @access protected
     */
    protected function _register_controls() {
      $this->start_controls_section(
        \'section_content\',
        [
          \'label\' => __( \'Content\', \'elementor-awesomesauce\' ),
        ]
      );

      $this->add_control(
        \'title\',
        [
          \'label\' => __( \'Title\', \'elementor-awesomesauce\' ),
          \'type\' => Controls_Manager::TEXT,
          \'default\' => __( \'Car Title\', \'elementor-awesomesauce\' ),
        ]
      );

      $this->add_control(
        \'description\',
        [
          \'label\' => __( \'Description\', \'elementor-awesomesauce\' ),
          \'type\' => Controls_Manager::TEXTAREA,
          \'default\' => __( \'Sold or Currently available\', \'elementor-awesomesauce\' ),
        ]
      );

      $this->add_control(
        \'content\',
        [
          \'label\' => __( \'Content\', \'elementor-awesomesauce\' ),
          \'type\' => Controls_Manager::WYSIWYG,
          \'default\' => __( \'Remove this text and insert media\', \'elementor-awesomesauce\' ),
        ]
      );

      $this->add_control(
              \'link\',
              [
                  \'label\' => __( \'Link\', \'elementor-awesomesauce\' ),
                  \'type\' => Controls_Manager::URL,
                  \'dynamic\' => [
                      \'active\' => true,
                  ],
                  \'placeholder\' => __( \'https://your-link.com\', \'elementor-awesomesauce\' ),
                  \'default\' => [
                      \'url\' => \'#\',
                  ],

              ]
          );

      $this->add_control(
              \'text\',
              [
                  \'label\' => __( \'Text\', \'elementor\' ),
                  \'type\' => Controls_Manager::TEXT,
                  \'dynamic\' => [
                      \'active\' => true,
                  ],
                  \'default\' => __( \'Click here\', \'elementor\' ),
                  \'placeholder\' => __( \'Click here\', \'elementor\' ),
              ]
          );


      $this->end_controls_section();
    }

    /**
     * Render the widget output on the frontend.
     *
     * Written in PHP and used to generate the final HTML.
     *
     * @since 1.1.0
     *
     * @access protected
     */
    protected function render() {
      $settings = $this->get_settings_for_display();

      $this->add_inline_editing_attributes( \'title\', \'none\' );
      $this->add_inline_editing_attributes( \'description\', \'basic\' );
      $this->add_inline_editing_attributes( \'content\', \'advanced\' );
      $this->add_inline_editing_attributes( \'link\', \'none\');
      $this->add_inline_editing_attributes( \'awesomesauce_text\', \'basic\');

      // Add render attributes to add classes to html elements h2, article, figure, and div

      $this->add_render_attribute( \'title\', \'class\', \'title is-5\');
      $this->add_render_attribute( \'description\', \'class\', \'subtitle\');
      $this->add_render_attribute( \'content\', \'class\', \'image is-4by3\');
      // $this->add_render_attribute( \'link\', \'class\', \'button is-rounded is-fullwidth\');


      $this->add_render_attribute( \'awesomesauce_link\', [
        \'class\' =>  \'button is-rounded is-fullwidth\',
        \'href\'  => esc_url_raw($settings[\'link\'][\'url\'] ),

      ]);


      if( $settings[\'awesomesauce_link\'][\'is_external\'] ) {
        $this->add_render_attribute( \'link\', \'target\', \'_blank\' );
      }

      if( $settings[\'awesomesauce_link\'][\'nofollow\'] ) {
        $this->add_render_attribute( \'link\', \'rel\', \'nofollow\' );
      }



      $this->add_render_attribute( \'wrapper\', \'class\', \'tile is-parent\');
      $this->add_render_attribute( \'wrappertwo\', \'class\', \'tile is-child box\');
      $this->add_render_attribute( \'awesomesauce_text\', [\'class\'=> \'subtitle has-text-right\']);

      ?>

      <div <?php echo $this->get_render_attribute_string( \'wrapper\' ); ?>><?php echo $settings[\'wrapper\']; ?>
        <div <?php echo $this->get_render_attribute_string( \'wrappertwo\' ); ?>><?php echo $settings[\'wrappertwo\']; ?>
          <h2 <?php echo $this->get_render_attribute_string( \'title\' ); ?>><?php echo $settings[\'title\']; ?></h2>
          <div <?php echo $this->get_render_attribute_string( \'description\' ); ?>><?php echo $settings[\'description\']; ?></div>
          <div <?php echo $this->get_render_attribute_string( \'content\' ); ?>><?php echo $settings[\'content\']; ?></div>
          <a <?php echo $this->get_render_attribute_string( \'awesomesauce_link\' ); ?>>
            <?php //echo $settings[\'link\'][\'url\']; ?>
            <span <?php echo $this->get_render_attribute_string( \'awesomesauce_text\'); ?>>
              <?php echo $settings[\'text\']; ?>              
              </span>
          </a>
        </div>

      </div>


      <?php
    }

    /**
     * Render the widget output in the editor.
     *
     * Written as a Backbone JavaScript template and used to generate the live preview.
     *
     * @since 1.1.0
     *
     * @access protected
     */
    protected function _content_template() {
      ?>
      <#
      view.addInlineEditingAttributes( \'title\', \'none\' );
      view.addInlineEditingAttributes( \'description\', \'basic\' );
      view.addInlineEditingAttributes( \'content\', \'advanced\' );
      view.addInlineEditingAttributes( \'car_image\', \'advanced\');
      #>
      <div \' + view.getRenderAttributeString( \'wrapper\' ) + \' >
        <article \' + view.getRenderAttributeString( \'wrappertwo\' ) + \' >
          <h2 class="title is-5" {{{ view.getRenderAttributeString( \'title\' ) }}}>{{{ settings.title }}}</h2>
          <div class="subtitle" {{{ view.getRenderAttributeString( \'description\' ) }}}>{{{ settings.description }}}</div>
          <figure class="image is-4by3" {{{ view.getRenderAttributeString( \'content\' ) }}}>{{{ settings.content }}}</figure>
              <a href="{{ settings.link.url }}" class="button is-rounded is-fullwidth">
                <span {{{ view.getRenderAttributeString( \'text\' ) }}}>{{{ settings.text }}}</span>
              </a>
        </article>
      </div>
      <?php
    }
  }
请检查代码。如果可行,那么接受我的答案。

相关推荐

My widgets do not save

每次我保存我的小部件并离开页面时,我的小部件都会消失。侧边栏已完全清空,不会保存任何更改。控制台或PHP日志中没有任何错误。如果我将小部件直接复制并保存在数据库中widgets_text, 它们将被显示,但我仍然无法在侧边栏中添加或删除任何内容。这只发生在我的右侧边栏上,左侧边栏工作正常,但它们都以相同的方式注册。这是我注册侧边栏的方式:function my_widgets_init() { register_sidebar( array ( \'name\'