Need help? Check out our Support site, then


Need help with Colour & Fonts

  1. sszeemedia2015
    Member

    Hello,

    I just changed the theme for my site to HERO and after spending a lot of time trying to find a solution to the below problems, I give up and need the powers that be to help me out.

    1. I want the post title colour to change from white to red.

    2. When I put the mouse on the post titles, instead of white to red (as it is now), I want it to be red to white.

    3. The tags/categories under the post titles are in dark grey. I want those to be changed either in white or red

    4. The Main Menu bar on top, I want to create a red highlight border on it. How do I create that?

    5. The I want to change the Menu font to be a bit bigger.

    6. I want the Main Menu font colour changed to white and when I put my cursor on it, I want the colour to be black.

    Many thanks in advance.

    The blog I need help with is sszeemedia.com.

  2. Thanks for posting into this CSS Forum where Staff provide assistance. Note that there will be a delay getting Staff support but another Volunteer may enter this thread and help you while you are waiting.

  3. sszeemedia2015
    Member

    thank you

  4. You're welcome. :)

  5. sszeemedia2015
    Member

    Apologies in advance for being a pain in the butt, but if anyone could help me out, it'll be greatly appreciated!

  6. Bumping your thread may have the opposite effect to the one you expect. Please just be patient while waiting.

  7. sszeemedia2015
    Member

    sorry... am trying to be patient but the supervisor is on my back... i'll wait! thank you

  8. Your are not likely to get support for this until tomorrow at the earliest. These support docs may be helpful:
    http://en.support.wordpress.com/custom-design/
    http://en.support.wordpress.com/custom-design/editing-css/
    http://en.support.wordpress.com/custom-design/custom-fonts/

  9. Hi there,

    I would've been here last night but had slept (time zone difference), thanks for chiming in @timethief. Just went through your post and here is the code I came up with:

    /* This changes post titles to red, and red to white mouse effect */
    #content .entry-title a {
        color: #f00;
    }
    #content .entry-title a:hover {
        color: #fff;
    }
    .wf-active #content .entry-title {
        color: #f00;
    }
    #content .entry-title:hover {
        color: #fff;
    }
    
    /* This changes tags/categories to white */
    #content .entry-meta a {
        color: #fff;
    }
    
    /* Red border around main menu */
    .main-navigation {
        border: 1px solid red;
    }
    
    /* Increases font size of main menu */
    .main-navigation a {
        font-size: 14px;
    }

    The only thing I didn't address was your point number 6. The menu font color is already white, and if we change it to black on mouse-over, it'll be invisible because the background is also black.

    Go to Customize > CSS, remove everything from there and paste the above code. Let me know if any problems arise! :)

  10. ehtis - thank you so much for getting back to me when you could. i really appreciate it and you are amazing! All the codes came out just fine and the one you didn't address, is fine too. Am gonna stick to how it's looking now.

    I was wondering for the below (regarding the red border), can I get a code which instead of just a red border, it gives a red coloured highlighted border over the main menu?

    /* Red border around main menu */
    .main-navigation {
    border: 1px solid red;
    }

  11. Can you explain what you mean? Menu with a red highlight over it, like the following code?

    .main-navigation {
       background-color: red;
    }

    Or if something else, can you give an example or a pic.

  12. sszeemedia2015
    Member

    @ehtis THAT is EXACTLY what i was looking for! thank you thank you thank you so much! you guys are the best! really appreciate all your and timethief's help!

  13. @ehtis
    You rock!

  14. @sszeemedia2015, you're welcome! I wanted to confirm that first. Now that the background is red, if mouse pointer is moved over any menu item or you open a link, it'll become red, leaving it invisible against the background. To fix this, you can use this code:

    .main-navigation a:hover{
        color: black;
    }
    .main-navigation li.current-menu-item a {
        color: black;
    }

    @timethief, so do you! ;)

  15. @ehtis you are the loveliest person in the whole wide world hun! seriously i didn't wanna bug you about that after asking so much already. but you lovely, lovely person you! thank you so much for all your help!

  16. sszeemedia2015
    Member

    can i ask 2 more questions before I stop bugging you brain?

    1. Is it possible to make the slider automatic? right now one has to click next in order to go to the next article.

    2. Is it possible to change the width/height or general size of the slider?

    once again, thank you so much for all your help!

  17. Woah, thanks for the good words! Makes me extremely happy that I could be of help.

    1. I'm not sure if it can be done without JavaScript, which isn't allowed here. I'm guessing no, sadly!

    2. Yep, height/width can be changed, but it can cause images to appear awkward. You can try changing dimensions via this code:

    .flexslider .slides img {
        height: 220px;
        width: 990px;
    }
  18. @ehtis that is perfect! you are seriously the best! thank you so much hun for all your help. the new site looks exactly how i wanted it to and i couldn't have achieved that without your help. i really really appreciate it! i couldn't help but check out your site and saw you have some great write ups. if you ever wanna share something with us, you're always welcome to. thank you once again xx

  19. Thank you! Appreciate the compliments. :) It's good to see a site focusing on the subcontinent entertainment scene.

  20. sszeemedia2015
    Member

    Since my thread is still open, I was wondering:

    1. is it possible to change the fonts for the tags (tag letters) on individual posts? It's coming up pretty big

    2. And whether I could change the colour - currently it's white and when I put the mouse on it, it changes to red. I was wondering if i could do the the other way around? Red, put mouse, turns white

    Any help will be greatly appreciated.

    Many thanks xx

  21. For the font size, add this to your custom CSS and adjust as desired.

    #content .entry-meta a {
        color: #fff;
        font-size: 70%;
    }

    For #2, I answered you in the other thread you started on this at: https://en.forums.wordpress.com/topic/changing-font-for-tag?replies=2

Topic Closed

This topic has been closed to new replies.

About this Topic