Please help with basic CSS problems :)

  • Author
    Posts
  • #2700687

    imogenadmin
    Member

    Hello there :)

    I’m about to upgrade my plan to premium but wanted to ask a few questions here first (I’m completely new to CSS) about the Sketch theme.

    There’s some things I can’t get my head around:

    1. How to remove the header/title fonts uppercase attribute and just make it bold instead. Then change the colour to: #02c4b9?
    2. Change the colour on the upper right menu fonts from grey to #ce528e. When you have premium can you change this with the customisation toolbar instead?
    3. Change Page Title’s (like ‘Home’) font colours to: #f4989d?

    I’ve been really struggling so far and would greatly appreciate any help.

    Have a nice evening! :) Imogen

    The blog I need help with is imogenillustrates.com.

    #2700720

    hallluke
    Member

    Hi, you can try out these changes before you upgrade by copying the code below into the CSS section of your customiser:

    h1 {
      text-transform: capitalize;
    }
    .wf-active .site-title a {
      font-weight: bold;
      color: #02c4b9
    }
    .main-navigation a {
      color: #ce528e;
    }
    h1.entry-title {
      color: #f4989d;
    }

    The first rule will set all your h1 headings to capitalised and the other three set the colours you wanted. Let me know if you have any other questions.

    #2700721

    imogenadmin
    Member

    Hi hallluke,

    Thank you very much, this is a big help!

    Forgot to add one more thing to the previous post… the credits in the footer, is there a way to remove or even change the font colour to white so that it’s less obvious? The business plan needed to remove this is out of my budget unfortunately. Plus if there is a way to add in ‘All images copyright © Imogen Wharmby 2016’?

    Imogen

    #2700722

    hallluke
    Member

    Hi Imogen,

    That’s OK, you have to leave the footer bit intact as part of the terms of service although you do have a few more customisation options that were introduced a couple of weeks ago. Try setting it to just the WordPress logo for a minimal look.

    Here’s some suggested CSS to style the rest of it that won’t fall foul of the TOS:

    .site-info {
      max-width: 100%;
      float: unset;
      text-align: center;
      font-size: 0.8462em;
    }
    .site-footer .sep {
      display: none;
    }
    .site-info::after {
      content: "All images copyright © Imogen Wharmby 2016";
    }
    .site-footer,
    .site-footer a {
      color: #aaa;
    }
    .site-footer a:hover {
      color: #777;
      text-decoration: underline;
    }

The topic ‘Please help with basic CSS problems :)’ is closed to new replies.