Topic Resolution: Resolved
  • Closed
  • D
    Spectator
    July 29, 2015 at 12:45 am #19306

    How can I fully customize the widget header with color or an image?

    So far, I have found only one option to do so, and it makes the color a dark gray maybe even black. I would like to use different colors or even upload an image. How can this be done?

    Thank you in advance for the reply.

    Imran
    Spectator
    Posts: 402
    July 30, 2015 at 5:08 pm #19396

    Hi Donna,

    Upon checking, it seems to be working fine at my end (see: http://prntscr.com/7yuk2p). However you can try this following code if that works:

    .widget-title-background {
    width: 108.5% !important;
    position: relative !important;
    right: 14px !important;
    min-height: 46px !important;
    }

    In regard to, change the background specifically to a particular widget, in such case you can let us know about the related widget and we’ll provide you the code. For widget background color change, you can use the following code into your custom CSS:

    .widget-content {
    background: #ffffff;
    }

    Thanks.

    D
    Spectator
    Posts: 40
    July 30, 2015 at 8:16 pm #19416

    Hello again Imran,

    Thanks for all your help. I was able to resolve the border-radius and the coloring of the widget-content area, but still having problems with the widget header background color area.

    It should be the same code as it is a WP install and then the Evolve theme. Hope we manage to resolve it soon. It seems to work on the main site.

    By the way, the widget that I would like to use a custom color for the content background will be called Pastors’ Corner. Is it also possible to use an image for the widget content background?

    Regards.

    Denzel Chia
    Moderator
    Posts: 2656
    July 31, 2015 at 6:42 am #19421

    Hi,

    I see that you have a cache plugin for this domain http://menofpurpose.fogwm.org/
    you need to clear the cache after you update your Custom CSS.

    And also check that the Theme Option settings for all your domains regarding Widgets are similar. Check your Theme Options -> Styling -> Enable Widget Title Black Background and Theme Options -> Styling ->Disable Widget Background. Make sure sub domain settings are same as main domain.

    Sort out one issue first, before proceeding to another issue, or things can complicated.

    Thanks!
    Denzel

    D
    Spectator
    Posts: 40
    July 31, 2015 at 2:45 pm #19442

    Hi Denzel,

    That was the issue. That was my last resort to double-check that. So glad you mentioned it as it confirmed that it could have been the issue. Widget Title Background issue now resolved.

    Thanks!

    D
    Spectator
    Posts: 40
    August 1, 2015 at 3:50 am #19457

    Back again guys. You have been very helpful. Makes me feel that I made the right decision in purchasing your theme.

    The initial issue and a few others have been resolved. What I would like to do now is to have the widget title background colour for the widgets in the Footer different from the rest of the site…but all the same colour though.

    Thanks in advance.

    Denzel Chia
    Moderator
    Posts: 2656
    August 1, 2015 at 7:34 am #19460

    Hi,

    For this site http://menofpurpose.fogwm.org/

    Please use the following in Theme Options -> Custom CSS

    .container-footer .widget-title-background {
    background: #000 none repeat scroll 0 0 !important;
    }

    The word .container-footer will target only widgets in footer.
    The #000 color code is black, you can change to the color that you need.

    Thanks!

    D
    Spectator
    Posts: 40
    August 1, 2015 at 10:01 am #19463

    Hi Denzel,

    Tried it. Worked fine. Should have asked this at the same time, but I would also need to customize the widget outline colour. This is what I use now. I need to modify it so I an change the outline for the Footer widget.

    .widget-content {
    margin:0 0 25px;
    overflow:hidden;
    padding:0 15px 20px 15px;
    border:1px solid #afcde3;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    }
    .widget-title {
    padding-top:20px;
    }
    .widget-title-background {
    -webkit-border-radius: 20px 20px 0 0;
    border-radius: 10px 10px 0 0;
    margin-top:11px;
    }

    Thanks.

    Denzel Chia
    Moderator
    Posts: 2656
    August 2, 2015 at 5:02 am #19477

    Hi,

    Please add the following to the end of your Custom CSS, you can change the #000 to other color code.

    .container-footer .widget-content {
    border: 2px solid #000 !important;
    }

    Thanks!

    D
    Spectator
    Posts: 40
    August 2, 2015 at 10:44 am #19482

    Once again Denzel, all is well. Worked perfectly!!!

    Would like to know how I can customize the 3 tabs with colour and outline: Popular, Recent and Comments. Also would like colouring options for the alternating shades of colour behind the post header and date given. Seems as though the selected tab and the first row is the same colour which is fine.

    fogwm.org

    Love your product and service. Those two make for a satisfied and happy customer.

    D
    Spectator
    Posts: 40
    August 2, 2015 at 11:34 am #19486

    This might be my last question in this category Denzel.

    I’d like to customize two widgets where I can change the:

    Widget header text

    Widget header colour

    Widget container outline colour

    Widget content background colour

    Those widgets are the two at the top of the Homepage on the left: fogwm.org

    Is there a way to use an image for the widget header background?

    Thanks in advance.

Viewing 10 replies - 11 through 20 (of 22 total)