• Hi

    I am a newbie to playing with CSS. I am guessing it is easy to change the colour scheme, can someone post some code that I could use and maybe explain what each of the elements does?

    thanks

    steven

Viewing 14 replies - 1 through 14 (of 14 total)
  • What theme are you using? Do you have a live site we can look at that is using the theme?

    I’m sorry but it is really beyond the scope of these forums to deal with general CSS issues. Try a dedicated CSS resource such as https://www.css-discuss.org/ instead. In the meantime, try using Firefox with the Firebug add-on for this kind of CSS work. Or use whatever developer tool is available in your web browser.
    https://getfirebug.com/

    Just change your hex codes. Any where you see something like #333 or #FFFFFF change it to the hex code for the color you want. Start at the top of the stylesheet and work towards the bottom.

    The users at https://www.codingforums.com will help you out if you post the css code in your question.

    I was a newbie like you a month ago. Here are snippets I’ve picked up over the last month that are specific to this theme. It may give you a springboard from which you can research bigger CSS questions elsewhere.

    /*
    Theme Name: customizr-child
    Template: customizr
    */
    
    @import url("../customizr/style.css");
    
    /* Get rid of menu border */
    .navbar .navbar-inner {
    -webkit-box-shadow: 0px 0px 0px;
    -moz-box-shadow: 0px 0px 0px;
    box-shadow: 0px 0px 0px;
    }
    
    /* Get rid of menu background */
    .navbar .navbar-inner {
    -webkit-box-shadow: 0px 0px 0px;
    -moz-box-shadow: 0px 0px 0px;
    box-shadow: 0px 0px 0px;
    background:none
    }
    
    /* Take bold of tagline in navbar */
    .navbar-wrapper .navbar h2 {
    font-weight: 400;
    /*font-size: 20px;*/
    }
    
    /* Play with carousel */
    
    /*make the nav drop down on hover*/
    ul.nav li.dropdown:hover > ul.dropdown-menu{
        display: block;
        margin: 0;
    }
    
    /* Change navbar padding: 2nd and 4th for horiz padding */
    /* and change font size in menu */
    .navbar .nav > li > a {
      padding: 5px 16px 5px 16px;
      font-size: 16px;
    }
    /* Change font size of first letters in menu */
    .navbar .nav > li > a:first-letter {
      font-size: 16px;
    }
    
    /* Get rid of post dates etc */
    body.single .entry-meta {
    display: none
    }
    
    /* Get rid of page icons */
    .format-icon:before {
    	speak: none;
      text-transform: none;
      -webkit-font-smoothing: antialiased;
      padding-right: 10px;
      opacity: 0.2;
      position: relative;
      top: 8px;
      display: none;
      font: normal normal 1.2em/1 'entypo';
    }
    
    /* Change icon on status
    article.format-status .format-icon:before {
      content: "\26A1"; */
    }
    
    /* Change page title text size */
    .entry-title {
    font-size: 30px;
    }
    
    /* Change h2 text size */
    h2 {
    font-size: 25px;
    }
    
    /* Change h3 text size */
    h3 {
    font-size: 18px;
    }
    
    /* make the fancybox arrows show, even when not hovering */
    #fancybox-left span {
    left: 20px;
    }
    
    #fancybox-right span {
    left: auto;
    right: 20px;
    }

    It took me a while to begin to understand how to use Firebug (Safari’s inspector is good too) and point to the elements I wanted to change. I still haven’t completely grasped it, but seeing code snippets from others on this specific theme’s layout helped.

    Good luck!

    p.s. On the colours: I’m presuming you’ve gone into Customize’it! and chosen the skin you want as a first step.

    Thread Starter stevenfeldman

    (@stevenfeldman)

    Thanks everyone for advice

    My site is at https://www.knowwhereconsulting.co.uk I am currently using the blue skin but would like to edit the Green scheme to be close to the green in my logo. Do i need to edit the green.css with changes or should I just paste the CSS for the colour sections into the custom CSS panel?

    You can paste into the custom css panel, unless there are special characters in there, which WordPress restricts (e.g., it doesn’t like > or <. If you need special characters, your next choice should be to create a child theme, rather than editing green.css.

    Theme Author presscustomizr

    (@nikeo)

    @electricfeet : thanks for those snippets, great job, it will surely be very useful for many people. You could maybe create a new specific topic for your snippets!
    Cheers,
    Nicolas

    Thanks. And welcome back! ??

    @stevenfeldman: I looked at your site. Personally, I like the green and blue thing you have going.

    @electricfeet: Thank you! You are a helpful person and it is appreciated.

    Thanks for the thanks! ??

    Hi Nicolas,

    @electricfeet : thanks for those snippets, great job, it will surely be very useful for many people. You could maybe create a new specific topic for your snippets!
    Cheers,
    Nicolas

    If you set up a FAQ area in the theme main page, or setup a FAQ on your site, you could add them there. As you may have seen, the moderators won’t allow me to add them here.

    tNcx ElectricFeet.. I want remove the border in cycle how can i reamove it

    if you’re using ggogle chrom, type F12, then in the new window, you’ll see a magnifyinf glass, to find out each element…

    tNcx ElectricFeet.. I want remove the border in cycle how can i reamove it

    Please start a new thread as your question is not at all related to this one (and make sure you explain what you mean by “border in cycle”).

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Can someone offer custom CSS to change theme colour’ is closed to new replies.