[Resolved] First slide in slideshow loading too slowly

[Author]

Posts

[Robert Campbell]

I have a display problem on my new site which uses Toolset Layouts and Views.

If you browse to hidden link you should see that the first slide image in the slideshow does not load before the slideshow moves on to the next slide. The first slide only loads when it comes around again next time.

It doesn't make any difference how long you make the slide display time. I've also tried changing the posts displayed but the problem remains. It is working okay on my dev site at hidden link

Any thoughts to fix this issue please?

Regards

Robert

[Christian Cox]

Hi there,
- Can you tell me how this View was added to the Layout? Is this a View cell, or a shortcode added to a Visual Editor cell, or some other method?
- Can you copy + paste the Loop Output code for the Slider View?
- Can you share a full screenshot of the View editor? I would like to take a look at your filters and pagination settings.
- How was this image added to the post - is this a featured image? Is this a custom image?

[Robert Campbell]

Hi Christian

I did some further investigations and worked out what was causing the slider display problem.

The slider was created in Views and then added to the layout as a views cell.

The problem arose because I actually have two slide shows in the same Layout, one uses the class hidden-sm and the second uses the class .show-sm

I use this as part of the way I change the home page layout when viewed on a sm width device. So the slide show content is identical but in a different position within the Layout.

What I did wrong was to use the cell copy utility in Layouts to create the second slide show. This creates a second view cell using the same View (name). So now we have the same slideshow view being used twice on the same Layout. This was causing some kind of conflict which was causing both uses of the same view to fail in different ways. Just for the record, one application of the view would never load the initial image. The second application of the view displayed only the first image and would not rotate to the others.

The simple solution was to create a copy of the slideshow view but rename. And then call this up into the appropriate Layout cell.

Now it works just fine.

Best regards

Robert

[Robert Campbell]

Hi Christian

Well it was working okay and now the both slide shows are failing again. At this point, both are failing to load the first image on the first pass.

Here is a copy of the loop code:-

[wpv-layout-start]
	[wpv-items-found]
	<!-- wpv-loop-start -->
	<wpv-loop>
			[wpv-post-body view_template="View - slide"]

	</wpv-loop>
		<!-- wpv-loop-end -->
	[/wpv-items-found]
	[wpv-no-items-found]
		<strong>[wpml-string context="wpv-views"]No items found[/wpml-string]</strong>
	[/wpv-no-items-found]
[wpv-layout-end]

and the content code:-

<div class="headline">
<div class="row">
<div class="col-sm-12 col-md-6"><a href="[wpv-post-url]">[wpv-post-featured-image size="custom" width="500" height="250" crop='true']</a></div>  
<div class="col-sm-12 col-md-6">
<div class="home-title">[wpv-post-link]</div>
[wpv-post-excerpt length="200"]<br>
<div class="home-read-more">
<a href="[wpv-post-url]">Read More >></a><br>
</div>
</div>
</div>
</div>

and the content CSS:-

.headline{
padding-top: 20px;
padding-right: 20px;
padding-bottom: 15px;
//border-bottom: 1px solid lightgrey;
//margin-bottom: 20px;
}

And I've uploaded four images showing the view editor as requested.

I hope you can get to the bottom of this, thanks.

Regards

Robert

[Robert Campbell]

Hi Christian

Further update.

I found out that the slide show is failing to load the first image only when the site is load via hidden link Some of the other images on the home page (12 images under the 'Columnists' heading are also failing to load).

When loaded via hidden link the slide image is loading correctly as are the other 12 images under 'Columnists'.

Could you have a look please and see if you get the same result. If 'yes' is there something I need to do to get all images 'https' compliant?

Regards

Robert

[Christian Cox]

Yes, I get the same result. I see several mixed content warnings in the console, which could be related. There's nothing you need to do with the image files to make them https-ready, you just need to change the paths to those images to use https instead of http in your site content. Sometimes this can be accomplished by going to wp-admin > Settings > General and making sure that your WordPress Address and Site Address use https instead of http. In other cases, you must make changes in your database to modify these paths for each image. If the full path to an image uses http, you must modify that to be https. Some migration plugins will do this for you when you migrate a site, but if you manually migrate a site this is something that must be done manually.

Before you attempt any database changes, make a full database backup. If you do a simple find and replace, you will break serialized data structures and bring down your site, so it's usually better to use a migration plugin or script that will handle this for you.

[Robert Campbell]

Hi Christian

That all makes sense. I'll be careful when I get into https in future!

Regards

Robert