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

Radcliffe 2 By Anders NorénAnders Norén is the creator of Baskerville 2 and Radcliffe 2 wordpress theme. Radcliffe 2 is a theme for bloggers who want their content to take center stage. It comes free with wordpress.com. Though I am sharing you the zip of  Radcliffe 2 theme along with child theme which you can download from here and also I am sharing  here some CSS customization using which you can use to make your site beautiful or to give some extra touch of your wish.

Download Radcliffe 2 By Anders Norén Main / Parent theme

Download Radcliffe 2 By Anders Norén Child theme

Or can take my personal help.

 

Question 1: How to change the font size and font family of the contact info showing at the top  of Radcliffe 2 theme

Answer : Try the following code

.contact-info-area {
font-size: 18px !important;
font-family: cursive;
}

Radcliffe 2 top contact info section font, color, hover modification

 

Question 2: How to change the hover font color of top contact info links in Radcliffe 2 theme

.contact-info-area a:hover {
color: blue !important;
}

Question 3: How to change the color of Location, phone, email and Hours icons color in Radcliffe 2 theme

.contact-info-area .icon {
height: 2em !important;
width: 2em !important;
fill: blue !important;
}

 

Question 4: How to change site title’s font color, font size and font family Radcliffe 2 theme

.site-title a {
color: blue !important;
font-family: cursive;
font-size: 5rem !important;
}

Also to change site title’s hover font color, try this code

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

Site title color, font family, font size or remove css customization

Question 5 : How to remove the site title from Radcliffe 2 theme

.site-branding-text {
display: none !important;
}

 

Question 6 : How to change the social icons color, hover color and size ( showing right side of top menu)

.site-header .jetpack-social-navigation-svg .icon {
height: 29px;
color: red !IMPORTANT;
width: 28px;
}

Also, if you want to change hover color of the social icons

.site-header .jetpack-social-navigation-svg .icon:hover {
color: blue !important;
}

Question 7 : How to change focused/selected menu background color and border radius in Radcliffe 2 theme

.main-navigation li:hover > a, .main-navigation li.focus > a, .main-navigation li.current-menu-item > a {
background: red !important;
border-radius: 3px;
}

Question 8: How to change the Navigation menu and sub menu font size and font family

.main-navigation a {
font-size: 16px !important;
text-transform: uppercase;
font-family: cursive !important;
}

Homepage spacing reduce

 

Question 9 : How to reduce space below the featured prompt  or between  featured prompt and  Welcome section in homepage

.home header.entry-header {
padding-top: 6px !important;
padding-bottom: 6px !important;
}

*** If you don’t want to show the Welcome Header in the homepage try this code

.home header.entry-header {
display: none !important;
}

Homepage content section width increase

 

Question 10 : How to change  or increase homepage  Welcome  content section width 

.home .entry-content {
width: 90% !important;
}

Question 11: How to change home page featured prompt section button background color and text color

.hero-area .button {
background: red !important;
color: white !important;
}

Question 12: How to change homepage featured prompt button hover background and font color change

.hero-area .button:hover {
background: green !important;
color: white !important;
opacity: 1 !important;
}

radcliffe theme featured prompt section modification

Question 13:  How to change Homepage featured prompt section title’s font color, size and font family in Radcliffe 2 theme

.hero-area-title {
font-size: 40px;
color: red !important;
font-family: cursive !important;
}

Question 14: How to change Homepage Featured prompt content’s font color, size and font family

.hero-area-content {
font-size: 18px;
color: red !important;
font-family: cursive;
}

 

/**************** Page and Post **************** /

Question 15:  How to change single post content section width

.single-post .entry-content, .single-post .entry-footer {

width: 90% !important;
}

single post and page modification

Question 16:  How to remove or  if you don’t want to show page title in individual pages?

.page-template-default .entry-header {
display: none !important;
}

Also

In the same way, if you want to remove post title in single post page

.single .entry-header {
display: none !important;
}

 
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 Personally CLICK HERE….

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

  1. nealumphred says:

    OM

    Here are my questions for the Radcliffe 2 theme.

    HOME PAGE

    1. How do I increase/decrease the space above the site title in the header?

    2.How do I center the Main Menu in the header?

    3. How do I put a horizontal bar as a background behind the Main Menu in the header?

    4. How do I increase/decrease font in the sentence at the top of the page where the address normally goes?

    5. How do I control the font, size, and color of the tagline?

    6. How do I make the featured images on the homepage smaller and separate from another so that the background shows on all four sides of the image?

    7. How do I get rid of the “Featured” notice above INTRODUCTION?

    8. How do I find my social icons?

    9. How do I control size, colors, and fonts of bottom bar (“Proudly Powered”) below the footer?

    INDIVIDUAL POSTS & PAGES

    10. How do I remove the entire header from the post/page and have the featured image fill the top of the page?

    11. How do I increase/decrease the size of the post/page titles?

    12. How do I control the field of color behind the text?

    13. How do I add an EDIT button to each post/page that allows me to enter the post/page from there and make changes?

    14. How do I add a title for Categories and Tags in the lower right below the text?

    15. How do I change “Published by Neal Umphred” to “Author’s Bio”?

    16. How do I add space between the author bio and “View all posts by” below the text?

    17. How do I control the font for “Leave a Reply.”

    18. How do I control the field of color behind the comment box?

    Thanks in advance for your assistance!

    NEAL UMPHRED

    Like

    • Neal,
      your site is showing maintenance mood
      would you mind to make your site live please?
      Om

      Like

    • 1. How do I increase/decrease the space above the site title in the header?

      .header-wrapper {
      padding-top: 20px !important;
      padding-bottom: 20px !important;
      }

      2.How do I center the Main Menu in the header?

      @media screen and (min-width: 1200px){
      .menu-wrapper {
      max-width: 53.8% !important;
      }

      }

      3. How do I put a horizontal bar as a background behind the Main Menu in the header?

      .menu-wrapper {
      background: darkred;
      }

      *** if it is background color you mean, then you may need to change font color too. In such case try this code
      .menu-wrapper a {
      color: white !important;
      }

      4. How do I increase/decrease font in the sentence at the top of the page where the address normally goes?
      .contact-info-address {
      font-size: 18px !important;
      }

      5. How do I control the font, size, and color of the tagline?
      .site-description {
      font-size: 14px !important;
      color: white !important;
      font-family: cursive;
      }

      6. How do I make the featured images on the homepage smaller and separate from another so that the background shows on all four sides of the image?

      .entry-thumbnail {

      margin-bottom: 38px;
      max-height: 550px;
      padding-top: 20px !important;
      background-attachment: fixed;
      }

      Note: background-attachment: fixed; will give the image another look

      7. How do I get rid of the “Featured” notice above INTRODUCTION?

      .entry-meta {
      display: none !important;
      }

      8. How do I find my social icons?

      *** i need to check the dashboard

      9. How do I control size, colors, and fonts of bottom bar (“Proudly Powered”) below the footer?

      .site-info, .site-info * {
      color: white !important;
      font-size: 18px !important;
      font-family: cursive !important;
      }

      INDIVIDUAL POSTS & PAGES

      10. How do I remove the entire header from the post/page and have the featured image fill the top of the page?

      .single #masthead {
      display: none !important;
      }

      11. How do I increase/decrease the size of the post/page titles?

      h2.entry-title, h2.entry-title a {
      font-size: 34px !important;
      }

      12. How do I control the field of color behind the text?

      .archive .entry-header, .blog .entry-header, .search-results .entry-header {
      background: red !important;
      }

      13. How do I add an EDIT button to each post/page that allows me to enter the post/page from there and make changes?
      ** in wordpress.com not possible ( in logged in view you should see a edit link)

      14. How do I add a title for Categories and Tags in the lower right below the text?

      ** in wordpress.com not possible

      15. How do I change “Published by Neal Umphred” to “Author’s Bio”?

      ** in wordpress.com not possible

      16. How do I add space between the author bio and “View all posts by” below the text?

      17. How do I control the font for “Leave a Reply.”

      #reply-title {
      font-size: 24px !important;
      color: darkred;
      font-family: cursive;
      }

      18. How do I control the field of color behind the comment box?

      .comments-area, .respond {
      background-color: red !important;
      }

      Like

  2. nealumphred says:

    Wow! I will start testing them now …

    Like

  3. nealumphred says:

    WOW!

    Most of the code worked and my site looks soooooo much better!!

    THANKS!!!

    Like

  4. nealumphred says:

    OM

    Here are specifics about a few of the few codes …

    HOMEPAGE

    2.How do I center the Main Menu in the header?

    The code you gave me did NOT center the items in the Main Menu when looking at my site on a large screen.

    Not a problem as I decided to add two more links so it looks centered anyway.

    4. How do I increase/decrease font in the sentence at the top of the page where the address normally goes?

    How do I remove the hyperlink attached to this sentence?

    6. How do I make the featured images on the homepage smaller and separate from another so that the background shows on all four sides of the image?

    Thanks! I like the background fixed—very cool feel.

    How do I reduce the width of these images so that the color of the background can be seen on both side?

    INDIVIDUAL POSTS & PAGES

    10. How do I remove the entire header from the post/page and have the featured image fill the top of the page?

    How do I include a menu bar at the top of the posts/pages?

    11. How do I increase/decrease the size of the post/page titles?

    This did not work.

    Please go to this page:
    http://www.nealumphred.com/wp-admin/customize.php?autofocus%5Bsection%5D=custom_css&return=http%3A%2F%2Fwww.nealumphred.com%2Fwp-admin%2F&customize_changeset_uuid=&changeset_uuid=855b6c6b-2459-48d7-9c33-26598347dcf9

    I want to reduce the title “anonymity empowers cowards to become bullies” and all other post titles.

    12. How do I control the field of color behind the text?

    How do I control the color of the field behind the text that begins “I HAVE WRITTEN ABOUT BULLIES.”

    17. How do I control the font for “Leave a Reply.”

    This worked, but now how do I change Leave a Reply” to something else?

    Keep on keepin’ on,

    NEAL

    Like

    • Hi Neal,
      regarding menu issue please try this
      @media screen and (min-width: 1200px){
      .menu-wrapper {

      max-width: 763px;
      }}

      4. Regarding address link issue
      Answer : I need to check the dashboard for this

      6. How do I reduce the width of these images so that the color of the background can be seen on both side?
      .entry-thumbnail {
      width: 95%;
      margin-left: auto;
      margin-right: auto;
      }

      10. How do I remove the entire header from the post/page and have the featured image fill the top of the page?

      How do I include a menu bar at the top of the posts/pages?

      .single #masthead {
      display: block !important;
      }
      .single header#masthead .contact-info-area {
      display: none !important;
      }
      .single .header-wrapper {
      display: none !important;
      }

      11. How do I increase/decrease the size of the post/page titles?
      h1.entry-title {
      font-size: 13px;
      }

      17. How do I control the font for “Leave a Reply.”

      This worked, but now how do I change Leave a Reply” to something else?

      Keep on keepin’ on,

      *** Need to check dashboard

      12. How do I control the field of color behind the text?

      How do I control the color of the field behind the text that begins “I HAVE WRITTEN ABOUT BULLIES.”

      *** Footer widget area

      aside.widget-area {
      background: red !important;
      }

      *** Proudly Powered By area
      footer#colophon {
      background: darkblue;
      }

      **** article background

      .single article {
      background: green !important;
      }
      *** previous post section

      .post-nav-wrapper {
      background: red !important;
      }

      Like

  5. Alex says:

    Hi

    Great theme, really clean and nicely responsive!

    One little question, I’m using it on wordpress.com and notice that only footer 1 shows on most pages, whereas all 3 footers display on the homepage and posts. Is there a way to have all 3 footers show on all pages?

    thanks

    Like

  6. Alex says:

    Ah, perfect, thanks so much 🙂

    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: