Have you seen Elementor?

Our flagship product, Layers has been acquired by the team at Elementor.

With a powerful, fast page builder, Elementor is the best way to get your site online with as little effort as possible.

Handmade: How to Customize Colors

Because Handmade was created before WordPress implemented the Customizer, it does not have any color customization options. It is also a graphically designed theme rather than a flat or CSS-only theme, therefore re-styling it takes advanced customization. The following template can assist you in customizing basic aspects such as colors, font styles or borders. For advanced restyling such as graphic/background fill replacement, changes in the layout or adding elements, please refer to this article.

Note about Fonts

Note that most font elements can be customized using Theme Options  Typography.  See the Typography article for more information.

Using these codes

Copy the code for the element you want to customize and paste it into Theme Options in the Custom CSS box, then edit the style information with your desired attributes such as font pixel size, font name, color code, etc.

Change the Background

Upload your own background image under Appearance  Background

Main Menu Link Color

ul#nav li a{color: #437C9A;}
ul#nav li a:hover{color: #000000;}

Title Color in Feature Post Gallery Widget

.feature-post .post-title, .feature-post .post-title a {color: #3C3C19;}
.feature-post .post-title a:hover {color: #71ACAC;}
.feature-post li{background-color: #FFFFFF;}

Widget Titles

Affects home page and sidebar

.widgettitle, .widgettitle a {color: #434318;}

Dates & Post Meta

Post meta includes the date, author text and category text.

h5.date {
color: #C78809;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
}

Dates & Post Meta links

h5.date a{color: #71ACAC;}

Big Post Titles Color

.post-title, .post-title a, .comments .section-title, #respond h3 {color: #345E6A;}
.post-title a:hover {color: #000000;}

Content Widget Post Title Size

.content-widget .post-title{font-size: 24px;}

Content Widget Image Background

.content-widget .post-image, .page-widget .post-image{background: #FFFFFF;}

Blog and Post Title Size

.post .post-title, .comments .section-title, #respond h3{font-size: 38px;}

Post Image Background Color

.post .post-image{background: #FFFFFF;}

General links

Affects the color of links in your content that are not specifically colored by a different style.

a {color: #71ACAC;}
a:hover{color: #000000;}

General Text

Affects most body text in your content that is not specifically colored by a different style or by you in the post editor.

body{color: #777777; }

Next & Previous Post Links

.next-prev-post-nav a {
color: #345E6A;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
}

Form Labels

label {color: #345E6A;}

Buttons

input[type="button"], input[type="submit"] {
background: #FECD25;
color: #FFFFFF;
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
}

Remove Thumbnail Slider Widget background

.latest-videos{background: none; box-shadow: 0px;}

Footer Background Color

#footer-container {background: #345E6A;}

Footer Widget Title Colors

#footer h4{color: #FFFFFF;}

Footer Widget Text Color

Note that some widgets will ignore this, such as Facebook or Twitter widgets or any widget pulling in 3rd party content.

#footer ul li.column{color: #9AAFB5;}

Footer Text in Copyright area

.footer-text {
color: #9AAFB5;
font-size: 11px;
}

Is an element you want to change not listed here? You can probably find it by using your Browser Inspector.

 


WooCommerce