Jump to:

10845 Posts in 2513 Topics by 1792 members

All other Modules

SilverStripe Forums » All other Modules » Linking thumbnail to image?

Discuss all other Modules here.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 1866 Views
  • _Vince
    Avatar
    Community Member
    156 Posts

    Linking thumbnail to image? Link to this post

    I am creating a page on the CMS. I have been asked to use a lot of photos and the only way I can display them all in the one screenful is by having thumbnails.

    The idea is that the user clicks on the thumbnail and the full-size image is displayed in a lightbox. While it's easy enough to hack the HTML by hand and add the link to the full-size photo, I can't find any way that an ordinary user with no previous HTML experience could do it.

    Another problem is that the files get renamed when the CMS uploads them to the assets/ directory, so really, I am asking this "ordinary user with no HTML experience" to link an image with an unknown name to another image with an unknown name. They're not going to like that at all!

    I know about the gallery module and the image gallery module, but they seem to display a group of images in a block whereas I want to have the thumbnails interspersed with the text.

    Is there any user friendly way to do this?

    Thanks in advance,
    Vince.

  • Howard
    Avatar
    Community Member
    215 Posts

    Re: Linking thumbnail to image? Link to this post

    Hmmm tricky - one approach which might not be totally suitable but it might spark a better idea:

    If you can to limit it to say 10 images, you could add a tab on each page where they can upload image 1,2,3 ... etc then in the editor they could include a $Photo1 tag. Then on rendering you could search for each tag ie. $Photo2 and render the HTML based on the image associated with Photo 2 in the photo upload tab.
    You could do something similar to what is below (put this in the controller for Page.php)
    You would have to use the Photo1 function to pull the first photo from the current page.

    function Content() {
    return str_replace('$Photo1', $this->Photo1(), $this->Content);
    }
    // see the $this->Photo1() string up 2 lines? well that calls the Photo1() method below
    function Photo1() {
    return "This could be HTML/Text/Images or PHP";
    }

    Hope this sparks an idea.

  • _Vince
    Avatar
    Community Member
    156 Posts

    Re: Linking thumbnail to image? Link to this post

    Umm... yeah... that sounds like the way to go. A start anyway.

    I guess that if you know which photo goes with what you're well on your way.

    Cheers! I'll tinker with your suggestion and see what I can do.

  • patjnr
    Avatar
    Community Member
    101 Posts

    Re: Linking thumbnail to image? Link to this post

    extend the image class and then use gd functions to resize them. the images can be in 1 (one) folder in assets

  • _Vince
    Avatar
    Community Member
    156 Posts

    Re: Linking thumbnail to image? Link to this post

    I'll have to look into that, thanks for the suggestion.

    My main problem so far has been that if the users resize the image within the CMS, then I have no way of knowing what the file is called as SS adds the dimensions to the filename.

    I could parse the IMG tag and add all the code for the lightbox, but knowing what target image to point to was the problem.

    Your idea sounds interesting.

  • patjnr
    Avatar
    Community Member
    101 Posts

    Re: Linking thumbnail to image? Link to this post

    If you get it right please let me know as im also interested in the solution.

    i gave up trying to manipulate images inside the content area.
    Please help me understand, you talked about the gallery module and with the gallery module you images wont be inside the content area. you actually specify the folder to be used by that gallery.

    if the above is true then i can help you with the code.

    tx

    P

    1866 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.