How to Use a Lightbox Plugin With Other Plugins on WordPress

How to Use a Lightbox Plugin With Other Plugins on WordPress thumbnail
Add some flair to your images with Lightbox

Lightbox is a script that overlays images on websites. A small thumbnail of the image appears, and when the user clicks it, the full version appears in the middle of the screen, while the rest of the webpage dims to give the image center stage. Lightbox sometimes doesn't work correctly with other plugins, usually because the other plugin also uses an “onload” attribute in the body tag of the site. Correct this problem either by removing the other plugin, updating your plugins or appending the Lightbox code to the end of the onload tag.

Instructions

  1. Replace a Conflicting Plugin

    • 1

      Log in to your WordPress admin control panel, then go to “Plugins.” Open a new tab in your browser, and load up a post or page containing a Lightbox image. Click the image to confirm that the plugin is not operating correctly – usually, it will open in a new window instead of in a Lightbox window.

    • 2

      Go back to the control panel tab. Deactivate one of your other plugins. Start with image-related plugins or ones that use JavaScript. Then go back to your website tab, refresh the page and click the Lightbox image again.

    • 3

      Check the results. If Lightbox still does not work, reactivate the plugin, then go back to Step 2 and repeat the process. If the Lightbox appears, you have found the conflicting plugin. You can now find an alternative plugin that performs the same function, but does not conflict with Lightbox.

    Editing the Body Tag

    • 4

      Log in to your WordPress admin control panel. Click “Appearance,” “Editor” and then click “header.php” from the list of files on the right.

    • 5

      Scroll down the code in the middle of the page until you find the <body> tag. Look for the “onload=” attribute to this tag. At the end of this attribute, but before the closing quotation mark, type the following:

      ;initLightbox()

    • 6

      Click the “Update File” button just below the main editing area. Rather than having one script overwrite the other, they will both run together on your Web page.

    Updating Plugins

    • 7

      Log in to your WordPress admin area. Click “Plugins” from the menu on the left.

    • 8

      Click “Update Available,” located near the top of the screen.

    • 9

      Click the “Update automatically” link underneath the first plugin in this list. When the update has completed, go back to the plugins menu and repeat this process until all updates have been completed.

    • 10

      Load your website and test a Lightbox image. This process sometimes works because Lightbox will not operate unless the page has fully loaded, and if an out-of-date plugin is causing an error that prevents the page loading, the Lightbox will not appear.

Related Searches:

References

  • Photo Credit Comstock/Comstock/Getty Images

Comments

Related Ads

Featured