Baskerville 2 By Anders Norén :Modifications of header, footer, sidebar, contents, customization and documentations

Theme baskerville documentation and modification

Baskerville 2 is a dynamic, grid-based theme for curators. It’s the perfect way to showcase your posts, videos, images and galleries, and share your favorite quotes and links.

Here i am sharing css code to style your Baskerville theme. To use my provided css  I prefer you use  Simple Custom Css plugins ( if you have your own domain and hosting) .

So You can use my shared code and ask question in the comments section.

Or can take my personal help.

Question 1 : How to change the black Navigation background to different color in Baskerville theme?

Answer: Use this  css code

.bg-dark {
background-color: darkred !important;
}

Question 2:  How to change Navigation menu font color, font size and font family?

.main-navigation li > a {
color: white !important;
font-size: .85em;
font-weight: 700;
text-transform: uppercase;
}

*** Currently, navigation menus in Baskerville theme shows capital letter. If you change the  “text-transform” value in css to this  “text-transform: normal;”   the menu items will be showing as Normal and not capitalize

To change the menu separator color use this css code

.main-navigation li::before {
color: white !important;

}

Question 3: How to change menu font color while hover in Baskerville theme?

.main-navigation li > a:hover {
color: yellow !important;
}

Question 4: How to change menu item background color while hover

.main-navigation li:hover {
background: darkred !important;
}

Question 5: How to change Social icons color?

.jetpack-social-navigation-svg .icon {
color: darkred;
}

also

How to change social icons hover background color?

.jetpack-social-navigation-svg .icon:hover {
color: white !important;
}

Question 6: How to change Site title’s font color, size and font family in Baskerville theme?

.site-title, .site-title a {
font-family: “Pacifico”, sans-serif;
font-size: 2.25em;
text-align: center;
color: darkred !important;
}

Also

How to change Site title’s hover color?

.site-title a:hover {
color: blue !important;
}

Question 7 : I don’t want to show post date, comments at the bottom of homepage posts grid

Answer: Try this code

.post-meta.clear {
display: none !important;
}

Question 8 : How to change the color, font size and font family of  front page post grid date, comments etc

.post-meta.clear * {
color: darkred !important;
}

Also, If you want to change the hover color  of the post date in Baskerville theme

.post-meta.clear :hover {
color: yellow !important;
}

Theme Baskerville footer credit section modification

Question 9: If you want to remove  Powered By WordPress and Theme  by Anders Noren in Baskerville theme

.credits-inner.section-inner {
display: none;
}

Or

If you want to make footer Credit Section  ( “Powered by WordPress” section)  background color changed

 .credits.section.bg-dark.small-padding {
background: transparent;
}

To change the Footer Credit section font color, font family and font size

 .credits.section.bg-dark.small-padding * {
color: darkred !important;
font-family: cursive;
font-size: 15px;
}

Question 10: How  to replace  “Powered by WordPress” and theme info in footer credit section with my own company info.

Answer:

1. At first go to  Appearance > Editor  section

2.  Now  in the right side you will see many file names… click on footer.php    (Please check the image attached)

 Footer Powered by WordPress replace by Copyright info

Question 11: How to change post and page title’s font color, font size and font family in Baskerville theme

 .post-header .post-title a, .post-header .post-title {
color: #2B3542 !important;
font-family: cursive !important;
font-size: 28px !important;
}

 Post and page title modification and gap reduce

Question 12: How to remove gap  just above and below the post and page title in Baskerville theme

.post-header {
padding-top: 12px !important;
padding-bottom: 12px !important;
}

Question 13: How to disable comments in posts, pages or from other post types in Baskerville theme

Answer: Use Disable Comments plugins  … this will help to remove comments form and comments not to show in pages, posts etc.

Change link color css

Question 14: If you want to change the link color from green to different one in Baskerville theme

Answer:

body a {
color: darkred !important;
text-decoration: none;
}
If you have any issue feel free to ask me question here in comments section

OR

Pay me some, I will help you for CSS Issue PersonallyCLICK HERE….

39 Responses to Baskerville 2 By Anders Norén :Modifications of header, footer, sidebar, contents, customization and documentations

  1. dandradiss says:

    Hi, do I need to have a premium account on WP in order to be able to access the css code area?

    Liked by 1 person

  2. dandradiss says:

    Thanks Om. Would this theme allow me to set up an image as a footer? I know the widget area has 3 columns, can I alter it with CSS? My image is 1200×300.

    Like

  3. dandradiss says:

    Hi Om, I have another question for you: The header on this theme is made to resize depending on the browser, is it possible to make it fix? I am having trouble with the way it looks on a pc
    thanks

    Like

  4. enriquetaregala says:

    Hello, I have a problem, I want the header imagen just white, but, when I up a white Image you see like gray color. Can you help me? Thanks

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: