{"id":2023,"date":"2016-01-08T15:36:07","date_gmt":"2016-01-08T15:36:07","guid":{"rendered":"http:\/\/tn.joomexp.com\/wordpress\/wp-celsius\/?page_id=2023"},"modified":"2016-01-08T15:36:07","modified_gmt":"2016-01-08T15:36:07","slug":"lightbox","status":"publish","type":"page","link":"https:\/\/demo.exptheme.com\/celsius\/lightbox\/","title":{"rendered":"Lightbox"},"content":{"rendered":"

[vc_row animation=”” panel_style=”” css=”.vc_custom_1455850612661{margin-bottom: 50px !important;}”][vc_column][vc_custom_heading text=”LIGHTBOX” font_container=”tag:h2″ use_theme_fonts=”yes” letter_spacing=” 1px” layout_style=”uk-module-title-alt” align=”wp-celsius-heading-left” animation=”” css=”.vc_custom_1455678966866{margin-bottom: 30px !important;}”][vc_column_text css=”.vc_custom_1453791692680{margin-bottom: 45px !important;}”]Use the data-uk-lightbox<\/code> data attribute to show a popup box with an image. The lightbox utilizes the modal component<\/a> to load images and videos to fit the entire modal box. You can configure the lightbox images to scroll through a gallery by setting the group<\/code> parameter.[\/vc_column_text][vc_custom_heading text=”TOGGLE LIGHTBOX FROM BUTTON” font_container=”tag:h3″ use_theme_fonts=”yes” letter_spacing=” 1px” layout_style=”uk-module-title” align=”wp-celsius-heading-left” animation=”” css=”.vc_custom_1453791702727{margin-bottom: 10px !important;}”][vc_btn title=”View Image” style=” uk-button-default” css_animation=”” target=” _blank” lightbox=”yes” link=”url:http%3A%2F%2Fdev.joomexp.com%2Fwordpress%2Fwp-celsius%2Fwp-content%2Fuploads%2F2016%2F01%2F4.jpg|||” css=”.vc_custom_1497576286245{margin-top: 5px !important;margin-right: 5px !important;}”][vc_custom_heading text=”USING THE LIGHTBOX IN A GALLERY” font_container=”tag:h3″ use_theme_fonts=”yes” letter_spacing=” 1px” layout_style=”uk-module-title” align=”wp-gaucho-heading-left” animation=”” css=”.vc_custom_1452268168917{margin-top: 20px !important;}”][vc_column_text css=”.vc_custom_1497575811782{margin-top: 30px !important;margin-bottom: 20px !important;}”]<\/p>\n

\n
\"\"<\/a><\/div>\n
\"\" <\/a><\/div>\n
\"\"
\n<\/a><\/div>\n<\/div>\n

[\/vc_column_text][vc_custom_heading text=”ADDING AN OVERLAY” font_container=”tag:h3″ use_theme_fonts=”yes” letter_spacing=” 1px” layout_style=”uk-module-title” align=”wp-gaucho-heading-left” animation=”” css=”.vc_custom_1452268674250{margin-top: 20px !important;}”][vc_column_text css=”.vc_custom_1452270406113{margin-bottom: 15px !important;}”]I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.[\/vc_column_text][vc_raw_html css=”.vc_custom_1452270434531{margin-bottom: 15px !important;}”]LiUyMFRoZSUyMCUzQ2NvZGUlM0V1ay1vdmVybGF5LXBhbmVsJTNDJTJGY29kZSUzRSUyMGNsYXNzJTIwY2FuJTIwYmUlMjB1c2VkJTIwdG8lMjBwbGFjZSUyMGFuJTIwb3ZlcmxheSUyMHBhbmVsJTIwdGhhdCUyMGFwcGVhcnMlMjBvbiUyMGhvdmVyLiUyMEFkZGl0aW9uYWxseSUyQyUyMHlvdSUyMGNhbiUyMHVzZSUyMHRoZSUyMGZvbGxvd2luZyUyMGNsYXNzZXMlMjB0byUyMGFuaW1hdGUlMjB0aGUlMjBvdmVybGF5JTIwcGFuZWwlM0E=[\/vc_raw_html][vc_column_text css=”.vc_custom_1452270502914{margin-bottom: 70px !important;}”]<\/p>\n

\n\n\n\n\n\n\n\n\n\n
animation<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
uk-overlay-slide-top<\/code><\/td>\nslide the overlay panel in from the top<\/td>\n<\/tr>\n
uk-overlay-slide-bottom<\/code><\/td>\nslide the overlay panel in from the bottom<\/td>\n<\/tr>\n
uk-overlay-slide-left<\/code><\/td>\nslide the overlay panel in from the left<\/td>\n<\/tr>\n
uk-overlay-slide-right<\/code><\/td>\nslide the overlay panel in from the right<\/td>\n<\/tr>\n
uk-overlay-fade<\/code><\/td>\nfade in the overlay panel<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

[\/vc_column_text][vc_column_text css=”.vc_custom_1452270541718{margin-bottom: 45px !important;}”]<\/p>\n

\n\n\n\n\n\n\n\n\n
class<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
uk-overlay-top<\/code><\/td>\nalign the overlay panel to the top<\/td>\n<\/tr>\n
uk-overlay-bottom<\/code><\/td>\nalign the overlay panel to the bottom<\/td>\n<\/tr>\n
uk-overlay-left<\/code><\/td>\nalign the overlay panel to the left<\/td>\n<\/tr>\n
uk-overlay-right<\/code><\/td>\nalign the overlay panel to the right<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

[\/vc_column_text][vc_column_text css=”.vc_custom_1497576176352{margin-top: 30px !important;margin-bottom: 20px !important;}”]<\/p>\n

\n
\"\"<\/a><\/div>\n
\"\" <\/a><\/div>\n
\"\"<\/a><\/div>\n<\/div>\n

[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n","protected":false},"excerpt":{"rendered":"

[vc_row animation=”” panel_style=”” css=”.vc_custom_1455850612661{margin-bottom: 50px !important;}”][vc_column][vc_custom_heading text=”LIGHTBOX” font_container=”tag:h2″ use_theme_fonts=”yes” letter_spacing=” 1px” layout_style=”uk-module-title-alt” align=”wp-celsius-heading-left” animation=”” css=”.vc_custom_1455678966866{margin-bottom: 30px !important;}”][vc_column_text css=”.vc_custom_1453791692680{margin-bottom: 45px !important;}”]Use the data-uk-lightbox data attribute to show a popup box with…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2023","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/pages\/2023","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/comments?post=2023"}],"version-history":[{"count":0,"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/pages\/2023\/revisions"}],"wp:attachment":[{"href":"https:\/\/demo.exptheme.com\/celsius\/wp-json\/wp\/v2\/media?parent=2023"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}