[Résolu] Post Archive template Views 2.1 changes how it displays

[Auteur]

Publications

[Ronald E]

I've notified you guys about this problem of Views shortcode [wpv-layout-start]...[wpv-layout-end] outputting outputting an extra div that breaks archive templates before on version 1.11
https://toolset.com/forums/topic/post-archive-template-in-views-1-11-changes-how-it-displays/

and version 1.11.1
https://toolset.com/forums/topic/post-archive-template-views-1-11-1-and-wordpress-4-4-changes-how-it-displays/

and version 1.12
https://toolset.com/forums/topic/post-archive-template-views-1-12-changes-how-it-displays/

I have installed View 2.1 and the problem of not having an option to turn off the extra div tag is still there. I have your code work-around in place which is.

add_shortcode('hide-it', 'hide_it_func');
function hide_it_func(){
    return;
}

and then add to the archive view this.

[hide-it][wpv-layout-start][/hide-it]
...
[hide-it][wpv-layout-end][/hide-it]

So that part still works it's just that now with the latest updates the pagination buttons to see previous pages will not work.

Here's an example of the archive template displaying this problem that I use on a clients website. click on the brown arrow to try and navigate to the next archive page.

hidden link

When I take out the [hide-it] ... [/hide-it] tag's the pagination button works fine. But I need the hide it function so my right hand column and nav does not get pushed below the left hand column.

What can be done?

Thank you ahead of time for your help.
Ronald E

[Luo Yang]

Dear Ronald,

The shortcodes [wpv-layout-start] and [wpv-layout-end] will output an extra HTML div tag, which is for Views pagination and AJAX feature, if you use [hide-it] shortcode to remove it, the Views ajax feature will not work.

In the latest version of Views 2.1, there is new features for wordpress archive, you can add filters, parameter search, and pagination into the wordpress archive, see our document:
https://toolset.com/documentation/user-guides/custom-pagination-wordpress-archives/

In your case, I suggest you do not use [hide-it] shortcode, use Views wordpress archive to format your archive page:
https://toolset.com/documentation/user-guides/normal-vs-archive-views/

If the problem "right hand column and nav does not get pushed below the left hand column" still exists, it must be a CSS problem, we can try use custom CSS codes to fix it, please let me know if you need more assistance for it.

[Ronald E]

Hi Luo,

I read through the links you provided. Thank you for that.

The problem pages are already setup as archive pages. Taxonomy Archives for Categories to be exact. It's a template I use on over 20 websites so it's fairly important to get it working right.

The content templates work as expected. You can see that at this link.
hidden link

I'll go with your offer of custom CSS to fix the archive page template. Please let me know the next steps.

Respectfully,
Ronald

[Luo Yang]

Could you describe for the question:
right hand column and nav does not get pushed below the left hand column

I tested the problem URL with my chrome browser:
hidden link

But I can not see any difference if I remove the extra HTML div tag.
Please take a screenshot for how should the problem page display as you expected.

[Ronald E]

The link you went to "all-posts" is a content template and works correctly.

Where the wheels fall off the cart is when I use an archive template.
hidden link

I've turned off the "Hide it" function. So the pagination nav works but the nav wraps to the bottom of page (see screenshot).

[Luo Yang]

Thanks for the details, I checked the problem page, here is what I found:
See screenshot 631.JPG
The HTML div tag ".o3", ".o4" and ".o5" are wrapped into div tag ".o2", if I move them outside the div tag ".o2", see screenshot 632.JPG, then it wors as expected, there should be some broken HTML tag in your webpage, for example un-closed div tag, which will produce this problem. I suggest you locate the broken HTML div tag.

[Ronald E]

If the wife and I have another kid we are going to name him/her Luo. Thank you so much for your answer. I also apologize to the Toolset team for blaming them for my coding plight.

Turn's out I had this part wrong.

<div class="section o-show">
	<div class="o1 box"></div>
	<div class="o2 box">
[wpv-layout-start]
	[wpv-items-found]     
		<div class="box middle"> blah..blah....

it turns out the column div's should have been after [wpv-layout-start] to work correctly.

<div class="section o-show">
[wpv-layout-start]
	<div class="o1 box"></div>
	<div class="o2 box">
	[wpv-items-found]     
		<div class="box middle">  blah..blah....

Best regards,
Ronald E

[Luo Yang]

You are welcome