Adding Slideshow to template page

Paul_Fitzgerald
New Member
3 0 0

Good morning,

I want to add a slideshow to my shopify page - https://yoga-swings-uk.myshopify.com/.

I am thinking something like the slide show on the homepage, but on another one of my pages.  Is this possible, and if so how would I implement this?

I am using the debut theme.

Thanks, Paul

0 Likes
Liam
Shopify Staff
Shopify Staff
639 16 230

Hi Paul!

Liam here from Shopify - thank you for your question :)

Great to see you are looking to 

The easist solution here might be to use a slideshow app from our Shopify app store to achieve the effect you are looking for. These image slider apps usually generate a basic embed code that you copy and paste into your page, which will then display a slideshow on that page. The apps would generally have a tutorial showing you how to embed the code too. Banner Slider and Image Slider would both be useful for adding a slideshow on pages outside the home page. If you are comfortable with working with some basic javascript and jQuery I'd also recommend a javascript jquery like Galleria for some really beautiful slideshows that you can embed on pages. 

Hope this helps Paul, if you have any other questions, just let me know!

Cheers,
Liam

Shopify Guru
support@shopify.com

Liam | Developer Community Manager @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

0 Likes
Paul_Fitzgerald
New Member
3 0 0

Brilliant, thanks Liam. I will look at implementing Galleria. I will be comfortable with the javascript, but I want to make it easy for my client who doesn't really understand code, so ideally she will be able to upload images in the sidebar and then they will be added to the gallery. 

Do you know off the top of your head if this is how Galleria works?

Thanks, Paul

0 Likes
Jason
Shopify Expert
10272 144 1942

Those app suggestions can certainly make things easier to implement.

If you've already got a slider on the home page and you're aok with JavaScript I'd suggest just using that. There's less value in loading another slider script if there's one included in the theme. For that theme it uses slick (off memory) - which is very decent.

If you're building the feature into the theme the first question I'd ask is how is the merchant setting the images in the first place. Metafields? Pulling image from page content? Hard coded into an alternate template? Whatever the method, once you've got a list of images you can craft the HTML structure for the slider, and trigger slick to active it.

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
0 Likes
Paul_Fitzgerald
New Member
3 0 0

Ok. I have used Slick many times in the past. 

What I am not sure is how to hook it up so the owner of the site can add images in the sidebar menu, which are then displayed in the slideshow.

0 Likes
Jason
Shopify Expert
10272 144 1942

If this will be a sidebar used across many pages look into adding new options into the theme settings. You'd be able to give the merchant a series of options for images that your code would then use to make the slider.

There's some info on that here:
https://help.shopify.com/themes/development/theme-editor/settings-schema

^ You'll also be able to take some inspiration from the current slider code / settings from the home page. If you're not keen on the theme settings I've also built things that:

  • just use a linklist (menu) of image paths. Loop over the links to build up a list of images in the slider
  • parse images from the contents of a page. Some string splitting is needed, but can work well
  • pull the values from a metafield

Lots of approaches here. I can nudge your in the right direction if you get stuck.

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
0 Likes
kenneth-ng
New Member
3 0 0

Hi Jason,

 

I'm trying to use your suggested approach with using the slider code, I'm not sure I understand what you mean by looping back to images. I'm new to HTML

0 Likes