• I need to change the color of the widget heading in the footer of my website. It’s currently the same color as the background and so doesn’t show up. I’m using the Galleria Metropolia theme and a lot of custom css code hasn’t seemed to make any difference. I want the text to be white.

    • This topic was modified 4 years, 3 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hi!
    You can try this CSS code:

    
    #bottom h3.widgettitle {
    color: #fff!important;
    }
    

    or

    
    .cmsmasters_color_scheme_first h3.widgettitle {
    color: #fff!important;
    }
    

    Hope this helps ??

    Thread Starter artvisor

    (@artvisor)

    Thank you for helping! Neither seemed to work though, I just plugged them into the custom css section. Is there somewhere else I should be putting the code? Thank you!!

    Moderator bcworkz

    (@bcworkz)

    That’s the right place, but it looks like you added the rules within a media query for iPhones. The added rules need to be below the final } of the media query so they are applied in all cases. Corrected CSS at the end of the Additional CSS customizer panel:

    /*Iphone 11 */
    
    @media only screen and (min-width : 414px) 
    	and (max-width: 896px) {
    
    /* more rules clipped for brevity, they must remain in place */
    
    	.cmsmasters_heading
    		{
    			font-size:14px !important; 
    			line-height: 1.5em !important;
    		}
    			#slide-66-layer-9
    		{
    				line-height: 1.5em !important;
    		}
    
    }  /* <-- closes iPhone media query */
    
    /* .cmsmasters_color_scheme_first h3.widgettitle {
    color: #fff!important;
    } */
    		
    #bottom h3.widgettitle {
    color: #fff!important;
    }

    I made one of the rules into a comment since you only need one or the other. Uncomment and remove the other if it doesn’t work this way.

    Thread Starter artvisor

    (@artvisor)

    It worked! Thank you so much for your help – you’re a lifesaver!

    Thread Starter artvisor

    (@artvisor)

    Ok so, it did work, but then when I saved it the color change didn’t show up on the home page and stopped showing up in the theme editor. I don’t know why it would do this though. Sorry for all the confusion and thank you so much for your help!

    Moderator bcworkz

    (@bcworkz)

    The CSS syntax is still not right, you’ve misinterpreted my instructions. In an attempt to be clear, I actually muddled things even worse. Lets try it this way. Remove the following from the end of the Additional CSS panel content:

    .cmsmasters_color_scheme_first h3.widgettitle {
    color: #fff!important;
    }
    		
    #bottom h3.widgettitle {
    color: #fff!important;
    } 
    }
    
    /*Iphone 11 */
    
    @media only screen and (min-width : 414px) 
    	and (max-width: 896px) {
    
    /* more rules clipped for brevity, they must remain in place */
    
    	.cmsmasters_heading
    		{
    			font-size:14px !important; 
    			line-height: 1.5em !important;
    		}
    			#slide-66-layer-9
    		{
    				line-height: 1.5em !important;
    		}
    
    }

    then add this back in to the end of what’s left:

    }
    #bottom h3.widgettitle {
        color: #fff!important;
    }
    Thread Starter artvisor

    (@artvisor)

    Ah makes sense. Sorry for the confusion and thank you so much for your help! It worked!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Fixing the text color of widget in footer of page’ is closed to new replies.