HostGator Web Hosting

How to Setup The The Fly Image Slider Plugin

If you’re looking for an easy to use, high quality image slider plugin then I highly recommend watching this tutorial on how to setup “The The Fly Image Slider” plugin.  The Fly Image Slider is a completely Free plugin that works with any WordPress theme.  It’s a highly customizable image slider plugin that enhances any WordPress site.  In fact, I like the plugin so much that I use it on the home page of UploadWp.com.The The Fly Image Slider

Benefits of Using The The Fly Image Slider Plugin

The most obvious benefit of using The The Fly Image Slider plugin is that it instantly makes your WP site look more interesting.  Let’s face it, most people don’t spend much time on boring, static sites.  Most people are more visually inclined which is why an image slider is so effective in grabbing and holding the attention of site visitors.    So, one of the major benefits of this slider plugin is that it helps to keep new site visitors on your site longer.

Another benefit of The The Fly Image Slider is that it allows you to drive site visitors to the pages/post of the site that you want them to go.  Every slider image can be linked to any page/post on you WP site.  So, if you have certain content that you want to feature then you’ll definitely find The The Fly Image Slider plugin useful.

Setting Up The The Fly Image Slider Plugin

Step 1:  The first step is to install the plugin.  So, in your WordPress admin go to: Plugins > Add New > search for “The The Fly Image Slider” > click Install > Activate the plugin

Step 2:  After you’ve installed and activated the plugin you’ll notice a “The The Fly” settings section appear on the left sidebar of your WP admin.  Hover over The The Fly on the left sidebar and click “Image Slider”.  You’ll now find yourself on The The Fly Image Slider settings page.  The next step is to determine where to display the Fly Image Slider on your site.

Step 3:  Determine exactly where on your site (what page or pages) you want the image slider to display.  Once you have determined the position of the slider, take a screen capture of the exact area.  Copy the screen capture image and paste it into an image editing software such as Photoshop.  This will allow you to determine the approximate dimensions of your image slider.  Any image editing software will work but in the tutorial video below I use Photoshop.

Step 4:  Now that you know where you want the slider to appear on your site as well as the approximate dimensions, it’s time to complete setup of the slider.  In your WordPress admin go to: The The Fly > Image Slider > click the Sliders and Slides tab > click “Add New Slider” > give the slider a Name, Height and Width > the Height and Width of the slider were determined in the previous step > click Save.

Step 5:  You’re slider has been created so the next step is to create the first 2 slides.  Go back into Photoshop and create 2 slider images that are the same dimensions as the slider.  It’s important to note that you must have at least 2 slides for The The Fly Image Slider to work.  It will not work with just 1 slide.  So, after you’ve create your first two slides go back into your WP admin.

Step 6:  In the WP admin go back to The The Image Slider settings page > click on the Sliders and Slides tab > Hover over the slider that you created and you’ll see an “Add New Slide” button > click the Add New Slide button > upload and save your first 2 slides.

Step 7:  The final step is to paste the slider Shortcode on the page / post that you want the slider to appear.  In the tutorial video below, we paste the slider shortcode in the top of the Home page.  You’ll most likely want to do the same as the Home page is typically where image sliders are used.  After you’ve pasted the image slider short code in the page click Update.  Go back out to your site > refresh the page and the slider will appear.

Our tutorial video below demonstrates how to put “The The Fly Image Slider” on your WordPress site

HostGator Web Hosting

23 COMMENTS

    • I’m glad to hear that you like The The Fly Image Slider plugin as well. Off the top of my head I unfortunately do not know of a good featured video plugin. However, I’ll do some research on it this week and try to find something that works well with all WP Themes so stay tuned. Thanks – Adam

  1. Hi Adam,
    When I place my cursor and click in the image field to upload an image for a slide, nothing happens…? Any idea why?

  2. Adam,

    You are the absolute best. I am in debt to you for teaching me how to customize a WP theme, particularly The Serenity Theme. Thank you sooooooo much. You deserve a big KISS!!!!

    Thank you for the The The Fly Image Slider plugin. I am so confused with the whole Genesis Responsive Slider & pulling from posts. I actually got a headache trying to figure that out. This flyer image slider plugin will do. I would like a chance to talk with you. Please let me know if that is possible through my email.

    Thanks a million!!!

    Malia

  3. hi Adam,

    Thanks for this tutorial. I use thethefly slider on a website of a customer. The only thing is that when I changed the url the images were gone. So now I leave the images point to the old location and only than it works. I tried to let it work with the search & replace plugin but than I should not change the post meta data because than all the images of all sliders are gone.

    This is the website: http://www.dia-studio.net.
    Here is where a gallery is, but there are a lot: http://dia-studio.net/typologies/shifting-performance-the-netherlands-2011/

    The thumbnails I got back to define THETHE_IMAGE_SLIDER_URL to a hard url in de ‘thethe-image-slider.php. Which is not so well for if there are updates and stuff.

    I hope you have a solution for me.

    grtz,
    Marjet

    • Hi – Thanks for your comment and your support. To be honest, I’m not exactly sure of the best solution to this issue. However, I’m going to post this comment with the hopes that someone else might be able to chime in and offer a solution. Thanks again for your support!

      Adam

      • Performing a standard search and replace on a WordPress database can knock out some plugins settings (and widget data too). To get around this use a safe search and replace tool. InterconnectIT offer a free and user-friendly one (called "WordPress Serialized PHP Search Replace Tool").

  4. Great information and post, thank you!

    How does this slider work with Responsive themes? I have Woocommerce Mystile theme and it is a responsive theme without the woo slider in the settings, which leads me to believe that these sliders are not friendly for responsive themes. What’s your take on this? Thank you again!

    • Hi Eddie,

      To the best of my knowledge, The The Fly Image Slider should work well with responsive themes. It should work with just about any type of WordPress theme. I’ve not tested it with the Mystile theme but with a little tweaking my guess is that it will work well.

  5. Hi there: I love your slider and use it on a number of client wordpress sites….problem is that if someone posts the site url (slider is on the main page) on facebook, instead of a standard page description the slider code shows up, instead. I noticed this happens on all wp sites with the slider.

    Do you have a work around or anything for that? I’ve tried a few things but they have not worked. Only think I can think of is to put the slider on a page other than the main page and use a flash gallery on the main page banner, instead. Hopefully i don’t have to do that, though…

    Thanks for a great and easy to use plugin.

    • Hi Dawn – Thanks for the positive feedback on our Fly Image Slider tutorial and great question regarding Facebook pulling in the slider code. Off the top of my head I honestly don’t have a good solution. However, I will look further into it and see if there is a quick fix. Also, if anyone else reading this knows of a good solution to this issue please feel free to share it with us here. Thanks again for your support!

      Adam

  6. I’ve been watching your videos and I’m so excited that I found them. They have save me money and allowed me to customize my WP webstore to my needs. I’ve currently uploaded the Woocommerce theme “Artificer” and would like to add the ‘The The Fly Slider’ to my home page, but don’t see an area in which to add the code. Help!!!

  7. Thanks for the great instructional videos. All that I’ve viewed so far have been so helpful in helping build my own website/store on WordPress without having to pay someone else to do it.

    I do have a question in which I hope you can help. I would like to install The The Fly Image Slider into my web page and I’m ” Artificer or Mystile” from Woothemes, but don’t see a way to add the Slider to the main page. There is no “Home Page” set up on those themes. Is there a way to insert the sliders?

    Thanks.

    • Hi Tieast,

      Thanks for the positive feedback on our tutorials – it’s very much appreciated! Also, thanks for your question, it’s one that has come up a few times so I want to put together a mini-tutorial on how I would go about integrating “The The Fly Image Slider” into any of the WooCommerce specific themes. It will take me a few days to put this together so please stay tuned. Thanks again for your support!

      Adam

    • Hi Lisa,

      Make sure that you have at least 2 slides because I don’t think it will work with only one slide. If you do have at least two slides created and it’s still not working then please send me your site URL. Also, if you want to create an admin login, I’d be happy to see if I can get it to work. If you go to the Contact (link is in footer of Uploadwp.com) page you can send the login info and as much info about the issue via the form. That will forward to my email and we’ll go from there. Thanks,

      Adam

  8. First of all your web site is awesome, helping me so much.
    When I do a search for "The The Fly Image Slider" in plugins I can not find it, what am I doing wrong.
    cheers

  9. I've having the same problem as Lisa. I can see the slider but only have the box with the 'loading' bar in the window. This is a test site. I had to use the code: <?php echo do_shortcode('[thethe-image-slider name="Fitness"]'); ?> to get it to work below the header.

    When I used the shortcode I get the same slider problem. I have two slides uploaded and both of them are the exact same size as the default slider (468×264).

    Thanks,
    Alan

LEAVE A REPLY