FOR VERSION 2.5.3

By default, when you click the profile image there is an image popup of a larger image. I think it is pretty neat, but also can be confusing. Some members will click the profile image thinking it will take them to more images of the member.

You can simply add a caption to the image popup and put a link in that caption for members to click to go to the member's galley/albums (sorry, still not sure what to call it, gallery or album). Here is how I did it:

The code for the image popup is in member_sections_picture.tpl. It looks like this:

<!-- IF top.active_module == "member_profile" -->
        <a class="picture_zoom" href="{top.virtual_pic_path}{member_picture_large}" id="profile_picture_{member_id}" target="_blank"><img src="{top.virtual_pic_path}{member_picture}" alt="" border="0" /><br></a>
        <div id="profile_picture_{member_id}_zoom" style="display:none"><img src="{top.virtual_pic_path}{member_picture_large}" alt="" border="0" /><br></div>
    <!-- ELSE -->

Make the following addition to the code right after the  2nd <br>  so it looks like this (code in red below is what was added):

<!-- IF top.active_module == "member_profile" -->
        <a class="picture_zoom" href="{top.virtual_pic_path}{member_picture_large}" id="profile_picture_{member_id}" target="_blank"><img src="{top.virtual_pic_path}{member_picture}" alt="" border="0" /><br></a>
    <div id="profile_picture_{member_id}_zoom" style="display:none"><img src="{top.virtual_pic_path}{member_picture_large}" alt="" border="0" /><br><div align="center"><font size="4">To check out the member picture gallery, click: <a href="{top.virtual_path}member/{member_id}/albums/" onclick="window.location=this.href">Gallery</a></font></div></div>
    <!-- ELSE -->

That is it. Now when you click the profile image and the larger image popups, there will be a caption with a link to the members albums/gallery.

CAUTION: Be sure to add the code right after the 2nd <br>. Don't hit your enter key to add the code or put a space after the <br>. Add the code right after the <br> without any space or return key code.

STYLING: My weak point. I tried using inline css to style the font size and center the code, but inline css did not work. I ended up using html code but if someone knows how to style with inline css (not external sheet), than please post.

Thanks vlad for your help

Last edited by db3204 (2009-07-02 10:33:26)