Solution: Lightbox for single images in content

Posted by Community Admin on 04-Aug-2018 13:56

Solution: Lightbox for single images in content

All Replies

Posted by Community Admin on 12-Feb-2012 00:00

Hi,

just wanted to share my quick solution to enable the built in lightbox functionality for images that were inserted via the editor in content elements.

Place the following code in your masterpage (in my case a custom one):

<sf:ResourceLinks ID="resourcesLinks" runat="server">
        <sf:ResourceFile JavaScriptLibrary="JQuery" />
        <sf:ResourceFile JavaScriptLibrary="JQueryFancyBox"/>
    </sf:ResourceLinks>
    <sf:ResourceLinks id="resourcesLinks2" runat="server" UseEmbeddedThemes="true" Theme="Default">
        <sf:ResourceFile Name="Telerik.Sitefinity.Resources.Themes.Basic.Styles.fancybox.css" Static="true" />
    </sf:ResourceLinks>
 
And just before the closing form-Tag:
<script type="text/javascript">
            $(document).ready(function ()
                $("#idOfMyContentDiv a:has(img)").fancybox( titleShow: true );
            );
</script>
to enable it for all img-Tags that reside in an a-Tag.

HTH
Matthias

Posted by Community Admin on 13-Feb-2012 00:00

Dear Matthias
Thank's a lot for sharing.
Markus

@ Telerik
Here comes whishfull thinking. When entering an image in content block you could choose two images.
1st is thumb or images shown on page (small size kb)
2nd is large lightobox (large size or even a different images)
Well maybe 6.0 will have such a feature :-)

Posted by Community Admin on 20-Sep-2013 00:00

@Telerik

After 2 years this is still the most requested feature from my clients. 

Here is a mock up of a super nice solution.

No need to pits it - maybe someone at Telerik likes the idea and has some time to make this hapen.

Markus

This thread is closed