Tumblr Theme photos - how to stop linking to larger image and link to permalink

Question

Hi there : I have a simple theme with what I thought was a simple issue. In the photo block - I want to have the image when clicked to go to the "permalink" page for that post, not expand the image into a light box or show the image. There is no obvious HREF to modify to go to permalink - so I'm lost.

From the permalink page - Expanding is fine. I've tinkered with all of the variables and I can completely turn off the linking of images - but cannot modify behavior to send them to the permalink. Hope this makes sense - and thanks in advance.

Full code is also here: fullcode from theme

the actual tumblr is: bestofmoderndesign.tumblr.com

code :

 {block:Photo}
                            <div class="media">
                                {LinkOpenTag}
                                    <img src="{block:PermalinkPage}{PhotoURL-500}{/block:PermalinkPage}{block:IndexPage}{block:IfNot500pxPosts}{PhotoURL-400}{/block:IfNot500pxPosts}{block:If500pxPosts}{PhotoURL-500}{/block:If500pxPosts}{/block:IndexPage}" width="{block:PermalinkPage}{PhotoWidth-500}{/block:PermalinkPage}{block:IndexPage}{block:IfNot500pxPosts}{/block:IfNot500pxPosts}{block:If500pxPosts}{PhotoWidth-500}{/block:If500pxPosts}{/block:IndexPage}" height="{block:PermalinkPage}{PhotoHeight-500}{/block:PermalinkPage}{block:IndexPage}{block:IfNot500pxPosts}{PhotoHeight-400}{/block:IfNot500pxPosts}{block:If500pxPosts}{PhotoHeight-500}{/block:If500pxPosts}{/block:IndexPage}" alt="{PhotoAlt}" />
                                {LinkCloseTag}
                                {block:IfEnableColorbox}
                                    <a href='{PhotoURL-HighRes}' class='fullsize colorbox' rel="fullsize"><span>{lang:Click for high-res photo}</span></a>
                                {/block:IfEnableColorbox}
                            </div>
                            {block:Caption}
                                <div class="copy">{Caption}</div>
                            {/block:Caption}
                        {/block:Photo}

Answer 1

{LinkOpenTag} and {LinkCloseTag} are what are generating the link to the large image page.
Instead use <a href='{Permalink}'> and </a>.

If you want it to continue this behaviour on permalink pages you can always change the code to something like:

{block:Photo}
    <div class="media">
        {block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}
        {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}
            <img src="{block:PermalinkPage}{PhotoURL-500}{/block:PermalinkPage}{block:IndexPage}{block:IfNot500pxPosts}{PhotoURL-400}{/block:IfNot500pxPosts}{block:If500pxPosts}{PhotoURL-500}{/block:If500pxPosts}{/block:IndexPage}" width="{block:PermalinkPage}{PhotoWidth-500}{/block:PermalinkPage}{block:IndexPage}{block:IfNot500pxPosts}{/block:IfNot500pxPosts}{block:If500pxPosts}{PhotoWidth-500}{/block:If500pxPosts}{/block:IndexPage}" height="{block:PermalinkPage}{PhotoHeight-500}{/block:PermalinkPage}{block:IndexPage}{block:IfNot500pxPosts}{PhotoHeight-400}{/block:IfNot500pxPosts}{block:If500pxPosts}{PhotoHeight-500}{/block:If500pxPosts}{/block:IndexPage}" alt="{PhotoAlt}" />
        {block:IndexPage}</a>{/block:IndexPage}
        {block:PermalinkPage}{LinkCloseTag}{/block:PermalinkPage}
        {block:IfEnableColorbox}
            <a href='{PhotoURL-HighRes}' class='fullsize colorbox' rel="fullsize"><span>{lang:Click for high-res photo}</span></a>
        {/block:IfEnableColorbox}
    </div>
    {block:Caption}
        <div class="copy">{Caption}</div>
    {/block:Caption}
{/block:Photo}