WordPress.org

Ready to get started?Download WordPress

Forums

Customize color in Andrina-lite (23 posts)

  1. greggneck
    Member
    Posted 1 year ago #

    How to I change the color of the footer? (The area where it has e-mail, hours, and phone number) The default is green, and does not match the website.

  2. jamesg40
    Member
    Posted 1 year ago #

    Open up your themes style.css with a text editor or simply go to the editor in your dashboard and open the style.css and edit this style. Simply change the background color to whatever you like. Example, if you want light to medium grey instead of green simply change the hex value at the end of the background: to something like #333333 and then the green will turn to a medium grey.

    Here is what you have now

    .index-info {
        background: url("images/green-sep.png") repeat-x scroll 0 0 #71963C;
        border-bottom: 1px solid #47621F;
        margin-bottom: 0;
        overflow: hidden;
        padding-bottom: 0;
        padding-top: 8px;
    }

    and here is what would change if you wanted the medium grey

    .index-info {
        background: url("images/green-sep.png") repeat-x scroll 0 0 #333333;
        border-bottom: 1px solid #47621F;
        margin-bottom: 0;
        overflow: hidden;
        padding-bottom: 0;
        padding-top: 8px;
    }

    if you don t know your hex values for colors thats ok too. Simply go to this site and get your value here. http://www.colorpicker.com/

    Also note that the border color can be changed the same way, see the border-bottom:1pxect,ect... just change the 47621f to whatever color hex you like and then save it all and wah-lah, you now have new colors.

  3. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Do not make any of the above changes in your theme files directly. Your changes will be erased when the theme is updated. Instead use a child theme: http://codex.wordpress.org/Child_Themes

    Or a custom CSS plugin such as jetpack.

  4. jamesg40
    Member
    Posted 1 year ago #

    As per WPYogis suggestion and if your really worried about theme updates, simply do this instead.

    create a style.css

    then in the top of your style.css add this to start

    /*
    Theme Name:     Andrina-lite Child
    Theme URI:      http://example.com/
    Description:    Child theme for the Andrina-lite theme
    Author:         Your name here
    Author URI:     http://example.com/about/
    Template:       Andrina-lite
    Version:        0.1.0
    */
    
    @import url("../andrina-lite/style.css");
    
    .index-info {
        background: url("images/green-sep.png") repeat-x scroll 0 0 #71963C; <!--change the hex value to what you like here -->
        border-bottom: 1px solid #47621F;<!--change the hex value to what you like here -->
    }

    Then put that in a folder called Andrina-lite-child and upload it your themes directory. Once its uploaded simply go to your themes panel in admin dashboard and select your new theme child and the changes will be made.

  5. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    @james - you are missing the @import line.

  6. jamesg40
    Member
    Posted 1 year ago #

    Yes, you are most definitely correct there Yogi. So I went ahead and included a small tut for him above. For me and my circle of friends though, we just don't worry about children and just kind of do our own thing. I guess our knowledge can become other peoples headaches if they don't have the skill to back it, lol. Sorry Yogi, I will be careful to make sure to give child suggestions for these types of questions in the future. Thanks!

  7. jamesg40
    Member
    Posted 1 year ago #

    Opps, got it in there now, Sorry bout that just typed it out so fast and forgot to add it. Im not perfect, lol. Thanks for that Yogi~!

  8. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Excellent - it's really just that it's really unfortunate when people lose a lot of work and then tell us that someone here told them to do it that way. So we try to help them avoid doing things that can create problems later... You give lots of good help - and that's certainly appreciated, so yeah, just add that tiny piece :) .

  9. jamesg40
    Member
    Posted 1 year ago #

    Thanks Yogi :) . No worries.

  10. greggneck
    Member
    Posted 1 year ago #

    How do I create a style.css? I see in editor there is a style.css, but I do not see any place to create? But then you said to add it to the style.css and then save to theme directory? Sorry---I am confused, and I'm sure it has nothing to do with how you are explaining it. I am a beginner, and trying to fudge my way through this with as little errors ans possible.Thanks so much for your help!

  11. esmi
    Forum Moderator
    Posted 1 year ago #

    @greggneck: It is impolite to interrupt another poster's ongoing thread with a question of your own. It causes significant problems for the forum's volunteers and prevents us from being able to track issues by topic. Please post your own topic.

  12. greggneck
    Member
    Posted 1 year ago #

    @esmi
    this is my thread

  13. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Gregg - sorry this got so off-track. You need to start by installing jetpack or another custom CSS plug-in so that you can make changes without losing them when the theme is updated. Then put this code in the custom CSS box:

    .index-info {
        background: url("images/green-sep.png") repeat-x scroll 0 0 #71963C; <!--change the hex value to what you like here -->
        border-bottom: 1px solid #47621F;<!--change the hex value to what you like here -->
    }
  14. jamesg40
    Member
    Posted 1 year ago #

    @esmi , lol he created this thread, lol.

    @greggneck:

    ok, your going to want to create a child theme to be able to change your colors and maintain up-date-ability for your theme. Its very easy to do, I will walk you through it.

    first right click on your desktop (on your computer) and select new folder. Name the folder "andrina-lite-child" and then open it up.

    inside the new folder right click once more and select new text document and name it style.css and save that. Once you have the style.css created, simply paste the following code into it. Here goes.

    /*
    Theme Name:     Andrina-lite Child
    Theme URI:      http://example.com/
    Description:    Child theme for the Andrina-lite theme
    Author:         Your name here
    Author URI:     http://example.com/about/
    Template:       Andrina-lite
    Version:        0.1.0
    */
    
    @import url("../andrina-lite/style.css");
    
    .index-info {
        background: url("images/green-sep.png") repeat-x scroll 0 0 #71963C;
        border-bottom: 1px solid #47621F;
    }

    Change the hex values above to the color you like and add the author name and uri's if you like. Now save that file and close it.
    Now you can simply take this folder and upload it to your themes directory. You must keep the Andriana-lite theme in there as this child theme will be riding on the back of its parent theme (Andrina-lite).
    Now once you have it in your theme directory, simply log into your admin panel and go to themes and activate the child theme. When you wish to change the color for the footer item again, simply open the style.css in your new child theme and change the hex values. I think i posted a link to a color picker that will give you the hex value you need by simply dragging the little slider thingy around. I hope this helps, if not let me know and I will just make you one and send it to you, lol.

  15. jamesg40
    Member
    Posted 1 year ago #

    PS if your text editor does not save the file as .css (like maybe it saves it like this "style.css.txt" then you may need to download notepad++ and open the new style.css and re-save it as a css file. Sometimes they work for me but I have to use NP++ to make them save properly sometimes. I normally just use NP++ for everything anyway, with the cool plugins you can get for it, it makes coding a dream and always saves files in the right format, lol.

  16. jamesg40
    Member
    Posted 1 year ago #

    I didnt see Yogis post when I wrote that last 2. I dont have experience with Jetpack or any other custom css plugin but that is probably the better way to go if your not comfortable with writing code. Thanks for the Tip Yogi!. :)

  17. greggneck
    Member
    Posted 1 year ago #

    @WPyogi
    I downloaded jetpack, went down to were it says Custom CSS. Clicked learn more. Then clicked edit CSS. It opens up a page that says "You do not have sufficient permissions to access this page." Now what am I doing wrong??

  18. levonbosco
    Member
    Posted 1 year ago #

    new user, first post. Thank you to all that provide such valuable information.

    Sorry to derail the original intent of the post, but I am wondering where in the .css editor can I change the color of the Title on each of my pages? Currently my wordpress page is showing that hideous green color for the title of all of the pages I create. Any assistance would be greatly appreciated.

    Thanks.

  19. SandyMcDonald
    Member
    Posted 1 year ago #

    If you go to Andrina Lite Theme Options > Styling Options, you will be able to put your custom css code there by the way. Whatever you put here will be maintained when you do a theme update.

  20. komileswarry
    Member
    Posted 10 months ago #

    Hi..can you please help me on how to add more images in Top Feature Image(slider) in Andrina Lite theme. When I go to the homepage settings, I can only add one slider image to the Top Feature Image, whereas it shows 'Choose your image for first slider'. it means I can add more images is it ? But where can I find it ?

    Thanks

  21. Akeepen
    Member
    Posted 10 months ago #

    Hi, Can anyone help me on how to replace the slider image into wowslider in Andrina Lite free version template? The free version don't provide us to add more than one image into the slider. So, there is no option for me to add more images. Can anyone help me ?

  22. Andrew
    Forum Moderator
    Posted 10 months ago #

    Try posting in Andrina Lite's forums: http://wordpress.org/support/theme/andrina-lite#postform

  23. Akeepen
    Member
    Posted 10 months ago #

    Ok. Thanks

Topic Closed

This topic has been closed to new replies.

About this Topic