Home › Forums › Weaver Xtreme Theme › Formatting post titles differently, depending on where they appear
- This topic has 21 replies, 2 voices, and was last updated 1 year ago by
scrambler.
-
AuthorPosts
-
July 21, 2021 at 18:25 UTC - Views: 79 #69205
Hello,
I have made some CSS tweaks to the H2 tags.
You can see them in the subheads (which are H2), on a page like this:
The problem is this formatting propagates on other parts of the site:
Homepage post titles:
Sidebar post titles:
Is there a way to strip away this formating, or use a different one, depending on where those H2 tags appear? For example, with a “widget title class” or something similar?
Btw, I absolutely love the Weaver Xtreme theme!
July 21, 2021 at 20:02 UTC - Views: 79 #69206scrambler
ModeratorCss allows you to add selector to any rules to target specific content.
In order for me to help, I need specifics.
Are you trying to make changes to specific content you create, or to make the change affect certain section (like widgets), or pages.
Once we know what defines the target, we can elaborate on the CSS selector(s) to use
July 22, 2021 at 05:18 UTC - Views: 85 #69214GeorgeW
ParticipantHi, scrambler…
I have already made changes to specific elements of the site. For example, I added this to the h2 tags:
h2 {
padding: 0.3125em 0;
margin: 0 0 0.3125em;
border-left: 0.3em solid #246796;
margin-bottom: 1.0em;
padding-left: 1.0em;
font-size:150%;
color: #246796;
}But I want this to be applied ONLY to the h2 subheads inside posts and pages. Like this:
I do NOT want this to be applied to links inside the sidebar widgets.
Similarly, I have made the post titles bold.
But I do NOT want this to be applied to links inside the sidebar widgets, or to the linked titled posts on the homepage.
Is there a way for me to do something like this:
h2 {
padding: 0.3125em 0;
margin: 0 0 0.3125em;
border-left: 0.3em solid #246796;
margin-bottom: 1.0em;
padding-left: 1.0em;
font-size:150%;
color: #246796;[magic css code that applies the above only to the h2 tags inside a blog post]
}
Sorry if my post is a bit confusing.
Thanks!
George
PS. An alternative may be to separately style individual assets like:
- Links in sidebar widgets
- Links in blog-post pages (homepage).
July 22, 2021 at 20:39 UTC - Views: 69 #69220scrambler
ModeratorIf you only want to affect h2 in the content area, replace the selector
h2
by
#content h2
July 23, 2021 at 04:55 UTC - Views: 70 #69232GeorgeW
ParticipantThank you scrambler.
I did this and it did help somewhat.
It removed the left blue border from the sidebar widgets, which is good.
My problems still are:
- The sidebar post titles are still bold with left blue border.
- The post titles on the homepage are still bold with left blue border.
Can anything else be done?
I appreciate your time and patience.
Thanks,
George
July 23, 2021 at 05:13 UTC - Views: 69 #69233scrambler
ModeratorThe Post titles are bold because you have done this 2 different ways
- You set option for post title to be bold
- You entered a rule in the CSS+ box to do it
.wrapper .post-title a,.wrapper .post-title a:visited {font-weight: bold;}
The sidebar titles still have a left border because you still have a Custom CSS generic rule doing that
h2 {
padding: 0.3125em 0;
margin: 0 0 0.3125em;
border-left: 0.3em solid #246796;
margin-bottom: 1.0em;
padding-left: 1.0em;
font-size:150%;
color: #246796;
}So go through all your theme options, CSS+ boxes, and Custom CSS File with a comb 🙂
July 23, 2021 at 08:52 UTC - Views: 101 #69234This reply has been marked as private.July 23, 2021 at 16:14 UTC - Views: 62 #69235scrambler
ModeratorMust have been a cache issue
2) post titles where? Single post page (then use the theme page title font option) or blog page (give a link), or both
3) Change the selector from
#content h2
to
#content .entry-content h2
July 23, 2021 at 17:52 UTC - Views: 65 #69240This reply has been marked as private.July 23, 2021 at 17:58 UTC - Views: 53 #69242scrambler
ModeratorAdd the rule below
.single h1.page-title {font-weight:bold !important;}
July 23, 2021 at 18:16 UTC - Views: 51 #69243This reply has been marked as private.July 23, 2021 at 21:54 UTC - Views: 49 #69245scrambler
ModeratorThe rule I gave you is NOT responsible for that as it only affect h1 post title, and the post title in your sidebar are h2s.
As I said before, the post title in your sidebar are bold because of a CSS+ rule
/* CSS+ Rules */
.wrapper .post-title a,.wrapper .post-title a:visited {font-weight:bold;}
#author-info {border: 1px solid #07D900;}CSS+ rule are rules you put in the CSS+ box next to an option.
That CSS+ rule should be coming from the Post Title Text Color CSS+ box
(I told you to scrub…)
July 24, 2021 at 15:44 UTC - Views: 43 #69258This reply has been marked as private.July 24, 2021 at 16:02 UTC - Views: 38 #69260scrambler
ModeratorThe CSS is no longer in your theme global custom CSS rule box. If you see that rule in your Them Global Custom CSS Rule box, then something is broken
Are you by any chance using an optimization plugin for JS and CSS, or an optimization option in an existing plugin like jetpack?
If so, you need to deactivate that as it is known to break the theme js and CSS.
If unsure, deactivate ALL non weaver plugin and see if things start working again, if so deactivate one by one.
If you have a Cache plugin or cache service like Cloudflare, clear and deactivate that
July 25, 2021 at 07:28 UTC - Views: 51 #69265This reply has been marked as private.July 25, 2021 at 16:07 UTC - Views: 63 #69266scrambler
Moderator“Once I did that, I noticed the “Shortcode” widget that included the code [show_posts filter=default] had been removed from the Primary Sidebar (Is this standard WordPress behavior?)”
Wordpress will sometimes lose widget allocation. they are usually not lost must moved in the unused widget section, and you just need to move them back.
Doing a child theme is not the solution, if something is corrupting the theme CSS we need to figure it out or you may get more issue that you wont catch nut users will suffer from…
This is what the web page list as the current Custom CSS, and it does include our h2 rule at the end, but corrupted with the biggest first part missing (includingthe open curly bracket (yellow highlight)
Note: Unrelated, but you are also missing the unit on the border highlighted in orange.
/* CSS+ Rules */
#author-info {border: 1px solid #07D900;}/* Global Custom CSS Rules */
/* Custom CSS rules for Ajax Subtheme */
.page-title{border-bottom: 0px solid #07D900;} /* add a bottom line to page titles */
#container .post-title{border-bottom: 0px solid #07D900;} /* same for post titles */
h3.widget-title{border-bottom: 0px solid #07D900;} /* matching for widget titles */
h3.widget-title{padding-bottom: 20px;} /* matching for widget titles */
.more-msg {background:#D1FFE2; border:1px solid green;padding:2px 5px;margin-left:20px;} /* make the Continue Reading boxed */.error404 .entry-content div:nth-of-type(2), .error404 .entry-content div:nth-of-type(3), .error404 .entry-content div:nth-of-type(4) {display:none;}
.atw-show-posts-filter-default article > span {display:flex;flex:0 0 25%;border:1;margin:0 3% 0 0;}
.atw-show-posts-filter-default .featured-image {float:left;width:24%;margin:0 3% 0 0;}
.atw-show-posts-filter-default .entry-header {float:right;width:73%;}
.atw-show-posts-filter-default .entry-header .post-title {font-size:1.2em;}
.atw-show-posts-filter-default .post {border-bottom:1px solid #dbd6d4;padding-bottom:10px;}.atw-show-posts-filter-new article > span {display:flex;flex:0 0 25%;order:1;margin:0 3% 0 0;}
.atw-show-posts-filter-new .featured-image {float:left;width:24%;margin:0 3% 0 0;}
.atw-show-posts-filter-new .entry-header {float:right;width:73%;}
.atw-show-posts-filter-new .entry-header .post-title {font-size:1.1em;}
.atw-show-posts-filter-new .post {border-bottom:1px solid #dbd6d4;padding-bottom:10px;}li{
margin: 10px 0;
}.category-title-label{display:none;}
.more-msg {display:none;}
.excerpt-dots {display:none;}.wp-block-embed-youtube .fluid-width-video-wrapper {position:absolute !important;top:0px;}
#content .entry-content h2
color: #246796;
}
/* End Weaver Xtreme CSS */So check your Custom CSS Rule box, and if the rule is complete there with no errors do the following.
- Paste here the content of your custom CSS Rule box.
- Paste here the content of your System Info box in Main Options > Theme Help
- Also, you did not explain in detail what you did with the Plugins. You did say that when you deactivated all of them, the rule came back, but later disapeared.
Can you please redo the plugin procedure below and pay attention to the details.- Deactivate ALL non weaver plugins, see if the style from the rule comes back
- If it does, reactivate One by one and test the site in between each activation to see if the rule disappears. If it does note which plugin you had just reactivated.
-
AuthorPosts
- You must be logged in to reply to this topic.