White background

Thanks for using Tracks!

The following CSS will change the background to white:

body,
.excerpt,
.main,
.menu-primary-items ul {
	background: white !important;
}
#site-header {
	background-color: white;
}
#menu-primary-items a,
#title-info a {
	color: #000;
}

You can copy and paste that code into the “Custom CSS” section in the Customizer (Appearance > Customize). Once added there, it should take affect right away.

Hi,

First of all, thank you for that great theme,it’s an amazing desktop for my blogging website, I love it !

I just tried to embed that code into custom CSS, to get a white background, but somehow it doesn’t work. I am a total beginner in this, so , sorry!

However, I was thinking to show you how I implemented the code into custom CSS, maybe you can tell me what’s wrong here…Once I did this, the website did not work all all….ooooopps….here’s the code: I placed it directly after custom css:

/***** Custom CSS *****/

body,
.excerpt,
.main,
.menu-primary-items ul {
background: white !important;
}
#site-header {
background-color: white;
}
#menu-primary-items a,
#title-info a {
color: #000;
}
// section
$wp_customize->add_section( ‘ct-custom-css’, array(
‘title’ => __( ‘Custom CSS’, ‘tracks’ ),
‘priority’ => 80,
‘capability’ => ‘edit_theme_options’
) );

// setting
$wp_customize->add_setting( ‘ct_tracks_custom_css_setting’, array(
‘type’ => ‘theme_mod’,
‘capability’ => ‘edit_theme_options’,
‘sanitize_callback’ => ‘wp_filter_nohtml_kses’,
) );
// control
$wp_customize->add_control( new ct_tracks_Textarea_Control(
$wp_customize, ‘ct_tracks_custom_css_setting’, array(
‘label’ => __( ‘Add Custom CSS Here:’, ‘tracks’ ),
‘section’ => ‘ct-custom-css’,
‘settings’ => ‘ct_tracks_custom_css_setting’,
)
) );

Thanks glad you like it!

By the “Custom CSS” section in the Customizer, I mean this section here: https://pics.competethemes.com/image/3e401H383B1h

Thank you so much, sometimes it’s much easier then it seems (-:

However, what happens when I embed this code, everything becomes white, also the “normaly” light grey article boxes (next to the articles head image). Is it possible to leave these article boxes light grey (as they are on the black webiste option)? Also when you scroll over them, It would be great if they don’t become white (as the framing of the box becomes lost with the white background), could it be another gray tone for this?

Kind regards, Martin

Sure, try replacing your existing code with the following:

body,
.main,
.excerpt,
.menu-primary-items ul {
  background: white !important;
}
.excerpt-container {
  background: #e5e5e5 !important;
}
#site-header {
  background-color: white;
}
#menu-primary-items a,
#title-info a {
  color: #000;
}

That should give the Post boxes on the front page a light gray background instead of white.

Wow, this looks exactly how I want it. Thank you very much! The only thing…the subtitle of the main page and also the “Naming” of the pages disappear as well…
on my website (www.ma-san.de) the sentence “Ein Blog über Reisen, L?nder, Bücher und vieles mehr – meine Gedanken über diese Welt” and also the Page naming “über mich” are not visible in the white version. Is their a way to keep their color the same then the Title, in this case “Ma San Blog” ?

Yea try adding the following CSS too:

.site-description,
.entry-title,
.entry-title a {
  color: #000 !important;
}

Thank you !!!!

You’re welcome ??

Hi there,
Thank you for a great theme!

I just followed the above instruction for making the background white. It looks great except that the footer is black! Can I change the footer to white too? If yes – do I paste the code right after the code for making the background white (Appearance > Customize > “Custom CSS”)?

Thanks in advance!

Friis-Holst

Yes, exactly. You can copy and paste this right below the other code in the Custom CSS section to make the footer white too:

.site-footer,
.sidebar-footer,
.design-credit {
  background: white;
}

Hey,

I implemented the following three codes from above into my css:

body,
.main,
.excerpt,
.menu-primary-items ul {
background: white !important;
}
.excerpt-container {
background: #e5e5e5 !important;
}
#site-header {
background-color: white;
}
#menu-primary-items a,
#title-info a {
color: #000;
}

.site-description,
.entry-title,
.entry-title a {
color: #000 !important;
}

.site-footer,
.sidebar-footer,
.design-credit {
background: white;
}

There are two things now:

– The pages, for example “about me” does not Show up as it is probably White as well (https://www.ma-san.de/)

– the Header is still black

I would be very grateful if you could provide a sulution for this.

Kind regards from Berlin, Martin

You can setup the primary menu via the Menus panel in your admin, or add the following CSS to make the menu links black instead of white:

.menu-primary a {
  color: #000 !important;
}

As for the section at the top of the site with the social icons and search bar, you can add this to make the background white and those icons black:

.social-media-icons a,
.site-header .search-form-container i {
  color: #000 !important;
}
.top-navigation {
  background: #fff !important;
}