WordPress Colorbox Lightbox

Beschreibung

WP Colorbox plugin is a simple lightbox tool for WordPress. It allows users to pop up content in lightbox using the popular jQuery ColorBox library. They can also view the larger version of a particular media file without leaving the page.

Anforderungen

  • Latest version of WordPress

Funktion

  • Beautiful lightbox popup style
  • Flexiblity of creating your own lightbox link
  • Pop up custom/HTML content in lightbox
  • Trigger lightbox from either a text/image link
  • Comptaiblie with WordPress multisite
  • Add lightbox to a YouTube or Vimeo video link
  • Enable lightbox functionality on your site which supports all major browsers
  • Use a simple shortcode anywhere on your site (Post, Page, Homepage etc.)to pop up a media file in lightbox
  • Apply lightbox effect on images inserted into WordPress post/page
  • Open external page in lightbox using iframe
  • Responsive lightbox popup which works on mobile devices. Also it fits perfectly on smaller screens.

WP Colorbox Plugin Usage

Pop up image in lightbox

Create a new post/page and use the following shortcode to create a text/image link which will trigger lightbox once clicked:

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" type="image" hyperlink="click here to pop up image"]

here, url is the link to the media file that you wish to open in lightbox and hyperlink is the anchor text/image.

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" type="image" hyperlink="http://example.com/wp-content/uploads/images/thumb.jpg"]

Pop up YouTube video in lightbox

[wp_colorbox_media url="http://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="click here to pop up youtube video"]

Pop up Vimeo video in lightbox

[wp_colorbox_media url="http://www.youtube.com/embed/1284237" type="vimeo" hyperlink="click here to pop up vimeo video"]

Show Title in lightbox

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" title="overlay image" type="image" hyperlink="click here to pop up image"]

Specify an Alternate Text for an Image

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" title="overlay image" type="image" hyperlink="http://example.com/wp-content/uploads/images/thumb.jpg" alt="Thumbnail image description"]

Apply Custom CSS

You can specify your own CSS class in the shortcode to customize a text/image link.

[wp_colorbox_media url="http://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="click here to pop up youtube video" class="custom_class"]

Multiple CSS classes can be separated with a space. For example:

[wp_colorbox_media url="http://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="click here to pop up youtube video" class="custom_class custom_class2"]

For detailed documentation please visit the WordPress Colorbox plugin page

Recommended Reading

For screenshots please visit the WordPress Colorbox plugin page

Installation

  1. Go to the Add New plugins screen in your WordPress Dashboard
  2. Click the upload tab
  3. Browse for the plugin file (wp-colorbox.zip) on your computer
  4. Click „Install Now“ and then hit the activate button

FAQ

Can this plugin be used to pop up image in lightbox?

Yes.

Can I use colorbox to pop up media files using this plugin?

Yes.

Rezensionen

Awesome Plugin! Really awesome!!!

The plugin was easy to install and use. I had a little issue with the size of the window when it opened in Lightbox and sent an email to the developer in hopes of a solution. I received an email back the ~same day~ with instructions to resolve the issue. The instructions were simple and straightforward – a perfect solution. (Side note… there was nothing wrong with the plugin, just a preference related to size that I was hoping for, so the developer’s help was above and beyond 🙂 Thank you so much!

Excellent !!! Responsive !!! I Used it with SiteOrigin PageBuilder

I searched for a lightbox for videos a lot

It works excellent !

The thumbnail is responsive if you give it a CSS :
.wp-colorbox-youtube img {
width:100%;
}

you can use the autothumbnail like this
[wp_colorbox_media url=“https://www.youtube.com/embed/YE7VzlLtp-4?autoplay=1″ type=“youtube“ hyperlink=“http://img.youtube.com/vi/YE7VzlLtp-4/maxresdefault.jpg“]

as you see you need to put the embed adress of the youtube video
or just copy the part of the youtube video adress after https://www.youtube.com/watch?v=
and replace the ‚YE7VzlLtp-4‘ in the above shortcode

for automatic play use:
?autoplay=1
if you want the video to start and/or end at a particular time
enter the time in seconds like (121 = for 2min 1sec)
?start=121&autoplay=1

Great PlugIn !!!

Outstanding ligthbox plugin

So far the best Keep It Simple plugin I’ve found for the projects I manage.

Works like a charms wether you want to integrate on your theme or to make a simple shortcode load.

Congrats!

Lies alle 18 Rezensionen

Mitwirkende & Entwickler

„WordPress Colorbox Lightbox“ ist Open-Source-Software. Folgende Menschen haben an diesem Plugin mitgewirkt.

Mitwirkende

Changelog

1.1.0

  • Disabled scrolling option for YouTube and Vimeo videos.

1.0.9

  • Alt (alternate text) attribute can now be specified in the shortcode for a thumbnail image.

1.0.8

  • Added translation option so the plugin can take advantage of language packs
  • WP Colorbox is now compatible with WordPress 4.4

1.0.7

  • WP Colorbox is now compatible with WordPress 4.3

1.0.6

  • Added a new shortcode parameter to apply custom CSS classes on a text/image link

1.0.5

  • Added a new shortcode parameter to show the title of a media in lightbox

1.0.4

  • colorbox shortcodes can now be embedded in a text widget

1.0.3

  • Lightbox now opens full-sized images

1.0.2

  • Lightbox window is now responsive

1.0.1

  • WP Colorbox is now compatible with WordPress 3.9

1.0

  • First commit