Multimedia Learning

Practical Ideas for Designing Better E-Learning by David Anderson

  • Archives

How to Load Your E-learning Courses in WordPress w/Lightbox Effect

2012/01/01 By David

drag-drop-table-settingSo you want to share your online training portfolio from your WordPress blog? A lightbox option is an simple and elegant solution for keeping viewers on the current page while overlaying the content in a mini page.

Get the plugin: Lightbox Plus for WordPress

Here’s a quick example:

  • View My Portfolio Example

Filed Under: Articulate Tagged With: Articulate, lightbox, portfolio, WordPress

Comments

  1. Robert Kennedy III says

    2012/01/02 at 3:56 pm

    This is a great plug-in. I will definitely be trying it on our site/blog sometime. Nice demo course, by the way.

  2. david says

    2012/01/05 at 6:21 pm

    Thanks, Rob. Let me know when you do it, I’d like to check it out.

  3. Amit says

    2012/11/21 at 4:55 pm

    i will surely use it in my elearning website. Thanks.

  4. Charity Browning says

    2013/03/19 at 3:06 pm

    The part that I don’t understand is when you added the player.html. Where did that come from? Is that a link to your articulate storyline presentation? Can you tell me how to get to that point? I don’t have access to the ftp.

  5. david says

    2013/03/25 at 11:20 am

    Hi Charity – The player.html is the default file name from Studio ’09. I published this example using a Studio project. If you’re publishing a Storyline project, you’d have a story.html file. In this example, you need to post your files to an external web server. I did use an FTP program to upload the files.

    Here’s another Screenr with specific instructions for uploading a Storyline project to a web server: http://www.screenr.com/u5R8 Let me know if you have any questions and I’ll be glad to help.

  6. Sonja D'Angelo says

    2013/07/23 at 4:58 am

    Hi David,

    I would like to use this nice feature, but the thickbox page it out of order.

    Could you give me the code oder tell me, where could I find it?

    Thanks and best regards
    Sonja from Switzerland

  7. david says

    2013/07/28 at 4:16 pm

    Hi Sonja –

    Looks like the Thinkbox is no longer being supported. I just updated the tutorial to include a new plugin: LightboxPlus. It works really well. Check it out and let me know if you have any questions!

  8. Sonja D'Angelo says

    2013/08/08 at 4:57 pm

    Hi David,

    thanks for the update. I tried it, but I got some problems with the plugin.
    The size of the lightbox I couldn’t change, that it fits with my storyline-content.
    Second there is a arrow on the left, which I don’t know where it comes from.

    The code I use: Click here to see the content</

    The link to my page: http://webinar-trainer-ausbildung.com/storyline-test/ ‎

    I already checked the FAQ on the page, but there are only other problems…

    THANKS!

  9. Karthik says

    2013/09/21 at 11:56 am

    Hi

    This plugin looks great and its really helpful for me. I am using your plugin for embed my articulate output files it opens the lightbox modal perfectly when i hit the link. But the problem is after closing the modal an another small lightbox modal will show with your loading icon as a content if i close it again then only it closes the modal completely. Is there any solutions to fix this issue?
    Please help.

    Regards
    Karthik

  10. KerryJ says

    2014/01/10 at 12:39 am

    Hi there!

    Thanks so much for the info. Would you know if this plug-in compljies with WCAG 2.0 AA standards for accessibility?

    Cheers

    KerryJ

  11. David Anderson says

    2014/01/13 at 9:28 am

    @KerryJ – It seems implementations vary across lighboxes. I couldn’t find anything specific for this plugin. I’d contact the developer to see if any testing has been done w/this plugin.

  12. Pankaj Agrawal says

    2015/01/23 at 10:14 pm

    You can also use a plugin called GrassBlade xAPI Companion (http://www.nextsoftwaresolutions.com/grassblade-xapi-companion/) for both HTML5 as well as Tin Can packages of several authoring tools.

Subscribe

Enter your email address:

  • Facebook
  • Instagram
  • LinkedIn
  • Pinterest
  • Twitter
  • YouTube

Search

Recent Favorites

5-Point Makeover Process for PowerPoint and E-learning

Design Mapping: Creating the Right Look and Feel for Your E-learning

Drag Drop Game: Optical Illusion

Dump the Next Button: Increase Learner Engagement with NEXTCHA

E-Learning Course Templates for SMEs: Compliance Edition

E-Learning Slide Makeover: 5 Design Ideas to Rock Your Learners Into Compliance

Free: E-Learning Checklist Interaction for Articulate Storyline

Macbeth Motion Comic as E-learning Scenario Model

Copyright MULTIMEDIA LEARNING © 2025