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 6 of 6
  1. #1
    New Coder
    Join Date
    Oct 2011
    Posts
    20
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Unhappy Where would i put this code?

    I am trying to separate the way my index page looks from the way my permalink page looks. I want the images on my permalink page to be their original size, center, with the notes below.

    Mine looks like this (example permalink page): http://testingmyblogagain.tumblr.com/post/11641079709

    It should look like this:http://ogisio.tumblr.com/post/11259962041

    Someone gave this code below to fix it, but i dont know where to place it in my theme html code.
    Code:
    <div class="post pic">
        {block:IndexPage}
        <img src="{PhotoURL-250}" />
        {/block:IndexPage}
        
        {block:PermalinkPage}
        <img src="{PhotoURL-500}" />
        {/block:PermalinkPage}
    </div> <!--EndFragment-->
    Here is a link to the page i am referring to: http://testingmyblogagain.tumblr.com

    Finally here is my full theme HTML code.
    Code:
    <!DOCTYPE html>
    <html lang="en-us">
    <head>
    <meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org">
    <meta>
    <title>{Title}</title>
    <meta name="description" content="{MetaDescription}">
    <link rel="shortcut icon" href="{Favicon}">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">
    <style type="text/css">
    .titlesetting
    {
    color:#fff;
    background-color:none;
    text-align:center;
    text-transform:capitalize;
    text-decoration:blink;
    }
        
    #wrapper
    {
    height:1000px;
    width:1000px;
    margin-left:220px;
    border:none;
    }
    
    body
    {
    color:#fff;
    background-color:#000;
    text-align:justify;
    text-decoration:none;
    text-transform:lowercase;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-image:url();
    }
    
    img
    {
    border:none;
    height:300px;
    width:300px;
    float:left;
    margin:0px;
    }
          
    .postpic
    {
    text-align:center;
    height:300px;
    width:300px;
    float:left;
    margin:0px;
    overflow:auto;
    }
        
    a
    {
    font-weight:bold;
    text-decoration:none;
    color:#2554C7;
    background-color:{background-color:color}
    }
    
    .sidebar 
    {
    background-color:#000;
    border:solid;
    border-width:2px;
    border-color:#fff;
    color:#fff;
    text-align:left;
    overflow:inherit;
    width:210px;
    height:500px;
    position:fixed;
    top:70px;
    left:7px;
    }
    
    .sidebar img
    {
    width:128px;
    height:auto;
    display:block;
    position:fixed;
    top:110px;
    left:50px;
    }
    
    .perma
    {
    background-color:{color:center};
    display:block;
    width:500px;
    line-height:18px;
    float:right;
    padding:5px;
    margin-top:10px;
    text-align:left;
    }
    .perma img
    {
    width:16px;
    height:16px;
    position:relative;
    top:2.5px;
    }
        
    {CustomCSS}
    </style>
    </head>
    <body>
    {block:Description}{/block:Description}<a href="/"><h1 class="titlesetting">{Title}</h1></a>
    <hr>
    {block:Description}
    <h5 class="sidebar"><img src="{PortraitURL-128}" />{Description}</h5>
    {/block:Description}
    <div id="wrapper">{block:Posts} {block:Text}
    <div class="postpic">{block:Title}
    <h5><a href="{Permalink}">{Title}</a></h5>
    {/block:Title} {Body}</div>
    {/block:Text} {block:Photo} <a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"></a> {/block:Photo} {block:Photoset} {Photoset-500} 
    
    {/block:Photoset} {block:Link}
    <div class="postpic"><a href="{URL}" class="link">{Name}</a> {block:Description} {Description} {/block:Description}</div>
    {/block:Link} {block:Video}
    <div class="postpic">{Video-250} {block:Caption}<a href="{Permalink}">
    {Caption}</a> {/block:Caption}</div>
    {/block:Video}{block:Audio}
    <div class="postpic">{AudioPlayerBlack}{PlayCountWithLabel} {block:Caption}<a href="{Permalink}">{Caption}</a> {/block:Caption}</div>
    {/block:Audio}
    {block:PostNotes}
            <div class="perma">
            {PostNotes}
        </div>
    {/block:PostNotes}
    {/block:Posts}
    </div>
    
    
    
    
    </body>
    </html>

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,090
    Thanks
    23
    Thanked 593 Times in 592 Posts
    I want the images on my permalink page to be their original size, center, with the notes below.


    try this:

    #wrapper
    {
    width:500px;
    margin-left: auto;
    margin-right: auto;
    border:none;
    }

  • #3
    New Coder
    Join Date
    Oct 2011
    Posts
    20
    Thanks
    6
    Thanked 0 Times in 0 Posts
    for my permalink page? or do i change my wrapper id to those settings?

  • #4
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,090
    Thanks
    23
    Thanked 593 Times in 592 Posts
    Quote Originally Posted by tai chi View Post
    for my permalink page? or do i change my wrapper id to those settings?
    I did it on your permalink page css code. I left the under development box up, so it might look a little weird. And I'm not sure if this is what you wanted. Take a look and let me know.

    Just comment out your css
    Code:
    #wrapper
    {
    height:1000px;
    width:1000px;
    margin-left:220px;
    border:none;
    }
    and add mine
    Code:
    #wrapper
    {
    width:500px;
    margin-left: auto;
    margin-right: auto;
    border:none;
    }
    If you don't like it, go back to the old way or mess around with what I gave you.
    Last edited by sunfighter; 10-24-2011 at 08:59 PM.

  • #5
    New Coder
    Join Date
    Oct 2011
    Posts
    20
    Thanks
    6
    Thanked 0 Times in 0 Posts
    ill try this now, thankyou
    EDIT: i see what you did, it center my permalink- yes, but i wanted the index posts to stay in grid form, the permalink images centered, and the images on permalink pages to be their original size. I have an example of what i want above
    Last edited by tai chi; 10-24-2011 at 10:52 PM.

  • #6
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,090
    Thanks
    23
    Thanked 593 Times in 592 Posts
    Sorry, guess I don't know what you want.


  •  

    Tags for this Thread

    Posting Permissions

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