Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help fixing a tumblr theme

    I currently have a custom HTML theme on my Tumblr page, and there is a problem I'm having. Whenever I click on a picture from my page and the picture's permalink loads, all it shows is my theme's background and the reblog/like/etc buttons - no picture or notes.

    I have no idea why this is happening, and I'm not good enough with HTML to figure out why it's happening.

    To recreate the problem:

    1. Enter 0tay.tumblr.com into your address bar.

    2. Choose any picture that shows up and click on the link below it that says reblog.

    3. A new window/tab will load, but the picture will not load (normally it loads a larger version of the picture and has notes underneath it).

    Here is my theme's HTML code:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    
    <html lang="en">
    
    <head>
    
    
    <!--
    THEME BY BLINK AND IT'S OVER
    CREATED BY: HTTP://WWW.KANESIMSWILSON.CO.UK
    -->
    
    <title>{Title}</title>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">
    <link rel="shortcut icon" href="{Favicon}" />
    
    <meta name="color:Blog title" content="#FFFFFF"/>
    <meta name="color:Text" content="#FFFFFF"/>
    <meta name="color:Links" content="#FFFFFF"/>
    <meta name="color:Links Hover" content="#CFD86D"/>
    <meta name="if:Background image" content="1">
    <meta name="if:Show notes on permalink pages" content="1">
    <meta name="if:Show notes on home page" content="1">
    <meta name="if:One row" content="0">
    <meta name="if:Two rows" content="1">
    <meta name="if:Three rows" content="0">
    <meta name="if:Four rows" content="0">
    <meta name="if:RSS link" content="1">
    <meta name="if:Archive link" content="1">
    <meta name="color:Background" content="#ffffff"/>
    <meta name="font:Body" content="Helvetica"/>
    <meta name="image:Background" content="http://static.tumblr.com/2w7y46r/tzYlh3lyo/heart-of-the-universe.jpg">
    <meta name="if:Use logo" content="0">
    <meta name="image:Logo" content="">
    <meta name="color:Title" content="#ffffff"/>
    <meta name="color:Text Bubble" content="#000000"/>
    
    {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
    
    <script type="text/javascript" src="http://static.tumblr.com/ts2nqrf/Msal8du92/cufon.js"></script>
    <script type="text/javascript" src="http://static.tumblr.com/ts2nqrf/mNQl8du9p/bebas.js"></script>
    <script type="text/javascript" src="http://static.tumblr.com/df28qmy/u5slh3ibc/jquery.min.js"></script>
    
    <script type="text/javascript">
    Cufon.DOM.ready(function() {
    Cufon.replace('.bebas', { fontFamily: 'bebas', hover:true });
    $('.bebas').css('visibility','visible');
    });
    </script>
    
    
    <style type="text/css">
    
    
    h1 { color:{color:Blog title}; font-weight: normal; font-size: 50px; font-family: 'BebasNeueRegular', sans-serif; line-height: -4px;{block:ifuselogo}display:none;{/block:ifuselogo}}
    h1 a {color:{color:Blog title};}
    
    body {height: 100%; background-color:{color:Background}; color: {color:Text};font-size: 11px; font-family:{font:Body}; line-height: 14px; padding: 30px 0 200px 0; {block:ifbackgroundimage}background-attachment: fixed; background-image:url('{image:Background}');{/block:ifbackgroundimage}}
    
    a {color: {color:Links}; text-decoration:none;}
    
    a:hover { color: {color:Links Hover}; -webkit-transition-duration: 0.5s; }
    
    a.title {color: {color:Links}; text-decoration:none;}
    
    #container { width: 1050px; margin: auto auto auto auto; position: relative;}
    
    #container .header { width: 1050px; margin: auto auto; }
    
    #container .description {padding: 10px 0px 40px; clear: both; position: relative; text-align:center; width:500px; margin-left: auto ; margin-right: auto;}
    
    #container .posts {width: 1050px; clear: both; position: relative; margin-left: auto; margin-right: auto; padding-top:30px; }
    
    #container .box {width: 345px;{block:iftworows}width: 500px;{/block:iftworows}{block:iffourrows}width: 250px; margin-bottom:20px;{/block:iffourrows} {block:indexpage}{block:ifonerow}width: 600px; padding-left:21%;{/block:ifonerow}{/block:indexpage}margin-left: 5px; float: left; margin-bottom: 15px; position: relative; }
    
    #container .box a{-webkit-transition-duration: 0.5s;}
    
    #container .box img {max-width: 100%; border:0px; -webkit-transition-duration: 0.5s; opacity:1;}
    
    #container .title { font-size: 12px;line-height: 18px; text-decoration: none; display: block; color:{color:Title}; padding: 8px;}
    
    #container .ask { font-size: 11px;line-height: 18px; text-decoration: none; display: block; color:{color:Title}; padding: 8px;}
    
    #container .audio {width: 207px;}
    
    #container .columnHolder {width: 800px; margin: 5px 0 0 5px; overflow: hidden;}
    
    #container .columnHolder .column { width: 225px; min-height: 1px; float: left;}
    
    #container .columnHolder .column.middle { margin: 0 0px; }
    
    #arrow {font-size:15px; padding-left:20px; color:{color:Text Bubble}; margin-top:-5px; padding-bottom:5px;}
    
    {block:PermalinkPage}
    
    ..box { width: 600px !important; padding-left: 21%;}
    
    
    p.answer_form_container { width: 580px; }
    
    ol.notes { width: 600px; position:relative; padding-left:21%; list-style-type: none; margin: 0px 0 10px 0; padding: -10px -90px; }
    
    ol.notes li.note { margin: 0px 0 2px 0; padding: 0;}
    
    ol.notes a { color: #ffffff; }
    
    ol.notes img.avatar { display: true; padding:2px 0 0 2px; border:0px;}
    
    ol.notes blockquote { margin: 0; }
    
    ol.notes blockquote a { text-decoration: none; }
    
    {/block:PermalinkPage}
    
    ..video{text-align: center; background-color:black;}
    
    ..curve { background-color:{color:Text Bubble}; -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-bottomleft: 4px; moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px;-webkit-border-bottom-left-radius: 4px; overflow:hidden;}
    
    ..box:hover .perma {{block:indexpage}{block:ifshownotesonhomepage}opacity:1;{/block:ifshownotesonhomepage}{/block:indexpage} z-index:10000; top:50%;}
    
    ..perma { margin-top: -18px; opacity: 0; font-family:{font:Body}; font-size: 9px; z-index: 1000000; text-align: center; text-transform: uppercase; top:50%;
    
    }
    
    #top-link { position:fixed; right:5px; bottom:5px; color:white; font-weight:bold; text-decoration:none; padding:10px; border:0px; }
    
    #audiotest {background-image:url('http://static.tumblr.com/2w7y46r/gPklc94jg/play.png');margin-top: -27px;display:block;height:27px;z-index:-1000;width:250px;}
    
    ..box:hover .back {{block:indexpage}{block:ifshownotesonhomepage}opacity:1;
    {/block:ifshownotesonhomepage}{/block:indexpage}z-index:1000;}
    
    ..back { margin-top: -25px; width:100%; opacity: 0;
    z-index: 1000;}
    
    {block:PermalinkPage}
    
    ..back img{width:500px; height:20px;}
    
    {/block:PermalinkPage}
    
    {block:iffourrows}
    ..back img{width:100%; height:20px;}
    {/block:iffourrows}
    
    {block:iftworows}
    ..back img{width:500px; height:20px;}
    {/block:iftworows}
    
    {block:ifonerow}
    ..back img{width:600px; height:20px;}
    
    {/block:ifonerow}
    </style>
    
    <script src="http://static.tumblr.com/thpaaos/lLwkowcqm/jquery.masonry.js"></script>
    <script src="http://static.tumblr.com/df28qmy/SHUlh3i7s/jquery.infinitescroll.js"></script>
    <script src="http://static.tumblr.com/df28qmy/Mpalh3i8p/jquery.scrollto-1.4.0-min.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    //plugin
    jQuery.fn.topLink = function(settings) {
    settings = jQuery.extend({
    min: 1,
    fadeSpeed: 200
    }, settings);
    return this.each(function() {
    //listen for scroll
    var el = $(this);
    el.hide(); //in case the user forgot
    $(window).scroll(function() {
    if($(window).scrollTop() >= settings.min)
    {
    el.fadeIn(settings.fadeSpeed);
    }
    else
    {
    el.fadeOut(settings.fadeSpeed);
    }
    });
    });
    };
    
    //usage w/ smoothscroll
    $(document).ready(function() {
    //set the link
    $('#top-link').topLink({
    min: 400,
    fadeSpeed: 500
    });
    //smoothscroll
    $('#top-link').click(function(e) {
    e.preventDefault();
    $.scrollTo(0,300);
    });
    });
    
    $(window).load(function () {
    
    $('.posts').masonry(),
    
    $('.masonryWrap').infinitescroll({
    
    navSelector : "div#navigation",
    // selector for the paged navigation (it will be hidden)
    nextSelector : "div#navigation a#nextPage",
    // selector for the NEXT link (to page 2)
    itemSelector : ".box",
    // selector for all items you'll retrieve
    bufferPx : 10000,
    extraScrollPx: 11000,
    loadingImg : "http://b.imagehost.org/0548/Untitled-2.png",
    loadingText : "<em></em>",
    },
    // call masonry as a callback.
    function() { $('.posts').masonry({ appendedContent: $(this) }); }
    );
    
    });
    
    </script>
    
    <script></head>
    
    <body onload="setTimeout('function1()', 1000);setTimeout('function2()', 1500);">
    <a href="#top" id="top-link"><img style="border:0px;"src='http://b.imagehost.org/0971/jump_to_top_arrow.png'/></a>
    
    {block:indexpage}
    <script language="JavaScript">
    function function1(){
    window.scrollTo(0,5);
    }
    function function2(){
    window.scroll(0,2);
    }
    </script>
    
    {/block:indexpage}
    <br>
    
    <div id="container">
    <div class="header">
    
    <div style="text-align: center;">{block:ifuselogo}<img style="max-width:1500px; max-height:300px" src="{image:logo}"/>{/block:ifuselogo}<h1 class="bebas"><a href="/">{Title}</a></h1></div>
    
    <div style="text-align: center; font-size:9.4px; margin-top:-35px; {block:ifuselogo}margin-top:10px; {/block:ifuselogo}text-transform: uppercase;">
    
    {block:AskEnabled}<a href="/ask">MESSAGE</a>&nbsp;&nbsp;&nbsp;&nbsp;{/block:AskEnabled}
    
    {block:ifarchivelink}<a href="/archive">ARCHIVE</a>&nbsp;&nbsp;&nbsp;{/block:ifarchivelink}
    
    {block:ifrsslink}<a href="{RSS}"> RSS </a>&nbsp;&nbsp;&nbsp;{/block:ifrsslink}
    
    <a href="http://www.kanesimswilson.co.uk/">THEME</a>&nbsp;&nbsp;&nbsp;
    
    {block:HasPages}
    {block:Pages}<a href="{URL}">{Label}</a>&nbsp;&nbsp;&nbsp;{/block:Pages}
    {/block:HasPages}
    
    </div>
    
    <div class="description">{description}<br style="clear:both"></div></div>
    
    <div class="posts" id="allposts">
    {block:Posts}
    <div class="box"> 
    
    {block:Photo}
    {block:IndexPage}
    <a href="{Permalink}" target="_blank">{/block:IndexPage}
    {block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}
    <img style="min-width:100%;" src="{block:IndexPage}{PhotoURL-500}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}" alt="{PhotoAlt}">
    
    
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma">
    <a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a>
    <a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a></div>
    {/block:Photo}
    
    {block:Audio}
    <div class="curve">
    <div style=" width:100%; height:27px; font-size:1px; color:black; background-color:black;">
    {AudioPlayerBlack}
    </div><a href="{Permalink}" target="_blank" id="audiotest"></a></div><div id="arrow" style="color:black;">▼</div>
    
    
    {block:AlbumArt}<img style="border:1px solid white; width:50px; margin-left:5px;" src="{AlbumArtURL}"/>{/block:AlbumArt}
    
    {block:indexpage}<div style="{block:AlbumArt}min-height:40px; padding-left:70px;margin-top:-60px;{/block:AlbumArt}">{block:Caption}{Caption}{/block:Caption}</div>{/block:IndexPage}
    
    {block:ifshownotesonhomepage}{block:AlbumArt}<br>{/block:AlbumArt}{/block:ifshownotesonhomepage}
    
    
    
    {block:ifshownotesonhomepage}<br>{/block:ifshownotesonhomepage}
    {block:IndexPage}
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a>
    <a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a>{block:ExternalAudio}<a href="{ExternalAudioURL}">&nbsp;/&nbsp;download</a>{/block:ExternalAudio}</div>{/block:IndexPage}
    
    {/block:Audio}
    
    {block:Video}
    <div class="video">{block:iffourrows}
    {Video-250}{/block:iffourrows}{block:ifthreerows}
    {Video-250}{/block:ifthreerows}
    {block:iftworows}
    {Video-500}{/block:iftworows}{block:ifonerow}{Video-500}{/block:ifonerow}
    {block:PermalinkPage}{Video-500}{/block:PermalinkPage}</div>
    
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a><a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a></div>
    {/block:Video}
    
    {block:Text}
    <div class="curve">{block:Title}<a href="{Permalink}" class="title">&nbsp;{Title}&nbsp;</a>{/block:Title}</div>{block:Title}<div id="arrow">▼</div>{/block:Title}
    
    <div style="padding-left:8px; padding-top:2px; padding-right:8px;">{Body}</div>{block:ifshownotesonhomepage}<br><br>{/block:ifshownotesonhomepage}
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a><a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a></div>
    
    {block:More}<br><br> <a href="{Permalink}" class="readMore">Read More</a>{/block:More}
    {/block:Text}
    
    {block:Answer}
    
    <div class="curve"><a href="{Permalink}" class="ask">&nbsp;{Question}&nbsp;</a></div><div id="arrow">▼</div>
    
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img style="border:1px solid white;" src="{AskerPortraitURL-16}"/><span style="vertical-align: 25%;">&nbsp;&nbsp;{Asker}</span>
    <div style="padding-left:8px; padding-top:2px; padding-right:8px;">{Answer}</div>{block:ifshownotesonhomepage}<br><br>{/block:ifshownotesonhomepage}
    
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a></div>
    {/block:Answer}
    
    {block:Link}
    <div class="curve"><a href="{URL}" class="title" {Target}>&nbsp;{Name}&nbsp;</a>
    </div><div id="arrow">▼</div>
    {block:Description}<div style="padding-left:8px; padding-top:2px; padding-right:8px;">{Description}</div>{/block:Description}{block:ifshownotesonhomepage}<br><br>{/block:ifshownotesonhomepage}
    
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a><a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a></div>
    {/block:Link}
    
    {block:Quote}<div class="curve"><a href="{Permalink}" class="title">"{Quote}"</a></div><div id="arrow">▼</div>{block:Source}&nbsp;&nbsp;{Source}<br>{/block:Source}{block:ifshownotesonhomepage}<br><br>{/block:ifshownotesonhomepage}
    
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a><a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a></div>{/block:Quote}
    
    {block:Chat}
    <div class="curve">{block:Title}<a href="{Permalink}" class="title">&nbsp;{Title}&nbsp;</a>{/block:Title}</div>{block:Title}<div id="arrow">▼</div>{/block:Title}
    
    <table class="chat" style="padding-left:5px;"cellspacing="0">{block:Lines}<tr>{block:Label}<td class="name line{UserNumber}">{Label}</td>{block:Label}<td class="words line{UserNumber}">{Line}</td></tr>{/block:Lines}</table>
    {block:ifshownotesonhomepage}<br><br>{/block:ifshownotesonhomepage}
    
    <div class="back"><img src="http://static.tumblr.com/df28qmy/SIplh2z29/untitled-1.gif"/></div>
    <div class="perma"><a href="{Permalink}" target="_blank">{TimeAgo}</a>
    {block:NoteCount}<a href="{Permalink}" target="_blank">&nbsp;/&nbsp;{NoteCountwithLabel}{/block:NoteCount}</a><a href="{Permalink};" target="_blank">&nbsp;/&nbsp;reblog</a></div>
    {/block:Chat}
    
    {block:PermalinkPage}<block:Caption>{Caption}</block:Caption>{/block:PermalinkPage}
    
    {block:PermalinkPage}</div>
    {block:IfShowNotesOnPermalinkPages}{block:PostNotes}{PostNotes}{/block:PostNotes}{/block:IfShowNotesOnPermalinkPages}
    {/block:PermalinkPage}
    
    </div>{/block:Posts}
    </div>
    
    {block:IndexPage}
    <div class="columnHolder footer"><div class="column navigation" id="navigation">
    {block:Pagination}
    {block:PreviousPage}<a href="{PreviousPage}" class="navigate">{/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}
    {block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}{/block:Pagination}
    
    {block:PermalinkPagination}
    {block:NextPost}<a href="{NextPost}" class="navigate">{/block:NextPost}{block:NextPost}</a>{/block:NextPost}
    {block:PreviousPost}<a href="{PreviousPost}" class="navigate">{/block:PreviousPost}{block:PreviousPost}</a>{/block:PreviousPost}{/block:PermalinkPagination}</div></div>
    {/block:IndexPage}</div>
    
    <script type="text/javascript">autoscale(new Array('object', 'embed'));</script>
    
    
    </body>
    </html>
    PS: I'm not trying to promote my page or anything, I am only linking to it so you know what problem I'm having.

    Thanks

  • #2
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    does this site have a support forum or something? i think you would find greater help there. whenever someone posts code of this "tumblr" site im completely lost. it just doesn't look like real code.

  • #3
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The codes never are from tumblr itself, they're from individual people who make them. I have tried to contact the theme maker many times but have never received a reply, so I thought someone here might be able to help.

    Ah well

  • #4
    Regular Coder
    Join Date
    Jul 2011
    Location
    India
    Posts
    496
    Thanks
    3
    Thanked 57 Times in 56 Posts
    My suggestion is, you should use. jQuery pop-up plugin to show larger version of images.

    Here in my FF5 or any other tabbed browser it opens a new tab for each click on any image. This is not user friendly.

    Try to make your site user-friendly by limiting it in 1 page only...

    Yaa you can give a button or link to open image in new tab/windows.. so end user will have choice to open image in same or in new window.


    Cheers :-)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •