Need help? Check out our Support site, then


Header height

  1. Hello, I'd want to know if it's possible to change the header height on Triton Lite using CSS...
    Also if there's a way to change the width of the posts area...
    Thanks.

    The blog I need help with is danielkons1.wordpress.com.

  2. Looks like you've figured out how to apply CSS just to the home page in your blog by adding ".home" to the front of your selector:

    body.home div.entry-content p {
    	display:none!important;
    }

    That should do the trick. Nice work!

    The only suggestion I have is that you could probably simplify that rule a bit. Give this a try:

    .home .entry-content p {
    	display:none;
    }
  3. I don't have any idea what you're talking about hehehe...
    Actually, I don't use CSS on my current blog (and don't even know how to do it :[ )...
    I was wanting to change to Triton Lite and upgrade, but I'd want to know first if it's possible to do the changes metioned above... Can you help me?

  4. My apologies! I think I mis-posted a reply... I'm not sure where that one came from. :)

    You can absolutely make the changes you asked about using CSS. I will work each one out and post examples below.

  5. Hello, I'd want to know if it's possible to change the header height on Triton Lite using CSS...

    There is more than one way to change the header height in the Triton Lite theme. If you have used the custom header uploader on the Appearance → Header page after you setup Triton Lite, here is one way to change that header image out with one that is a different size:

    #header-image {
    	background:url('YOUR_IMAGE_URL') repeat-x;
    	height: YOUR_IMAGE_HEIGHT;
    }

    Replace YOUR_IMAGE_URL with the link for an image you have uploaded to your media library. Replace YOUR_IMAGE_HEIGHT with your image height.

    Note that if you don't upload a custom header image, then you could use CSS to make a space manually and add in a background image separately like this:

    #logo {
    	display: block;
    	background:url('YOUR_IMAGE_URL') no-repeat;
    	padding-top: YOUR_IMAGE_HEIGHT;
    	height: YOUR_IMAGE_HEIGHT;
    }

    Keep in mind there are a number of different ways to do something, and these examples are just two possible options. You would need to adjust values in them until it worked in your blog with the header image you would like to use.

  6. Also if there's a way to change the width of the posts area...

    Do you mean the posts area on the Triton Lite home page? You could change those using CSS like this:

    .lay1 > div {
    	width: 455px;
    }
    
    .lay1 > div .imgwrap {
    	text-align: center;
    }

    Note that you cannot change the featured image sizes that appear on the home page because they are set by the theme. You can stretch theme, but note that the images may look pixelated if you do that. The better option is to just use the CSS above and center the images if you widen the post areas. However, if you want to try stretching the images themselves, you can try this to see if it looks okay to you:

    .lay1 > div img {
    	width: 100%;
    }

    Note that all of these CSS changes can be tested out on a blog using the Triton Lite theme and the Appearance → Custom Design → CSS → Preview button.

  7. Thank you very much!
    The header worked perfectly!
    And, actually, you resolved another issue unintentionally... I was wanting to display just 2 posts per line, like it got!
    But there's still a problem... you managed to increase the posts width, but not changing the area width, right? I think a better way to explain is that I'd want to increase the margins...
    I'd appreciate a lot if you had a solution for that...
    And also clarify if it's possible to put a music player like SCM...
    Thanks again!

  8. But there's still a problem... you managed to increase the posts width, but not changing the area width, right?

    I increased just the width of the posts on the Triton Lite home page. Did you mean you wanted to increase the entire container width for the home page?

  9. And also clarify if it's possible to put a music player like SCM...

    Here are the music players we support:
    http://en.support.wordpress.com/tag/music/

  10. Thanks!
    Actually, I'd want to decrease the container area...
    You can notice that with these CSS modifications you suggested, the captions got out of the posts area. I'd like very much if it's possible to decrase the whole width where the posts are diplayed (marked by the lines at the bottom of the posts), then I guess this issue would be solved.. .

  11. *the captions got out of the featured images

  12. *the captions got out of the featured images

    Could you post a link to the WordPress.com blog you're working on? It's easier to help when looking at the site directly.

  13. I'm not current working on any blog... I'm gonna upgrade and then I get back to you, but, just to confirm, its possible to do these kind of width changes, right?

  14. Absolutely.

  15. Ok!
    I upgraded my account, could you take a look and check what I'm meaning?
    http://danielkons1.wordpress.com/

    Also, in my firt post, uPad 25, the image is appearing twice at the home page... What can be wrong?

    Thanks a lot!

  16. designsimply? Could you assist me?

  17. To make the content area below images on the Triton Lite home page smaller, give this a try:

    .lay1 > div .post-content {
    	width: 200px;
    	margin: 0 auto;
    }

    Adjust the width number to your liking.

  18. Also, in my firt post, uPad 25, the image is appearing twice at the home page... What can be wrong?

    Triton Lite displays the featured image if you set one, and your "uPad 25" post has an image as the post content as well as a featured image. You can remove it by opening the post for editing and clicking on the "Remove featured image" link.

    Also see http://en.support.wordpress.com/featured-images/ for more background info.

  19. Thanks :]
    But (sorry to keep bothering!) it was another thing... I was talking about the whole blog width... Maybe it got confused because I said before the captions got out the featured image, but I meant the coments counts and dates...

    About the featured image, that's not what's happening hehe... Actually you do can have a content image and a featured image (I did that on several other posts)...
    Anyway, I tried to remove the featured image and nothing changed...
    I don't remember quite well, but I may have created this post at the "new post" tab that gets next to the reader... Can it be related to the issue?

    Really appreciate your help!
    Thanks and sorry for the trouble...

  20. I was talking about the whole blog width...

    Your description was confusing to me. In the future, could you please use specific examples including text (i.e. the date text such as "April 24, 2012 " doesn't look right when I hover over posts on the home page) or screenshots are good too.

  21. For the issue where the date and comments number falling outside the edges of the images when you hovered over them, try removing your current rules for ".lay1 > div .imgwrap" and ".lay1 > div img" and ad this instead:

    .lay1 > div .imgwrap {
    	width: 80%;
    	display: block;
    	margin: 0 auto;
    }
    .lay1 > div img {
    	width:100%;
    }
  22. About the featured image, that's not what's happening hehe... Actually you do can have a content image and a featured image (I did that on several other posts)...

    You're right. I think the duplicate is from an excerpt in this case.

    Open this link:
    https://danielkons1.wordpress.com/wp-admin/post.php?post=1092&action=edit

    Find the Excerpt box.

    Remove this code:
    <img src="http://danielkons1.files.wordpress.com/2012/04/upad-25-10_2011.jpg" alt="uPad 25" class="size-full wp-image-1091" />

    Save the post.

    Does that fix it?

  23. Ok, sorry... forget that...
    http://danielkons1.files.wordpress.com/2012/05/untitled-1.jpg
    I'd want to decrease the width of the area between the red marks (i.e. the posts area, the container area).
    I can't explain better...
    Thanks.

  24. About the duplicated image, I can't find this specific code...
    I've already tried taking out some parts of the code but didn't work...

    Take a look what's appearing, please:
    <p style="text-align:center;"><img class=" wp-image-1091 aligncenter" src="http://danielkons1.files.wordpress.com/2012/04/upad-25-10_2011.jpg" alt="uPad 25" width="480" height="640" /></p>

  25. The duplicate image is definitely in the Excerpt area. Note that it's a separate box and the boxes are configurable, so you need to look around on the edit page to find it. You can also hide some of the boxes. To check that, open the post for editing, click the "Screen Options" tab at the top right, and make sure "Excerpt" is checked:
    https://danielkons1.wordpress.com/wp-admin/post.php?post=1092&action=edit

    You can see what the Excerpts box looks like on this help page:
    http://en.support.wordpress.com/splitting-content/excerpts/#creating-excerpts

  26. I took out the whole code and, despite the image is gone in the post, there's still 2 images at the home page hehe

  27. You took the post content out of the editor, but you should leave that and remove the content of the Excerpt box. It looks like this in your post right now:
    http://cl.ly/GTii/o

  28. http://danielkons1.files.wordpress.com/2012/05/untitled-1.jpg
    I'd want to decrease the width of the area between the red marks (i.e. the posts area, the container area).

    Aha, now I see what you're talking about!

    That's a little more tricky. To adjust the container width for the post list on the home page of Triton Lite, you will probably also have to adjust the width for ".lay1 > div" since you added custom CSS for that before and it would be too wide. Try updating to this:

    .lay1 {
    	width: 760px;
    }
    .lay1 > div {
    	width: 360px;
    }
  29. Oh, ok! How I'm dumb!
    It worked now, tahnk you very much!

Topic Closed

This topic has been closed to new replies.

About this Topic