[renai42]

hey everyone,

installed a base install of bbPress today on a test site:

http://topstory.com.au/forums/

Basically all I want to do is modify the font size down, from 12px to 11px. Can someone tell me where I can do this? I’ve done a lot of frakking around with CSS files with WordPress, but can’t find the right setting in bbPress.

Cheers,

Renai

[Jared Atchison]

Copy the bbpress.css from the bbpress plugin directory to yourtheme/bbpress/bbpress.css and then edit the CSS/font size from there 🙂

• This reply was modified 12 years, 1 month ago by Jared Atchison.

[renai42]

hey mate,

this is precisely the kind of overly simplistic response which turns people off using bbPress. Your suggestion is pretty much contained in the bbPress documentation already and is less than useful.

Sure, you need to copy bbpress.css to the right directory and edit it. But what you fail to mention, and what is mentioned nowhere in the bbPress documentation, is that many of the font specifications are not actually listed in that CSS file — you need to puzzle out the CSS entry yourself and add a new CSS entry, not edit an old one, to change the font size.

I spent three hours working this out last night. The correct entry is:

bbpress-forums .bbp-topic-content p,

bbpress-forums .bbp-reply-content p {

    font-size: 12px;

}

I have seen this same response from the moderators on the bbPress forum dozens of times as I searched it last night. This same arrogance — ‘just copy the CSS file and edit it’. Technically you’re right, but without any detail or documentation around bbPress, this suggestion comes across as the contempt of an experienced web developer for someone who is, in their eyes, a ‘n00b’.

I operate a major WordPress site and edit its CSS files daily. And yet, the CSS for bbPress is hideously complex and hard to understand. I suggest that you guys modify your attitude and start looking for actual solutions to people’s problems … especially around making default themes easier to customise. Otherwise, bbPress, which is an awesome solution to a long-held problem for WordPress site owners, will remain the little-used forum software that it is.

Cheers,

Renai LeMay
Publisher, Delimiter.com.au

[John James Jacoby]

@renai42 – Thanks for the feedback. The great thing about bbPress being open-source is you’re able to fix the things you don’t like on your own with Subversion patches via our Trac.

Sorry you’re finding the CSS to be complicated. There are some compromises we made to be able to make bbPress as good as it can with every possible WordPress theme available. As such, some CSS rules are more strict than others, and we tend to have things wrapped in ID’s to allow groups of content to be styled and/aggressively reset.

The staff here are volunteers, every one of us. We operate under the assumption that if you’re in the code, asking code questions, that you’re comfortable taking on something new and foreign. I’ll defend the code here though, since bbPress’s code is nicely documented and orderly.

Volunteer community members represent the project, but they also represent themselves. If someone’s made you feel bad, that’s between you and them. We’re all adults here, and it doesn’t benefit anyone to talk above or below anyone else; when it happens, it weeds itself out pretty quickly.

Regarding CSS specifically, it’s in the name: it cascades down. This means you’re able to add whatever rules you’d like in the stack, and the browser will interpret those new rules in kind. If it’s not obvious enough to you, that just means you learned something new today. That’s not anyone’s fault, or anything that anyone should be upset about on either side.

Again, thanks for your feedback; if you’d like to talk privately about a specific matter or person, contact me privately (a Google search should bring up multiple ways to do this.)

[renai42]

hey John,

I appreciate your response.

I’m sorry, but I don’t agree bbPress’ code or the process of implementing it is nicely documented. In fact, very little of it is documented that I can see — and much of what does exist refers to bbpress 1.x. As an example, I found it almost impossible to find any documentation this week on how to install a new bbPress 2.x theme, or how to modify existing themes. For a WordPress plugin … this is pretty unusual.

I appreciate that this is an open source community … I guess I’m disappointed because I feel what bbPress is doing has the potential to be revolutionary — and that its difficulty of implementation is limiting that potential. WordPress has needed what bbPress is doing for many years.

Cheers,

Renai

[crzyhrse]

OK, I have been at this off and on for days, trying to find how to merely, easily, simply change font sizes in bbpress…

I tried as best I could to do as directed here by Jared… It doesn’t work…

I concur with renai, the attitude of many moderator responses with brief, vague, inexplicable, information lacking answers, and the seeming total lack of any easily findable cohesive simple directions to do much of anything…

Come on- How much more basic and normal can it be, to want to change font sizes…??

[Lynq]

Hey guys,

Can I ask, are you comfortable with changing font sizes on a WordPress website? Regardless of bbPress.

If so then it’s exactly the same. If you wanted to you could even create a section inside your main themes style sheet for bbPress specific styles.

Good luck!

[Robin W]

crzyhrse – I am in the process of trying to improve the documentation – I started using wordpress & bbPress earlier this year and am still learning. This is community software, and community documentation, so I am trying to do my bit by helping the documentation side, and by spending time on the forum helping others where I can. The step by step guides I am writing are designed to fit the bill of “cohesive simple directions”, but if they are failing or you haven’t found them, then they are not working as planned. Let me know and I’ll try to improve layout and/or content, but I need good feedback to do this.

The text change suggested by renai42 works (with a small change) if done to the bbpress.css.

Can I ask you to look at

Step by step guide to setting up a bbPress forum – part 2

and the styling crib

bbPress Styling Crib

I’ve just tested and added Renai’s css so look there for what to use.

If you can improve wording or content to help others – please let me know what could be better phrased.

If it doesn’t work, come back with what you did, and I’ll see if I can help further

[crzyhrse]

I’m back to the same quest, changing the forum’s font size(s), and in searching around rediscovered here… I’m pretty good about checking the “notify me of followup” boxes but didn’t get an email in this case, so this is a good bit later… I’m hoping your “followup” boxes are still checked and maybe you will see this… I’ll bookmark this thread and check back in…

And thank you, this IS community and I deeply appreciate all the effort everyone makes to help each other, and also for both of you reminding me of that… Because it is looking like it could be helpful to Robin to know a little what it is like (for some folks anyway) looking for answers like this, I’ll make an offering here, beyond just looking for my own solutions…

It could be that I am a bit typical of someone coming into this believing they can do it even though they haven’t done it before, and who is generally doing very well and truly enjoying the process, and all the new stuff I am learning… I have a very nice, unique website going now, with a lot in it. The forum is the only part left for me to tweak around with, refine it’s look and feel, so to speak, or in other words the stuff css does, as opposed to php for instance…

To answer Lyng and also in response to Robin, I am comfortable changing css via the theme child, as well as php changes with snippets via the snippets plugin, and have altered parts of some wp files, theme files & plugin files via the cPanel when snippets or child css wasn’t going to do it, in which case making local documented backups…

And, I am totally illiterate in terms of writing code and nearly illiterate reading, some bits of css being a slight exception. And my brain cells way too old for me to ever become fluent. Especially in that there are several different languages used for websites… I understand “cascading” though, and am getting some glimmers of the relationship between some of the languages, like it seems that css is telling php what to do once php gets some structure in there… I have a construction background so I tend to look at things that way, bits and pieces of this and that fitting together to make a whole…

So how I have gone about it is to search and obtain code from all you amazing literate folks, as well as by learning a bit to identify in the case of css what can be altered in existing code to change size, color, padding, location, etc., and add that to the child theme or elsewhere so the cascading effect takes place…

I can’t ever imaging at my age learning much about php, i.e., to actually change existing php code, but I can and have looked for and found some bits from people who seem to know what they are doing and who are referring to to something close enough to my own situation to try it, either as a snippet or some changes via cPanel, text, things like that..

People often offer code but don’t then say how to use it, place it, where it goes, as if all of us out here, if we are looking for code know that part… If that information could be more prevalent with the offered code it could be hugely helpful for this person and probably a lot of other folks… I’m reminded sometimes of being in a country whose language I don’t speak, and how sometimes local folks can kind of get impatient with that. And I also see in searching around how some folks seem to want simple solutions without any effort on their own part… And as you reminded me, this is community, so there you go… All sorts of us… 🙂 I’ve actually enjoyed some great personal growth these last few months with all of this…

I am hoping all this can be helpful… I’m now going to go off and explore where Robin has pointed, and maybe come back here with a report, likely not to be even nearly as long-winded as this… 🙂

Again, truly regret that I did not see your responses sooner, and hoping you get this…

John, aka crzyhrse

[Robin W]

John,

Thanks for this – I have been playing with WordPress for less than a year now, so still consider myself to be a newbie at this, but one who is keen to share stuff I have learnt, and one who has spent many hours googling for solutions.

I try to write for those with little knowledge, so if you think the wording can be better on any post/documentation entry, please come back. What is clear to an author is often not clear to everyone else, so please add to improving the codex and posts where people like me are not clear, and as you learn more, please visit the support forum and see if you can help one or two others with their problems.

All the support people on here are volunteers, no-one is paid and we give back time as we got the code and support for free when we needed it. Join us in helping others !

[crzyhrse]

Hi Robin,

Adding the !important, I have placed the below into the theme’s child, and then just to see what would happen when that didn’t do anything, placed it at the bottom of the bbpress.css file, here- /wp-content/plugins/bbpress/templates/default/css/bbpress.css

Neither attempt made the change I am looking for, to increase the font size of all the forum text in general, which is presently about the same size as this text is here… I’ll tweak the number once something I try is effecting a change… I am always clearing all caches when I ever do any changes, just to confirm that…

bbpress-forums .bbp-topic-content p,
bbpress-forums .bbp-reply-content p {
font-size: 16px !important;
}

I am going to keep looking and playing with it but wanted to report this now… I am accepting your offer of help. Some feedback is that in a lot of searching in the past I hadn’t come across the pages your links above sent me to, and they are helpful, though still with some vagueness and gaps that can leave on a bit floundering… I you want to hear more let me know…

[crzyhrse]

I just posted that and then see you are there above me again, here in just the last little while, and I did NOT get an email notifying me of it… So something is goofy there… I havent even read your post yet, will do so now…

[crzyhrse]

Found it- mailserver believing it spam… won’t happen again…

[crzyhrse]

Thank you for your message… You’ll see that I haven’t yet accomplished the change I’m looking for, and it’d be nice to accomplish that…

I’m starting to look at helping folks, and actually have offered a bit once or twice in the general wp forums… It is helpful to see how you are going about this, being relatively new, with me even “newer,” so to speak…

Off to cast about some more for possibilities to get that pesky forum font to make itself bigger… And hoping you might have some additional suggestions…

🙂

[crzyhrse]

Latest discovery- when I search the complete directory/folder of bbpres, for- bbp-topic-content or bbp-reply-content, absolutely nothing is found… Which I believe suggests that there is nothing to cascade into the above code…?

[crzyhrse]

Well, After a lot of doodling around I’ve accomplished my goal, increased all the forum’s various text font sizes… Here is the gist of it…

I took a copy of the bbpress.css and put it into TextWrangler. Searched for all instances of font-size, made that all be listed at the top in a split window as a guide, then went through and searched and replaced for each different font-size, adding 2px to the px sizes and 0.2em to the em sizes.

Then on a copy of that, with all font-size instances again listed at the top to guide me, I went through and eliminated everything BETWEEN the sections that had a font size in them. I ran all that was left through a code checker- http://jigsaw.w3.org/css-validator/validator -which said it was good.

I then tried what Jared suggested at the beginning of this thread and that I’ve seen suggested elsewhere (often by Jared), I created a folder in the theme’s child folder called bbpress, and copied that modified and reduced bbpress.css file into that folder…

No go, that did not work… So, I then copied and pasted that very same code directly into my child theme’s style.css, and yea, it was working, changed it all… Went back and got rid of thee above mentioned folder, and it still worked..

It may be that there are things that didn’t need to change to accomplish my goal, but it works, nothing is too big and all of it is now easy to see without squinting… 🙂 I could imagine doing a similar process for other sorts of changes, if a change seems to be called for…

Here is the modified code… I believe I could have also eliminate everything but the font sizes and the parts that do the targeting (properties?), but I think this makes it easier to place where things are at in the full file, and I might want to change some other font attributes at some point…

Hoping this might be helpful… I’ve sured learned some things today…

/**
 * bbPress specific CSS
 *
 * @package bbPress
 * @subpackage Theme
 */

#bbpress-forums {
	background: transparent;
	clear: both;
	margin-bottom: 20px;
	overflow: hidden;
	font-size: 15px;
}

#bbpress-forums ul.bbp-lead-topic,
#bbpress-forums ul.bbp-topics,
#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-replies,
#bbpress-forums ul.bbp-search-results {
	font-size: 15px;
	overflow: hidden;
	border: 1px solid #eee;
	margin-bottom: 20px;
	clear: both;
}

#bbpress-forums .bbp-forums-list li {
	display: inline;
	font-size: 13px;
}

#bbpress-forums div.bbp-forum-title h3,
#bbpress-forums div.bbp-topic-title h3,
#bbpress-forums div.bbp-reply-title h3 {
	background: none;
	border: none;
	font-size: 18px;
 	line-height: 1em;
 	margin: 8px 0;
	padding: 0;
	text-transform: none;
}

#bbpress-forums div.bbp-forum-author .bbp-author-role,
#bbpress-forums div.bbp-topic-author .bbp-author-role,
#bbpress-forums div.bbp-reply-author .bbp-author-role {
	font-size: 13px;
	font-style: italic;
}

span.bbp-author-ip {
	font-family: 'Helvetica Neue', Arial, Helvetica, 'Nimbus Sans L', sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #aaa;
}

div.bbp-breadcrumb,
div.bbp-topic-tags {
	font-size: 15px;
}

span.bbp-admin-links a {
	color: #bbb;
	font-weight: normal;
	font-size: 12px;
	text-transform: uppercase;
	text-decoration: none;
}

.bbp-row-actions #favorite-toggle a {
	text-decoration: none;
	padding: 0 3px 1px;
	color: #7c7;
	border: 1px solid #aca;
	background-color: #dfd;
	font-weight: bold;
	font-size: 15px;
}

.bbp-row-actions #subscription-toggle a {
	text-decoration: none;
	padding: 0 3px 1px;
	color: #7c7;
	border: 1px solid #aca;
	background-color: #dfd;
	font-weight: bold;
	font-size: 15px;
}
	
#bbpress-forums .bbp-forum-info .bbp-forum-content,
#bbpress-forums p.bbp-topic-meta {
	font-size: 13px;
	margin: 5px 0 5px;
	padding: 0;
	word-wrap: break-word;
}

	.bbp-topic-pagination a {
		font-size: 12px;
		line-height: 11px;
		padding: 1px 3px;
		border: 1px solid #ddd;
		text-decoration: none;
}

body.page .bbp-reply-form code,
body.page .bbp-topic-form code,
body.single-topic .bbp-reply-form code,
body.single-forum .bbp-topic-form code,
body.topic-edit .bbp-topic-form code,
body.reply-edit .bbp-reply-form code {
	font-size: 12px;
	background-color: #f0fff8;
	border: 1px solid #CEEFE1;
	display: block;
	padding: 8px;
	margin-top: 5px;
	width: 369px;
}

#bbpress-forums div.bbp-the-content-wrapper textarea.bbp-the-content {
	width: 100%;
	margin: 0;
	font-size: 15px;
}

#bbpress-forums div.bbp-the-content-wrapper input {
	font-size: 15px;
	padding: 5px;
	margin: 0 2px 0 0;
	line-height: 1em;
}

	#bbpress-forums #bbp-your-profile fieldset span.description {
		margin: 5px 0 0 20%;
		font-size: 15px;
		font-style: italic;
		float: left;
		clear: left;
		width: 60%;
		padding: 5px 8px;
		border: #cee1ef 1px solid;
		background-color: #f0f8ff;
}

	div.bbp-template-notice p {
		margin: 0.5em 0 6px 0 !important;
		padding: 2px;
		font-size: 15px;
		line-height: 140%;
}

.bbp-topics-front ul.super-sticky,
.bbp-topics ul.super-sticky,
.bbp-topics ul.sticky,
.bbp-forum-content ul.sticky {
	background-color: #ffffe0 !important;
	font-size: 1.2em;
}

#bbpress-forums .bbp-topic-content ul.bbp-topic-revision-log,
#bbpress-forums .bbp-reply-content ul.bbp-topic-revision-log,
#bbpress-forums .bbp-reply-content ul.bbp-reply-revision-log {
	border-top: 1px dotted #ddd;
	width: 100%;
	margin: 0;
	padding: 8px 0 0 0;
	font-size: 13px;
	color: #aaa;
}

.bbp-logged-in h4 {
	font-weight: bold;
	font-size: 1.6em;
	clear: none;
	margin-bottom: 10px;
}

#bbpress-forums h1 {
	clear: none;
	font-size: 2.1em;
	line-height: 1em;
	padding-bottom: 10px;
}

#bbpress-forums #bbp-user-wrapper h2.entry-title {
	font-size: 1.6em;
	margin: 0;
	padding-bottom: 10px;
	padding-top: 0;
	clear: none;
}

#bbpress-forums div.row-actions {
	font-size: 13px;
	visibility: hidden;
}

	div.bbp-search-form input,
	div.bbp-search-form button {
		font-size: 13px;
		padding: 2px;
}

	#bbpress-forums .bbp-forums-list li {
		display: block;
		font-size: 13px;
}

	#bbpress-forums div.bbp-reply-author .bbp-author-role {
		font-size: 15px;
		font-style: normal;
}
	#bbpress-forums .bbp-body div.bbp-reply-content {
		clear: both;
		margin: 10px;
		padding: 0;
}
	#bbpress-forums li.bbp-header,
	#bbpress-forums li.bbp-footer {
		font-size: 12px;
}

[crzyhrse]

Because I have no idea how Robin might get it otherwise, I’ll put this here as well, though the subject may call for a new thread? (although in a sense the subject here has also been about communication…)

In case you want to put this in the crib..?

Went looking for a way to change the submit button in bbpress, bigger, colors… Finally was able to assemble searched out bits and pieces from a couple places and with some experimenting accomplished my goal with this, put into the theme’s child style.css:

#bbpress-forums .submit {
background-color: #a0668d;
color: #FFFFFF;
float: center;
vertical-align: middle;
border-radius: 10px;
height: 35px;
width: 80px;
font-size: 18px;
}

I laud your efforts Robin, there really are not that I’ve ever found any organized simple ways or directions to make simple changes to simple and common things for us simple and common folks, neither for bbpress or wordpress… And a lot of what is there is old… The two links you’ve offered above are the best I’ve seen so far, and are apparently still works in progress…

No complaints here at all, just a recognition of the difficulties that are present in volunteer community efforts, especially one as widespread as all this is… WordPress is amazing, sort of like the whole world reaching to itself for shared community, open source community, so to speak…

[Robin W]

@crzyhrse

Hey thanks for your kind words, very much appreciated.

I have added you submit button at the bottom of the styling guide, and happy to add any others people will think useful.

I am trying to write a filters and actions guide – but keep getting diverted to other things, and a “creating a test site” guide as well, so hopefully will get these onto site in the next few weeks !

[crzyhrse]

You are welcome, and thank you… I’ll watch out for ways to help out as I bounce around the WordPress world… I’ll also offer that I have what seems to be pretty good test site set up, in case it is helpful…

[driftffkf]

You saved my day, crzyhrse, thank you:-)

[Cole]

The code has definitely helped me with the trials of trying to understand bbpress.
I was wondering if anyone knows how to edit the colour of threads that are locked?
I guess for my theme, Customizr, the text is grey over a light pink background which makes it very hard to see…
Any help pointing to the right direction would be most helpful

[Robin W]

the style for closed is

Layout and functionality – Examples you can use

[Cole]

Thanks for the reply Robin,

Though the the code stated in that article doesnt work with my theme/forum:
#bbpress-forums .status-closed, #bbpress-forums .status-closed a {color: #000 !important;}

I put it in my theme CSS and also tried a CSS plugin with no result.

[Robin W]

@oldkcole

can you send a link to a closed/locked topic, so that I can take a look

[crzyhrse]

And thanks here as well… I’ve been wishing the Subscribe toggle was over further to the right, and the necessary code for that is included on the page you’ve linked to above…

🙂

[Cole]

Oh my goodness!! It seems when I switched to firefox, it was fixed from grey to black!!
Thanks for the help Robin,
Much appreciated.