brunomarsilio

@mazaheri

The solution that I always use in my projects is:

• create the loop template
• use elementor post widget and link with the previous loop template that I created
• use slick to create the slider

See the code I use:

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>

<script>
    function Main() {
        this.slick();
    }
    
    Main.prototype.slick = function() {
        const slider = jQuery(".slider .elementor-posts-container");

        slider.slick({
            slidesToShow: 3,
            slidesToScroll: 3,
            arrows: false,
            dots: true,
            infinite: false,
            autoplay: true,
            autoplaySpeed: 2000,
            responsive: [
                {
                    breakpoint: 9999,
                    settings: "unslick"
                },
                {
                    breakpoint: 1025,
                    settings: {
                        slidesToShow: 2,
                        slidesToScroll: 1
                    }
                },
                {
                    breakpoint: 450,
                    settings: {
                        slidesToShow: 1,
                        slidesToScroll: 1
                    }
                }
            ]
        });

        jQuery(window).on("resize", function() {
            if (!slider.hasClass("slick-initialized")) {
                slider.slick("reinit");
            }
        });

        // Fix background collumn/section bug when using slick
        jQuery(".slick-track article").each(function() {
            if(jQuery(this).find("style").html(jQuery(this).find("style").html()).length > 0) {
                jQuery(this).find("style").html(jQuery(this).find("style").html().replace(/\#post-/g, '.post-'));
            }
        });
    };

    jQuery(document).ready(function() {
        new Main();
    });

</script>

Same problem here. The conclusion that I came is that when updating the ele-custom-skin to the latest version, the “Entire website” option on loop’s display conditions isn’t there. Downgrading to 1.4.0 works like a charm.

The problem is the post_id sent through POST to ajax_send_form() function in wp-content/plugins/elementor-pro/modules/forms/classes/ajax-handler.php isn’t the post_id of page, archive, etc. The post_id sent is the post_id’s loop.

@johnnow try using archive posts element instead posts element. I tried this and the problem is solved.

If you add the render() method in wp-content/plugins/ele-custom-skin/skins/skin-custom.php it will work too

    public function render() {
		$this->parent->query_posts();

		/** @var \WP_Query $query */
		$query = $this->parent->get_query();

		if ( ! $query->found_posts ) {
			if ( ! $wp_query->found_posts ) {
                $this->render_loop_header();

                $should_escape = apply_filters( 'elementor_pro/theme_builder/archive/escape_nothing_found_message', true );

                $message = $this->parent->get_settings_for_display( 'nothing_found_message' );
                if ( $should_escape ) {
                    $message = esc_html( $message );
                }

                echo '<div class="elementor-posts-nothing-found">' . $message . '</div>';

                $this->render_loop_footer();

                return;
            }
		}

		$this->render_loop_header();

		// It's the global <code>wp_query</code> it self. and the loop was started from the theme.
		if ( $query->in_the_loop ) {
			$this->current_permalink = get_permalink();
			$this->render_post();
		} else {
			while ( $query->have_posts() ) {
				$query->the_post();

				$this->current_permalink = get_permalink();
				$this->render_post();
			}
		}

		wp_reset_postdata();

		$this->render_loop_footer();

	}

I changed the wp-content/plugins/elementor-pro/modules/posts/skins/skin-base.php render() method from this

public function render() {
		$this->parent->query_posts();

		/** @var \WP_Query $query */
		$query = $this->parent->get_query();

		if ( ! $query->found_posts ) {
			return;
		}

		$this->render_loop_header();

		// It's the global <code>wp_query</code> it self. and the loop was started from the theme.
		if ( $query->in_the_loop ) {
			$this->current_permalink = get_permalink();
			$this->render_post();
		} else {
			while ( $query->have_posts() ) {
				$query->the_post();

				$this->current_permalink = get_permalink();
				$this->render_post();
			}
		}

		wp_reset_postdata();

		$this->render_loop_footer();

	}

to this

public function render() {
		$this->parent->query_posts();

		/** @var \WP_Query $query */
		$query = $this->parent->get_query();

		if ( ! $query->found_posts ) {
			if ( ! $wp_query->found_posts ) {
                $this->render_loop_header();

                $should_escape = apply_filters( 'elementor_pro/theme_builder/archive/escape_nothing_found_message', true );

                $message = $this->parent->get_settings_for_display( 'nothing_found_message' );
                if ( $should_escape ) {
                    $message = esc_html( $message );
                }

                echo '<div class="elementor-posts-nothing-found">' . $message . '</div>';

                $this->render_loop_footer();

                return;
            }
		}

		$this->render_loop_header();

		// It's the global <code>wp_query</code> it self. and the loop was started from the theme.
		if ( $query->in_the_loop ) {
			$this->current_permalink = get_permalink();
			$this->render_post();
		} else {
			while ( $query->have_posts() ) {
				$query->the_post();

				$this->current_permalink = get_permalink();
				$this->render_post();
			}
		}

		wp_reset_postdata();

		$this->render_loop_footer();

	}

and now it is working.

Is right to make the changes I made?