Create an image slideshow

  • Created : Jan, 13, 2020
  • Last Updated: Nov, 14, 2024

Using horizontal scroll, you can create RSS slideshow banners which use an RSS feed to supply the source slides. When used on a website as a banner, you can control the banner content using RSS feeds and have it update automatically with your latest media and content. You can also overlay logos and messages above your slideshow widget as in the example below.

Benefits of Using RSS-Powered Slideshow Widgets

  1. Automatic Content Updates: New content added to the RSS feed appears in the banner in real-time, reducing maintenance effort.
  2. Engaging Visuals: The scrolling slideshow format is a visually compelling way to display content, perfect for capturing visitor attention.
  3. Customizable Overlays: With the option to add overlays, brands can personalize the display with key messages, logos, and CTAs.
  4. Cross-Platform Compatibility: FeedWind’s widgets are designed to be compatible across major browsers and devices, ensuring your banner looks great for all visitors.

This RSS slideshow widget was created using HTML plus some inline CSS for the overlaid text, and a horizontal scroll widget in the background, using z-index: to control the layers. The feed is from a series of posts which simply contain images. The horizontal scrolling widget  in the example below uses the iFrame version of FeedWind, but there are alternative solutions which can use the regular code.

RSS SLIDESHOW BANNER EXAMPLE


Easy Steps

Widget Settings
  1. Create widget -> RSS
  2. Feed URL -> https://www.flickr.com/services/feeds/photos_public.gne
  3. General -> Width -> Responsive/In Pixels -> Responsive
  4. General -> Style -> Card
  5. General -> Height -> Image -> 300
  6. General -> Height -> Posts -> 1
  7. General -> Scroll -> ON
  8. General -> Scroll -> Navigation arrow -> ON
  9. General -> Scroll -> Autoscroll -> ON
  10. General -> Scroll -> Scroll speed -> 4
  11. General -> Scroll -> Fade transition -> OFF
  12. General -> Style -> Image scale -> Fits the shortest side
  13. General -> Style -> Image align -> Center
  14. Feed Title -> Custom -> OFF
  15. Feed Content -> Display content-> De-select Title and Content
  16. Rest keep as default


Related posts

How to Create a Vimeo Video Widget for Your Website – Easy Guide

How to Create a Vimeo Video Widget for Your Website – Easy Guide

Contents1 Step 1: Get the Vimeo Video Feed2 Step 2: Create a FeedWind Account3 Step 3: Make Your Vimeo...

Ultimate Bento Design in FeedWind Widgets

Ultimate Bento Design in FeedWind Widgets

Contents1 Why Bento Design?2 Crafting Your Bento Design Style Widget with FeedWind: A Step-by-Step Guide3 Bento Design Style Widget...

Facebook posts: Enhance your brand’s online presence with custom overlay design

Facebook posts: Enhance your brand’s online presence with custom overlay design

Stand Out with Custom Overlay Designs While images play a vital role in catching the eye, the design elements...