Slider using ACF Pro

wolfproductions · September 23, 2022, 2:18pm

Please see the slider at the bottom of this page within a Global Block:

https://retirementsecurity.co.uk/tannery-court-circular-july-2022-news-and-events/

I am trying to create this dynamically, using ACF Pro:

Please can you advice the best way to achieve this, each magazine cover needs to link in a new window to the respective .pdf

Thanks for your help…

ruenel · September 24, 2022, 3:48am

Hello @wolfproductions,

Thanks for writing in!

Please watch out for this tutorials instead:

Best Regards.

wolfproductions · September 27, 2022, 11:35am

Thanks Ruenel, I have watched these before, would appreciate an exact explanation of how to achieve my specific objective though please, thanks

marc_a · September 27, 2022, 1:00pm

Hey @wolfproductions,

Would you mind sharing your admin credentials so that we can check your Global Blocks settings with ACF? To do that, please give us the following information in a Secure Note.

WordPress Login URL
Admin level username and password
Global Block name or URL

You can find the Secure Note button at the bottom of your posts.

Thank you.

wolfproductions · October 3, 2022, 2:16pm

Hi Marc, please find secure details attached

christian · October 4, 2022, 9:33am

Hey @wolfproductions,

I’d recommend you watch the video tutorials presented by Runel again because the setup is similar to the ACF Pro Gallery tutorial.

I’ll just provide the general setup because it would take a lot of time to list down all the exact steps which are redundant because they’re similar to our tutorials.

Set your Slider Container as the Looper Provider. I will not detail the Looper Provider setup anymore because the usage is already discussed in our tutorial videos.
Set the first Slide as the Looper Consumer and delete the rest of the slides. Again, I will not detail the Looper Consumer and Dynamic Content setup because it’s already shown in our tutorial videos provided by Runel.
Set the Dynamic Content of the Image element. This also is shown in our tutorials.

Please watch the tutorials again because that’s the best way to learn Pro.

Thanks.

wolfproductions · October 4, 2022, 1:32pm

Okay, I think I have done all of that, but it’s not pulling through the images from ACF, please could you have a look, thanks

christian · October 4, 2022, 3:50pm

Hey @wolfproductions,

You’re using this DC {{dc:post:meta post="1824" key="magazine_cover"}}. The post doesn’t exist. It’s the ID of the ACF field group. You need to use the ID of the post.

You also set the Image element as a consumer. That is not necessary and might even cause issue down the line.

Hope that helps.

wolfproductions · October 4, 2022, 4:16pm

Okay thanks, I think I have also now set the URL correctly for downloading the .pdf:
{{dc:post:meta post=“1554” key=“file_url”}}

why is only one image showing please?

Thanks again

christian · October 4, 2022, 5:09pm

Hey @wolfproductions,

You are getting only 1 post in your Looper Provider setup and your post only has 1 image.

If you’re expecting to display all Court Circular category posts, you need to change your Looper Provider to Query Builder > Post > Cour Circular (Taxonomy)

Then, your Image element Dynamic Content should be set to Current Post

Please follow that suggestion.

Thanks.

wolfproductions · October 5, 2022, 9:52am

Thanks Christian, suggestion followed and some progress made…

It’s the ‘court circular magazine’ as the posts, as it’s via ACF as oppose to a standard cat, but it’s still only showing 1 image? Please could you take a look again, thanks

christian · October 5, 2022, 1:07pm

Hey @wolfproductions,

3 issues.

You configured the Specific Posts. Please delete it.
You didn’t set the Taxonomy as shown my previous screenshot

Your Looper Provider setting should look like this:

You’re display the image of a specific post. You should use Current Post.

If you follow all that, you’ll get the result as shown in my previous screenshot. If it does not work still, review the steps provided here.

Thanks.

wolfproductions · October 5, 2022, 1:22pm

Got it thanks…

So the only thing that’s not right is the URL for linking each mag cover to this field with ACF: file_url

What do I need to put in here so that each image links to the respective .pdf as setup in ACF?

todo

Thanks for all your help… nearly there

wolfproductions · October 5, 2022, 4:28pm

Also just noticed that the slider is doing something very weird (duplicating the nav arrows) when the global block is on a category page:

https://retirementsecurity.co.uk/category/blundellsands-classic-court/

ruenel · October 6, 2022, 4:12am

Hello @wolfproductions,

You can simply use the ACF field that links to the cover file in the Link URL field.

By the way, I have checked your global block and I am not seeing a duplicated navigation arrows.

Best Regards.

wolfproductions · October 6, 2022, 9:06am

Got it… thanks…

The duplicate nav arrows are not showing directly in the global block, as mentioned on previous post, it’s when on a category page, for example this category:

https://retirementsecurity.co.uk/category/news/

Looks like this: