Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme »

Adding class or tag to #bodyrow


  #1  
Old Jan 18, 2019, 04:47 PM
Paul Gingell
 
10 posts · Nov 2012
England
Following comments in this post about the unruliness of my CSS inserts , I've been tidying things up a bit (work in progress still).

Quite a lot of coding goes into creating different colour schemes for different pages, using Page-ID selectors. This gets confusing as more pages are added. E.g.
Code:
.page-id-30 div.widget-title h3,
.page-id-32 div.widget-title h3,
.page-id-201 div.widget-title h3,
.page-id-252 div.widget-title h3,
.page-id-257 div.widget-title h3 {
	border-top-color: #A29D8F; 
}
It would be simpler if I could replace this code with something like:
Code:
.yellow div.widget-title h3 { border-top-color: yellow; }
.blue div.widget-title h3 { border-top-color: blue; }
The .yellow or .blue class would need to be appended to the #bodyrow ID, because the colour scheme only varies here, not in the header or footer.

In the wordpress page editor is an options box [Page Attributes > Parent & Template], where the multicolumn option is. Ideally I'd have something similar, which allowed me to mark each page/post as either a Yellow or Blue page, which then added a suitable selector to the html.

Has anyone found a plug-in which might do this (or could be tricked into doing this)?
  #2  
Old Jan 19, 2019, 04:13 AM
juggledad's Avatar
juggledad
 
23,727 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
did you try a google search with 'wordpress plugin add class to page'?
Try https://wordpress.org/plugins/wp-custom-body-class/
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by juggledad; Jan 19, 2019 at 04:22 AM.
  #3  
Old Jan 19, 2019, 06:06 AM
Paul Gingell
 
10 posts · Nov 2012
England
Epic! Thanks. This is so simple it could almost be included in Wordpress.

For those who might be interested, the Custom Body Class plugin allows you to add an additional .class selector to the <body> via a small box in the page/post editor screen. In this case, I used it to group different pages. So it changes what was this:

Code:
.page-id-8 #bodyrow,
.page-id-50 #bodyrow,
.page-id-39 #bodyrow,
.page-id-279 #bodyrow,
.page-id-12 #bodyrow {
	background-color: #AEB49B;
	box-shadow: 0 0 11em #9CA28B inset;
	-moz-box-shadow: 0 0 11em #9CA28B inset;
		-webkit-box-shadow: 0 0 11em #9CA28B inset;
}
to this:
Code:
.sand #bodyrow {
	background-color: #AEB49B;
	box-shadow: 0 0 11em #9CA28B inset;
	-moz-box-shadow: 0 0 11em #9CA28B inset;
		-webkit-box-shadow: 0 0 11em #9CA28B inset;
}
If you had a 100-page website, with 50 of one colour and 50 of another, that saves an aweful lot of typing!
Attached Thumbnails
Click image for larger version

Name:	Picture-1a.jpg
Views:	87
Size:	11.4 KB
ID:	2824  Click image for larger version

Name:	Picture-2-web.jpg
Views:	83
Size:	20.7 KB
ID:	2825  

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Styling tr id=bodyrow geneise Center area post/pages 3 Jul 12, 2012 08:00 PM
Page class? twb716 Header configuration & styling 0 Jul 8, 2010 08:59 AM
a.js is adding 'alt' class to table rows billy2 Plugins & Atahualpa 2 Aug 16, 2009 03:17 AM


All times are GMT -6. The time now is 07:38 PM.


Powered by vBulletin® Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.