[Resolved] Article template and article view

[Author]

Posts

[louE]

Tell us what you are trying to do?

I currently have an content template set up for each article we publish.

<div class="article-body row">
<div class="col-md-8">
<div class="author_date">[wpv-view name="staff-view"] - [wpv-post-date]</div>
[printfriendly]<div class="addtoany_aier">Share:[addtoany]</div>
[wpv-post-body view_template="None"]
[wpv-view name="staff-box"]
</div>
<div class="col-md-4">
<h3>Related Articles - [wpv-post-taxonomy type="pertinent_tags" format="name"]</h3>
[wpv-view name="article-sidebar-tag"]
</div>
</div>
[wpv-view name="articles-scroll"]

Attached to that is a view "articles-scroll" that has an infinite scroll of articles that excludes the current article in query result.

However, when an article loads, it loads the current article, AND the next article as well.
I'm not sure how to load only the current article and have the infinite scroll load only after I've scrolled to the bottom (or half way?)

The initial page load is double what I want it to be.

Example:
hidden link

[Nigel]

Hi Lou

I looked at the page and understand the problem.

You display the single post, then other posts with a View that uses infinite scroll, and you want the View to initially not show the first result until the pagination is triggered.

I don't see how you can do that unless you are willing to sacrifice the first result.

Because you can set up the output of your View so that it outputs nothing for the first iteration of the loop, and then outputs the post results normally on subsequent iterations, after paginating.

I can't see any alternatives. I've had several ideas, and then as I think through the implementation details realise they cannot work.

If you are willing to sacrifice the first result then your loop output would look something like:

<wpv-loop>
    [wpv-item index=1]
    [wpv-item index=other]
    [wpv-post-body view_template="loop-item-in-view"]
</wpv-loop>

[louE]

Here is my loop. Are you saying remove the section from index=1? Or something else? I just want to make sure I understand completely. Thanks! 🙂

<wpv-loop wrap="1" pad="true">
		[wpv-item index=1]
		<div class="row ">
			<div class="col-md-12">[wpv-post-body view_template="loop-item-in-articles-scroll-2"]</div>
		</div>
		[wpv-item index=other]
			<div class="col-md-12">[wpv-post-body view_template="loop-item-in-articles-scroll-2"]</div>
		[wpv-item index=pad]
			<div class="col-md-12"></div>
		[wpv-item index=pad-last]
			<div class="col-md-12"></div>
		</div>
	</wpv-loop>

[Nigel]

In the loop section you use the wpv-item shortcode to display different things depending on which iteration of the loop it is.

In your case it looks like the markup is set for displaying a grid, but a 1-column grid, which is really no grid at all.

Try this:

<wpv-loop>
        [wpv-item index=1]
        [wpv-item index=other]
            <div class="col-md-12">[wpv-post-body view_template="loop-item-in-articles-scroll-2"]</div>
    </wpv-loop>

[louE]

I've tried this now and it acts like it's loading the next item, but it does not load.
I'm trying this on the dev site which is an exact copy of the live site, but is not public.

[Nigel]

Hmm. It may not be possible with infinite scrolling, it could be that the JS code that triggers pulling in the next post requires the existence of the previous post.

Can you try changing the pagination of that View so that it uses manual pagination controls to verify that it is possible to paginate through the posts despite not outputting the first one.

If that is the case then that would confirm that it is specifically with infinite scroll that it is a problem, and if that's the case then I don't have a solution for you, I'm afraid, I don't think what you want to do is possible.

[louE]

With pagination, it just loops back to the same article whenever I press NEXT :-\

[Nigel]

OK, let me set up a test locally, I'll get back to you.

[Nigel]

The problem is that with pagination the wpv-item shortcode resets for every page of results, so if you are only showing 1 post at a time, they will always be the first post.

We can try an alternative, because the wpv-loop-index shortcode has an "accumulate" attribute where we can tell it not to reset after paginating.

So try this instead:

<wpv-loop>
    [wpv-conditional if="( '[wpv-loop-index]' ne '1' )"]
    <div class="col-md-12">[wpv-post-body view_template="loop-item-in-articles-scroll-2"]</div>
    [/wpv-conditional]
</wpv-loop>

Try it first where you have manual pagination controls so that you can verify it does what you expect, and then you can try switching back to infinite scroll pagination again to see that works.

[louE]

That's interesting...

It loads the main article and the next article below it. There are pagination controls, but they only affect the second article.
So I can page through to other articles, but the original article above it stays persistent.

[Nigel]

But your original/main article is the post you are actually looking at, and the second article is the one displayed by the View which is inserted in the template for single articles after the article itself, so it is expected that the original article is unaffected by the pagination, which only updates the output of the View.

Did I misunderstand something?

[louE]

It's still loading both articles.
That's right... but now when I turn infinite scroll on, it still loads both articles.

[louE]

Oh, I've got it working. I had to go back to my original code and then implement your fix.

[Nigel]

I was just going to say that when I visit your site it looks fine, so glad you sorted it.

[louE]

Thanks Nigel!