Lightbox Ultimate breaking div structure

[jack96161]

I used WP video Lightbox successfully and then purchase Lightbox Ultimate for just one feature – autoplay. Formerly I used:

<div style=”width: 500px; height: 135px; float: left;margin:0px 10px 0px 10px “>

[video_lightbox_youtube video_id=f80BH-lPZGk width=800 height=600 anchor=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/motownbutton-96dpi.png”%5D

[video_lightbox_youtube video_id=f80BH-lPZGk width=800 height=600 anchor=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/rockbutton-96dpi.png”%5D

[video_lightbox_youtube video_id=f80BH-lPZGk width=800 height=600 anchor=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/countrybutton-96dpi.png”%5D

[video_lightbox_youtube video_id=f80BH-lPZGk width=800 height=600 anchor=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/themedbutton-96dpi.png”%5D

</div>

to display 4 anchor images side by side, which worked perfectly — but no autoplay option.

Using Lightbox Ultimate, I replaced this with:

<div style=”width: 550px; height: 135px; float: left;margin:0px 10px 0px 10px “>

[wp_lightbox_prettyPhoto_video link=”http://www.youtube.com/watch?v=f80BH-lPZGk&#8221; width=800 height=600 autoplay=”1″ source=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/motownbutton-96dpi.png”%5D

[wp_lightbox_prettyPhoto_video link=”http://www.youtube.com/watch?v=f80BH-lPZGk&#8221; width=800 height=600 autoplay=”1″ source=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/rockbutton-96dpi.png”%5D

[wp_lightbox_prettyPhoto_video link=”http://www.youtube.com/watch?v=f80BH-lPZGk&#8221; width=800 height=600 autoplay=”1″ sourcer=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/countrybutton-96dpi.png”%5D

[wp_lightbox_prettyPhoto_video link=”http://www.youtube.com/watch?v=f80BH-lPZGk&#8221; width=800 height=600 autoplay=”1″ sourcer=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/themedbutton-96dpi.png”%5D

</div>

However, the plugin now wraps every one of these 4 items with a <div class=”lightbox_ultimate_anchor lightbox_ultimate_image_anchor “>…</div> so the resulting page source looks like:

<div class=”lightbox_ultimate_anchor lightbox_ultimate_image_anchor “>

<img src=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/motownbutton-96dpi.png&#8221; alt=”” />

</div>

<div class=”lightbox_ultimate_anchor lightbox_ultimate_image_anchor “>

<img src=”http://www.highsierradesign.com/LVA/wp-content/uploads/2012/06/rockbutton-96dpi.png&#8221; alt=”” />

</div>

<div class=”lightbox_ultimate_anchor lightbox_ultimate_image_anchor “>

<img src=”” alt=”” />

</div>

<div class=”lightbox_ultimate_anchor lightbox_ultimate_image_anchor “>

<img src=”” alt=”” />

</div>

which breaks my block flow. How can I prevent the plugin adding the

<div class=”lightbox_ultimate_anchor lightbox_ultimate_image_anchor “>… </div>

around these 4 items?

The site under development is http://www.highsierradesign.com/LVA/ there should be 4 anchor images beneath the large video anchor image..

Jack

[jack96161]

Solved it — had to add

.lightbox_ultimate_image_anchor {

position: relative;

display: inline;

}

to the CSS — now works… and autoplays!!!

[wpCommerce]

Hi, I’m glad to hear that you figured it out.

Lightbox Ultimate comes with a range of shortcodes to popup various media files. Instructions for using the shortcodes are available here (Plugin Usage section):

WordPress Lightbox Ultimate Plugin – Display Media in a Fancy Lightbox Overlay

You can also customize the look and feel of each shortcode anchor. If you want to use the same CSS for all the shortcode anchors of your site please follow the instructions outlined here:

Lightbox Ultimate – How to Add Custom CSS to a Lightbox Anchor (Text or Image)

If you want to customize each shortcode anchor with different CSS please follow the instructions outlined here:

http://www.tipsandtricks-hq.com/wp-affiliate-link-manager/how-to-style-a-lightbox-shortcode-anchor-118

[Author]

Posts