1 Attachment(s)
Carousel Slider any recommendations?
I'm looking to display 4 monthly newsletter front page graphics in carousel slider format, scrolling around in either 360 carousel or a fixed left/right slider also allowing a link to the newsletter pdf to open in a new window.
Ideally, there could be as many as 12 issues to scroll left and right for the full year, but with just 4 available in the slider window
example:
Attachment 128058
Can't see anything in the catalogue that fits the bill....any thoughts?
Re: Carousel Slider any recommendations?
Have a look at WOW Slider https://wow-slider.en.softonic.com/
If you go this route let us know because there is a way you have to integrate it into Xara.
Re: Carousel Slider any recommendations?
just downloaded Wow and tried adding html as a placeholder, but doesnt look as simple as that!
Any tips?
Re: Carousel Slider any recommendations?
I definitely would not use a Slider for this.
I set up a set of pages in a Horizontal Supersite with a gap of 5px.
Each page is designed to exactly hold one image. Do not have a page shadow.
I made it A4-scaled of 210x297px. Each can have any Xara effect, rollovers, links to a fresh page, ...
This alone overpowers a carousel.
I published this all to a sub-folder, newsletters.
In the main site, I created a Placeholder with body code: <iframe name="newsletters" width=100% height=100% src="newsletters/index.htm"></iframe>"
The placeholder width was 4 times the newsletter width plus a margin (e.g., 4 x 210 + 3 x 5 --> 855px); height was 297px.
Rough & ready demo: http://acorn.xara.hosting/sailtime/
Acorn
Re: Carousel Slider any recommendations?
stuk34
After you create the slide show WOW Slider creates an index.html file. Inside the index.html file are designated sections that go in the Page > Body section and Page > Head section. Copy and paste from the index.html file into your Xara page that contains the slider.
WOW Slider also creates two folders, I think Engine and Data. These two files have to uploaded to the route directory where you publish your site.
And since the two snippets of code refer to index.html it is best to rename your home page, which in Website Properties > Page is index, to index.html so all your page files end in .html
Xara will say this is not a good idea. But it is fine.
Re: Carousel Slider any recommendations?
Thanks both,
Going to try both methods, appreciate your help and super quick responses
Re: Carousel Slider any recommendations?
Quote:
Originally Posted by
Acorn
I definitely would not use a Slider for this.
I set up a set of pages in a Horizontal Supersite with a gap of 5px.
Each page is designed to exactly hold one image. Do not have a page shadow.
I made it A4-scaled of 210x297px. Each can have any Xara effect, rollovers, links to a fresh page, ...
This alone overpowers a carousel.
I published this all to a sub-folder, newsletters.
In the main site, I created a Placeholder with body code: <iframe name="newsletters" width=100% height=100% src="newsletters/index.htm"></iframe>"
The placeholder width was 4 times the newsletter width plus a margin (e.g., 4 x 210 + 3 x 5 --> 855px); height was 297px.
Rough & ready demo:
http://acorn.xara.hosting/sailtime/
Acorn
Interesting approach Acorn......
Re: Carousel Slider any recommendations?
All working as intended on the site live now:
https://www.thornton-steward-sailing...k/sailtime.htm
Thanks for your help
Just one question, when viewed on a tablet there are no iframe scroll bars on an Apple device....Is this due to iframes not being handled correctly by IOS? or is there a setting somewhere ive missed?
Re: Carousel Slider any recommendations?
Quote:
Originally Posted by
stuk34
All working as intended on the site live now:
https://www.thornton-steward-sailing...k/sailtime.htm
Thanks for your help
Just one question, when viewed on a tablet there are no iframe scroll bars on an Apple device....Is this due to iframes not being handled correctly by IOS? or is there a setting somewhere ive missed?
You're welcome.
The missing setting could just be scrolling = "auto" or scrolling = "yes".
BUT
HTML5 has deprecated 'scrolling' so you may need to replace it with style="overflow: visible;"
Acorn
P.S. You have an errant craft to the right of your page - an extra Oct 19 edition.
1 Attachment(s)
Re: Carousel Slider any recommendations?
Here's a very slightly different approach. No particular reason.
DEMO