WordPress Tricks

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

allaboutbasic

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

You can take my personal help in skype : om2000_cuet

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;
}

Question 17: How to change Proudly Powered By WordPress and use Your own company and copyright info with year in the footer of Radcliffe 2 theme By Anders Norén

Answer: Go to dashboard, then Appearance > Editor (theme editor). Replace the Red Bordered are with the code i shared below
Proudly Powered by wordpress replaced by company copyright info in Radcliffe 2 theme

<div class="site-info">
			 © Copyright 2018
			<span class="sep"> | </span>
      Your Company name and messages here

		</div><!-- .site-info -->



If you have any issue feel free to ask me question here in comments section


OR


You can take my personal help in skype : om2000_cuet

Published by allaboutbasic

164 thoughts on “Radcliffe 2 By Anders Norén :Modifications of header, footer, sidebar, contents, customization and documentations”

  1. 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

    Reply

    2. 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;
      }

      Liked by 1 person

      Reply

  4. 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

    Reply

    1. 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

      Reply

  5. OM

    Here are what I hope to be my final questions (links for each page in question included):

    HOMEPAGE [http://www.nealumphred.com/]

    Social Icons: Control color, size.
    Footer links: Control font, size, color, hover color.

    PAGES [http://www.nealumphred.com/little-background/]

    Article Title (“On Being A Mystical Liberal”): Control font, size, color.

    Text field: Control background color, width.

    Text (“What does it mean to be a Mystical Liberal?”): Control width

    POSTS [http://www.nealumphred.com/brass-balled/]

    Title (“brass-balled rightwing babe”): Control font, size, color.

    Leave a Reply: Control width of text field.

    Thanks in advance!!!

    NEAL

    Like

    Reply

    1. HI Neal,
      sorry i missed your questions,
      here is the answers

      **** footer widget font color, size and font family
      .widget li a {
      color: black !important;
      font-family: Georgia !important;
      font-size: 15px !important;
      }

      *** footer links hover colors of links

      .widget li a:hover {
      color: green !important;

      }

      can u share me screenshot image regarding other issues?

      Like

      Reply

      1. OM

        It happens. Believe it or not, I was able to resolve those issues by using the code that you shared on your post about Twenty Seventeen!

        Here’s my biggest issue on my pages such as this one:

        http://www.nealumphred.com/mystical-liberal/

        Can I make the background of the header (title, tagline, nav bar) a different color from the rest of the site?

        Most important: How do I make the background behind the text of the article white?

        Best,

        NEAL

        Like

      2. HI Neal,
        to change header background only in your mentioned page, try this

        .page-id-13642 #masthead {
        background: red !important;
        }

        also to make the background behind the text white..try this

        .page-id-13642 article {
        background: white !important;
        }

        let me know if it helps

        Om

        Liked by 1 person

  6. 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

    Reply

  8. Hi Om,

    thank you for your helpful tips on your site!

    My question is quite simple, however: How do I define/change the basic color (standard: red) which wraps the active menu button, pops up when you hover over the titel, etc.?

    Frank

    Like

    Reply

      1. Hi Om,

        thank you for your quick response!

        In the meanwhile, however, I’ve found the answer myself: There is no single option/definition, but the main color (#ca2017) is defined several times in the style.css. Thus I simply searched & replaced the code “#2017” with the code of the new color in the whole style.css.

        Greetings,

        Frank

        Like

  9. How difficult would it be to change to using a custom header/banner behind the site title and tagline instead of using the custom logo that appears above or beside (depending on style pack)?

    Like

    Reply

  10. Thank you… The code you posted didn’t quite work, but it definitely put me on the right track:
    I went with:

    .custom-logo {
    display:none;
    }
    .site-branding {
    background: url(http://lizt.x10.mx/wp-content/uploads/2018/02/208797_5633825739_8733_n.jpg) no-repeat;
    }

    Obviously I’ll have to make some other edits to get the right look (including editing the image), but with the other code on your page here I should be able to muddle through 😉

    Regards,

    Like

    Reply

      1. Just thought I would share what I have ultimately done (in case anyone else has a similar question): instead of setting the background image of the .site-branding class directly, I added it with the ::after psuedo-element. This allowed me to control the background opacity without affecting the opacity of the child elements.
        The downside of the code that follows (specifically, using background-size:cover) is that it does not present the background image consistently across devices.

        .site-branding::after {
        content: “”;
        background: url(http://lizt.x10.mx/wp-content/uploads/2018/02/208797_5633825739_8733_n.jpg);background-size:cover;
        opacity: 0.4;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        position: absolute;
        z-index: -1;
        }

        Like

  11. THis is all very useful, I think. But I’m a true beginner. I copied the appropriate text from above to add a banner background image in the header, like this:

    .custom-logo {
    display:none;
    }
    .site-branding {
    background: url(https://saraaleman.wordpress.com/montania/) no-repeat;
    }

    But I have no idea where to put the code! I need some very basic guidance, please, on where to find and then insert this code.
    Thank you,
    Sara
    https://saraaleman.wordpress.com/about/

    Like

    Reply

  12. Hello Anders!

    I have to admit I find your tips super helpful even if I am an IT dumb 😀 Thank you for that! There is just one thing that I don´t know how to solve… I am missing the featured excerpt displayed on the homepage under the title of each post….is there any chance to add it? I have the premium plan.

    Thank you 🙂

    Barbora

    Like

    Reply

  14. It doesn´t allow me to reply to you under the original question anymore…but yes, exactly as you are saying. I want to show excerpt in my blog page equals my homepage.

    Like

    Reply

  18. Hi!
    My name is Miguel and I have trouble with social media icons.
    I´m not sure, but I think I deleted that part in the theme and I can´t get them back.
    Could you help me?
    Thanks!
    This is my site: http://www.farmer.com.mx
    P.D. Your advices have been so helpful.

    Like

    Reply

  20. Has anyone else noticed that when using a child theme, the style-pack thumbnails in the customizer are not loading as the customizer is looking for them in the child theme dir instead of the parent theme?

    Like

    Reply

      1. thanks for responding …. how would I go about adding a screenshot to this reply? There does not appear to be an option to do that?

        Like

      3. thanks … also noticed that the child’s theme options are wonky after activation (included comparison json in case that helps)

        Like

  21. Is it possible to add a members area with the theme? I’ve been asked to add a members area that would require a login and allow private discussions, use of restricted email distribution lists, a member chats. How could this be done starting with Radcliffe 2?

    Thank you for your time

    David Sadler

    Like

    Reply

  22. Hi Om Prakash Chowdhury! Thank you for the helpful information here! I just tried some of your CSS codes and they worked for my site! This is great!
    I only have one question. Is it possible to customize the appearance of a page that is set as a blog page and shows the posts? I really don’t like the appearance of the blog page in Radcliffe 2 (black/gray background and large titles) and that is why I hided it from the menu and I created a new regular page that shows the posts instead. I add the post manually to this page (News) and it is like a double work form me. Also if you search for something in the page, the search result appears the same way as the blog page. So, is it possible to customize the view of the blog page and the search results? I would like the blog page to be similar as my “News” page.

    https://financeexpert-bg.com/

    Thank you in advance!

    Like

    Reply

    1. Hi Файнанс Експерт ООД
      woud you mind to share me your news page url to check?
      if you are using your own hosting (not wordpress.com plans), then it can be done
      🙂
      Om

      Like

      Reply

    1. Hi Файнанс Експерт ООД
      I think it can be done
      it will need to create a template (blog type) to show your contents that way….
      i can help …but need me time
      can you share me a full backup (upload the backup in dropbox or google drive) of your site to my mail?
      my mail is om2000_cuet@yahoo.com

      i will check in my leisure..

      Om

      Like

      Reply

      1. yes perfect that worked. another question about the same menu. When unfolding, the font is gray. How can I change this to white?
        Thanks for your great help.

        Like

  31. How can I change the button color of the mobile navigation bar? It should be in green color (like the desktop version) and not a mix between green and the Radcliff red theme color.

    Thanks and Cheers
    Julia

    Like

    Reply

      1. Hi Om,

        Thanks for your quick reply.
        The site‘s name: http://www.naturheilpraxis-kroenke.de

        The mobile version shows in the navigation bar in the unfolding arrows still the red color instead of our custom css green.

        How can we adjust this?

        I can send you a screenshot on request!

        Thanks a lot! Many regards
        Julia

        Like

      3. Hi Julia
        would you mind to try these piece of codes please?

        button:focus, .button:focus, input[type=button]:focus, input[type=reset]:focus, input[type=submit]:focus, button:active, .button:active, input[type=button]:active, input[type=reset]:active, input[type=submit]:active {
        background: #61a375 !important;

        }
        button:hover, .button:hover, input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover {
        background: #61a375 !important;
        }

        let me know if it works

        Regards
        Om

        Like

    1. Actually, I see you already posted the answer and called it “main menu”. Thank you so much! All of this is great!

      Like

      Reply

  35. Dear OM,

    I must apologize: I wrote a few minutes ago with one question but that was not the only one I had. Finding your site was just so exciting that I forgot the other two. The first one would be: how can I let the theme display the full menu (not just the symbol but all of the entries I have made) on every post or page on my site? The second one regards a gap between the title on my site and the text field directly below the title: the gap there is way too small – is there a possibility to make the gap a bit bigger?

    Warmly
    Laureen

    Like

    Reply

      2. Hi Laureen
        Thanks

        for the 2nd issue i think you are searching this

        @media screen and (min-width: 768px){
        .entry-header {
        padding-bottom: 100px !important;
        }
        }

        For the First issue,
        would you mind to clarify me some more? sorry didn’t understand it properly

        Regards
        Om

        Liked by 1 person

  36. Dear OM,

    thank you so much for the quick response! The two other issues I had were (a that my theme doesn’t adjust to the screens of mobile phones when the posts have featured images and (b that I would need my menu to display full on mobile devices so everyone can see its content even on a mobile phone.

    Very grateful and with best wishes
    Laureen

    Like

    Reply

    1. Hi Laureen
      for menu issue, i think you are searching this

      @media (min-width: 320px) and (max-width: 668px) {
      .menu-privacy-policy-datenschutzerklarung-legal-notice-impressum-container {
      max-height: 100% !important;
      }
      button.menu-toggle {
      display: none;
      }}

      Regarding the screen adjust issue in mobile device
      ** i found your posts with featured images looks ok? in which post page it is showing issue? share me the url

      Regards
      Om

      Liked by 1 person

      Reply

      1. Dear OM,

        thank you so much for the code:) It worked instantly and now my menu is displayed full even on mobile screens! When it comes to the not-adjusting screen the problem is that when you go on https://heilueben.com/ with a mobile phone and view the post titles there by simply scrolling down the page and the posts have featured images then the titles are squeezing over each other but only when you use a mobile screen. On the computer screen however, everything looks fine.

        Warmly
        Laureen

        Like

  38. Just a quick note to clarify what I meant: the titles are only displayed wrong when I allow the featured images of my posts to be shown on my main page. When I take them out but leave them in the individual postings themselves everything looks grey but fine. So the problem only occurs on mobile screens when I’ve allowed my site to display the featured images of my posts on the main site. To allow or disallow the images to be shown on the main site I go this way customizing -> content options -> featured images -> display on blog and archives and allow to display the featured images on my blog and archives.

    Warmly
    Laureen

    Like

    Reply

    1. Hi Laureen
      for the mobile issue, would you mind to check this please?

      @media (min-width: 320px) and (max-width: 668px) {
      .home h2.entry-title a {
      font-family: “Open Sans”;
      font-size: 21px;
      line-height: 28px !important;
      font-style: normal;
      font-weight: 400;
      letter-spacing: 2.7px;
      }}

      Liked by 1 person

      Reply

      1. Dear OM,

        The code you’ve sent worked pretty well already, so thank you for this effort:) The only problem is that it only allows adjusting the titles by giving us control over the font size of our titles and to adjust all of them we would have to make our (long) titles so small that nobody would be able to read them. Since it worked back then when we were hosted at WordPress – do you see another possibility of forcing the titles to adjust to a mobile screen other than making them so significantly smaller? Maybe the transparent-black backgrounds they’re on are too big and they could be made smaller?

        Warmly
        Laureen

        Like

      2. Hi Laureen
        not sure but to reduce the transparent black background padding

        @media (min-width: 320px) and (max-width: 668px) {
        .home .entry-meta {
        display: none;
        }
        .home header.entry-header {
        padding-top: 12px;
        padding-bottom: 12px;
        }
        }

        please try this

        Regards
        Om

        Liked by 1 person

  39. It worked! Good god – thank you so much OM:) Finally, my blog looks normal again – even on a mobile screen, so thank you thousand times over for your help.

    All the best
    Laureen

    Like

    Reply

  40. This has helped me so much, so thank you! I have 2 questions, Is there a way to move the social menu to a different spot, such as under the main menu or above the main menu? Also is there a way to hide the Site Title & Site Tag on all of your pages except the Home/Main page? I obviously want it on my home/main page but it takes up too much of the screen on the mobile view when going through the rest of the blog pages.

    Like

    Reply

    1. Also, for some of my text posts I ave a colored background. The margins of the text box is significantly small than the margins of the colored background the text is within. Is there a way to change the margins of text so that it take up more of the colored background box?

      Like

      Reply

    1. Hi
      you seems added custom css code wrongly
      please add this

      @media (max-width: 767px){
      .main-navigation > div {
      max-height: 100% !IMPORTANT;
      }}

      ** you better check by removing some of your menu related code

      Regards
      Om

      Liked by 1 person

      Reply

  42. Dear OM,

    My site heilueben.com is now static – with a link to my blog in the menu displayed above. Unfortunately, now my blog posts are again pushed into each other when viewed from a mobile phone, meaning the titles appear to be written into each other and the letters are way too big. Can I try something to untangle this problem?

    Warmly
    Laureen

    Like

    Reply

    1. Hi Laureen
      can u try this

      @media (min-width: 320px) and (max-width: 668px) {
      .blog header.entry-header, .blog header.entry-header * {
      font-size: inherit !Important;
      }}

      let me know if it helps for mobile view of blog page title

      Regards
      Om

      Liked by 1 person

      Reply

      1. Thank you! That looks so much better again:) Now only the longest of my post titles is still a bit too expanded. If there is something that could be done about the spaces between the lines? I think if the space between the lines was more narrow it would work out perfectly.

        Thank you in advance
        Laureen

        Like

      2. Hi Laureen
        replace my previous code with this

        @media (max-width: 668px) and (min-width: 320px){
        .blog header.entry-header, .blog header.entry-header * {
        font-size: inherit !Important;
        line-height: 24px !IMPORTANT;
        }
        }

        let me know if it helps

        Regards
        Om

        Liked by 1 person

  43. It helped! Thank you very much:) Another question: Do you know how to make the featured prompt on my site more narrow?

    Thank you as always for your help and all the best
    Laureen

    Like

    Reply

  44. It is surely a bit much to ask in a short period of time but there was another question that came to my mind: How could I also make the featured images in my posts and pages narrower?

    Warmly
    Laureen

    Like

    Reply

  45. Dear OM,

    Thank you very much:) This code works very well for the featured images and makes them narrower which is great! It doesn’t do anything with the featured prompt but that’s fine – my site looks just like I imagined it now:)

    Warmly
    Laureen

    Like

    Reply

    1. Hi Laureen

      would you mind to check these both?

      normal view title color

      .blog h2.entry-title a {
      color: red !important;
      }
      Hover title color

      .blog h2.entry-title a:hover {
      color: yellow !IMPORTANT;
      }

      let me know if that helps

      Regards
      Om

      Liked by 1 person

      Reply

  47. It helped immediately! Thank you so, so much OM, I a so happy:) Do you also know how to influence the colour of the background of my blog titles? (It’s of a transparent black now but I’d love it to be white.)

    Warmly
    Laureen

    Like

    Reply

  53. Dear OM,

    Thank you for all your patience:) The code you sent works perfectly well to change the fonts background colour as shown in the first screenshot. But what I’d be interested in is how to change the font colour of the title and description of the featured prompt as shown in the second screenshot.


    Warmly
    Laureen

    Like

    Reply

    1. Hi Laureen
      are u searching this? ( in the screenshot u used the title and description…and in live site seems missing)

      h2.hero-area-title, h2.hero-area-title * {
      color: red !IMPORTANT;
      }
      .hero-area-content {
      color: red !important;
      }

      Regards
      Om

      Liked by 1 person

      Reply

  55. Dear Om,

    Do you know how to change the colour of the article titles shown in my sites search results? Their colour is not the colour I’ve selected for my article titles on my front blog page. They only show when someone uses my site’s search. Can I do something there?

    Warmly
    Laureen

    Like

    Reply

  57. Hi Om, i really would like your help with something that’s bugging me off in my Radcliffe 2 Theme.

    Right now I’m using the original Radcliffe 2 Style Pack, I’m upgrading my account and I want to change my theme to the Modern Bauhaus Style Pack, but I’m having trouble with the header image on my website.

    I want to put the header image with the site logo in it so that it can cross the screen, but when I choose the Modern Style Pack there’s only the option of puting the logo on the site and it’s left aligned with a big white space on the right, I can’t make the logo big enough to cross the screen, is there a way to make this happen?

    Here’s a image of my problem: https://imgur.com/kizqib0

    Here’s my website link: https://traduagindo.wordpress.com/

    Like

    Reply

  58. Dear OM,

    Recently we have come up with the issue that our theme needs to display the publication date of our blog posts and pages at the bottom.
    It also doesn’t display the date in our posts’ overview, which is fine. (If memory serves, we had that date display turned off a while ago.)
    Our issue is specifically with the posts and pages not showing the publication date.

    Do you know something to make the date of their publication appear on the bottom of our posts and pages below the “Published by …”-field?

    All the best
    Laureen

    Like

    Reply

  62. Hi Om, once again coming to you to see if you could help me with my website.

    My header now is only displayng in a small size, the logo resizer isn’t working anymore and I can’t change the default display resolution of 144 x 48 for my header.

    I think I could bypass this by some CSS code, but I just can’t seem to find it, I already tried typing:

    .custom-logo {
    height: auto;
    max-height: 900px;
    max-width: 1200px;
    width: auto;
    }

    … And it didn’t work, don’t know what to do, could you help me somehow?

    https://traduagindo.com/

    Like

    Reply

    1. Thanks
      which plan of wordpress.com you are using? are u able to use custom css?
      if yes try this code

      div.site-branding .custom-logo {
      height: 100% !important;
      max-height: 900px;
      max-width: 1200px;
      width: auto !important;
      }

      please let me know

      Regards
      Om

      Liked by 1 person

      Reply

Leave a reply to Lizna Erkelens Cancel reply