Album Image Modification

0
Hey! I'm not sure if anyone can help me. I wish to add a modification to the code within my album template so the album image can pop out and go larger.


I've uploaded an attachment with my post..

Thank you very much :)

Best,

Greg
Responses (9)
  • Accepted Answer

    Saturday, August 24 2013, 08:04 AM - #Permalink
    0
    Hmm. I'm trying to upload a .txt attachment and it says unsupported.. What is supported? Thanks
    The reply is currently minimized Show
  • Accepted Answer

    Sunday, August 25 2013, 12:46 AM - #Permalink
    0
    I've just uploaded it to pastebin as I can't seem to upload the txt file :)

    http://pastebin.com/jqyrqhvg

    I hope you can help my problem.

    Thank you very much,

    Best wishes,

    Greg
    The reply is currently minimized Show
  • Accepted Answer

    Tuesday, August 27 2013, 09:08 PM - #Permalink
    0
    Any ideas Germi? Thank you!

    Greg
    The reply is currently minimized Show
  • Accepted Answer

    greengeek
    greengeek
    Offline
    Wednesday, August 28 2013, 05:27 AM - #Permalink
    1
    All you need to do is install a lightbox or similar plugin or you can use a template that has that feature, like the yootheme templates. Then just edit the layout file in mc to call the css for that image.

    I did something along these lines for both the artist and album pages at http://www.kevinbluemel.com/music/studio-albums/uncharted
    The reply is currently minimized Show
  • Accepted Answer

    Wednesday, August 28 2013, 09:00 AM - #Permalink
    0
    Hey there, Greengeek. Thank you! I do in fact have a YooTheme template which obviously comes with Widgetkit which will provides the necessary elements for a lightbox. The problem I am experiencing is wrapping the correct code around the PHP code itself.. I seem to be getting a PHP error / blank page when entering the lightbox code.

    Even when using the 'code' button here, it strips most of my code so here you can see what I'm doing on pastebin..

    I hope you can help. Nice work with your site btw!

    Greg
    The reply is currently minimized Show
  • Accepted Answer

    greengeek
    greengeek
    Offline
    Friday, August 30 2013, 09:40 AM - #Permalink
    0
    Thanks!

    It has been a while since I made that modification. I think this was the code I added to make it work:

    Hmmm, looks like his site as a bug where it will allow posting of code on a new post, but not on an edit. Let me try again in a new post as it was displaying just fine on this one until i decided to edit it for spelling.
    The reply is currently minimized Show
  • Accepted Answer

    greengeek
    greengeek
    Offline
    Friday, August 30 2013, 09:46 AM - #Permalink
    0
    This would require the yootheme widget kit to be installed and working. Comes with most yoothemes.


    <div class='div_imatge_gran'>
    <?
    $image_attr = array(
    "title" => $this->album->name ,
    "class" => "imatge_gran"
    );
    $image_attr_shadow = array(
    "title" => $this->album->name ,
    "class" => "modalizer_link",
    "res" => "shadowbox"
    );
    $image = JHTML::link('images/albums/' . $this->album->image , JHTML::image('images/albums/' . $this->album->image , $this->album->name , $image_attr ) , $image_attr_shadow );
    echo $image;
    ?>
    </div>
    • Greg Spinks
      more than a month ago
      Hey! Thank you for your response. I added this code, and for some reason it produces a server/php error. No idea why! :/

      I'll keep trying, though not sure what else I can do. Thank you though
    The reply is currently minimized Show
  • Accepted Answer

    Monday, September 09 2013, 02:16 PM - #Permalink
    0
    I've nearly accomplished what I set out to do.


    <div class='div_imatge_gran brighten'>
    <?
    $image_attr = array(
    "title" => $this->album->name ,
    "class" => "imatge_gran"
    );

    $image = JHTML::image('images/albums/' . $this->album->image , $this->album->name , $image_attr );
    echo ' <a data-lightbox="transitionIn:fade;transitionOut:fade;" href="'.'$image'.'">'.$image.'</a>';
    ?>
    </div>


    This is my code in it's current form. The lightbox works, and opens - however, the image doesn't. The image path when looking at inspector appears to render like this;

    href="/sandbox/$image"

    The href needs to be the same as the img source, like this '/sandbox/images/albums/R-4548405-1368038234-6909.jpeg'

    Can anyone tell me what I'm doing wrong? Thank you! :)

    Greg
    The reply is currently minimized Show
  • Accepted Answer

    Monday, September 09 2013, 02:24 PM - #Permalink
    0
    This form keeps stripping my html code, even using the tag.. But I'm sure you get the jist.
    The reply is currently minimized Show
Your Reply