CSS changes in Radcliffe theme
-
Hi,
I need some CSS help on the following areas within my Radcliffe theme.
1) When you click on the category pages (in my menu header) I want to remove the text that says “Category: [category name]”. I just want it to say the category name. For example: REVIEWS. It should be consistent with titles on static pages (non category).2) On the homepage, for each featured image it says the date / # of comments. How can I delete the # of comments?
3) How can I move the text overlay on the featured image? Right now it’s at the bottom of the image but I’d like for it to be in the center.
The blog I need help with is: (visible only to logged in users)
-
Hi there,
1) When you click on the category pages (in my menu header) I want to remove the text that says “Category: [category name]”. I just want it to say the category name. For example: REVIEWS. It should be consistent with titles on static pages (non category).
The theme and WordPress software create the titles on the categories pages as a single string of text, so we can’t delete or hide just part of it.
2) On the homepage, for each featured image it says the date / # of comments. How can I delete the # of comments?
In Radcliffe, the date, / and comments link are again all in one text string, so we can’t delete just the comments part. We can hide all of it with the following.
.post-meta-top { display: none; } -
3) How can I move the text overlay on the featured image? Right now it’s at the bottom of the image but I’d like for it to be in the center.
This seems to work pretty well. Make sure and view on a phone and tablet to make sure things don’t go awry. It appears to me it works fine though.
.post-header-wrap { bottom: 30%; } -
Thanks so much! That all worked.
Regarding the 1st questions, since this theme doesn’t allow to change that is there a way I can create menu pages that are not categories to avoid this layout? If I create actual pages it seems those will be static and my posts won’t automatically appear in those sections.
I know this isn’t a CSS problem. Should I re-ask this under another topic?
-
You may want to explore the Display Posts Shortcode. There are a number of attributes (including category) you can set to control what displays.
-
Thanks, I will do that.
I’m having another problem with my logo. When I upload it, it appear very small. How can it appear normal?
Can I also make the logo left aligned instead of centered?
-
Hi, you can give the following a try, however I would suggest making a new logo and crop it pretty tight to the text as you currently have a lot of whitespace around the text which is causing things a lot of blank whitespace. Once you do that, upload the new image and replace the url between the quote marks with the new url.
.site-logo-link { background: rgba(0, 0, 0, 0) url("https://strandsofbliss.files.wordpress.com/2015/11/sob_logo_1-001.jpg") no-repeat scroll left top / contain ; display: block; height: 300px; margin-left: auto; margin-right: auto; max-width: 84%; position: static; transform: none; width: 1300px; } -
Thanks, I did that but now I have 2 logos. The larger one (which I would like to use) still seems to have a big space around it and not fully left aligned. Perhaps you can take a look (currently up) and let me know what I’ve done wrong.
Thanks so much for your help!
-
Oh shoot, I’m sorry. I missed pasting the second CSS rule that hides the regular logo. Add this.
.site-logo { display: none; } -
Hi, I tried that but something strange is happening. Now I entered the CSS code below but the logo still appears in the same center place in a small size.
.site-logo-link {
background: rgba(0, 0, 0, 0) url(“https://strandsofbliss.files.wordpress.com/2015/12/strands-of-bliss-a-blog-dedicated-sol.png”) no-repeat scroll left top / contain ;
display: block;
height: 300px;
margin-left: auto;
margin-right: auto;
max-width: 84%;
position: static;
transform: none;
width: 1300px;
}.site-logo {
display: none;
}The first time I tried it 2 logos appeared, one of which was bigger and left aligned. Now seems only the first logo appears (the one I originally uploaded) and the size and placement won’t change despite the code I’ve added.
-
Hi, it looks like you have gotten this figured out. The first rule you have above has to be after the second. Site-logo and then site-logo-link.
-
Hello and happy new year!
I have a quick question. On my homepage where the posts appear, is there a way to add space between the featured images? Right now they’re stacked and it looks too busy. Any way to add some cushion space between?
Also, is it possible to change the favicon? Right now it’s the WordPress logo.
Thanks!
-
We can add some bottom margin to the featured media divs with the following. You can adjust the 20px value I’ve used as an example as desired.
.featured-media { margin-bottom: 20px !important; } -
Thank you, that worked!
Is it possible to change the favicon? It’s the wordpress logo now. Not sure if this is a CSS thing…
-
You are welcome.
Is it possible to change the favicon? It’s the wordpress logo now. Not sure if this is a CSS thing…
Absolutely, and it doesn’t require any CSS. See this support page which explains how to add your own favicon (Blavatar).
- The topic ‘CSS changes in Radcliffe theme’ is closed to new replies.
WordPress.com Forums 