[desiamerican26]

Hi Robkk,

Sorry if I am creating confusion. I am providing a screenshot to what I am really looking for. Please consider that. The screenshot is from phpbb forums that someone use. I am wondering if we can have that under bbpress with CSS or any plugin.

Something like where it says “Font Size, Font Family” and right above Font Family there is an option to change color for Background or Font itself.

View
http://www.mediafire.com/view/opz9070g7wb1xz5/Untitled.png#

Download
http://www.mediafire.com/download/opz9070g7wb1xz5/Untitled.png

Thank You

[Robkk]

@tonydes i just forgot about this, do this first

pay attention to the started by image on the link to your forums in the above post.

add this for custom css ,

span.bbp-topic-started-by img {
width:20px;
height:20px;
}

does that change the size??

[Robkk]

first one more question , do you have custom css rules that you added already that include modifying images?

I don’t have a bbpress custom theme

okay create a bbpress custom theme now, add all the templates into your child theme.

more info here https://codex.bbpress.org/step-by-step-guide-to-setting-up-a-bbpress-forum-part-3/

lets work on this first http://revlanka.com/forums/forum/automotive-news/local-news/

since it has the issue on the notice , started by and freshness authors

now go to loop-single-topic.php and find

<span class="bbp-topic-started-by"><?php printf( __( 'Started by: %1$s', 'bbpress' ), bbp_get_topic_author_link( array( 'size' => '14' ) ) ); ?></span>

does it say 14 ?

if you dont want the started by author image remove make it where its like this

<span class="bbp-topic-started-by"><?php printf( __( 'Started by: %1$s', 'bbpress' ), bbp_get_topic_author_link() ); ?></span>

tell me if that works

I’m pretty novice at this, but does this mean that I have to edit from the style sheet?

all of the images that have issues (started by, notice, freshness), are sized in the templates in php rather than css .

[Robkk]

Is there some code generator and if not the plugin, I guess I can add it in “Style.css”

I just need when people posting in forums they have options to change color and size of font. I am unable to find something

you want a code generator , so that users have an option to change font color and font size, I do not know how to do this, so i cant help much here.

as for CSS I am not very familiar with that.

everything in the documentation says all about using css ,and how to, using firebug.

give me something specific to change the font size and color ,and ILL help you there.

[Robkk]

dont reply on the other topic you made

pretty much just copying the same thing from this

Finding .css style file

give me a link to your site

so i can see if its a special code in your template making the avatars huge
if its a .avatar css rule making all the avatars on your site big
or if i could find something else.

I’m pretty sure my theme does not use a conventional style sheet so I may have to edit this in the root folder?

thats not a good idea , it will be lost next upgrade.

[tonydes]

@Robkk Thanks for the response, but I moved the file to both locations, and edited the css but nothing worked. I used this code to resize the images:

#bbpress-forums div.bbp-template-notice img.avatar, #bbpress-forums p.bbp-topic-meta img.avatar {
width: 20px !important;
height: 20px !important;
}

I’m pretty sure my theme does not use a conventional style sheet so I may have to edit this in the root folder?

[lizbeck]

Thanks guys!

Robkk –

My wordpress setup is special situation. The Leaning Management System for the school I work for has it’s own version that it maintains with about 50 approved plugins (including bbpress)…I don’t have access to the FTP files unfortunately.

I was able to get most of the CSS working by copying and pasting the bbpress CSS into the custom CSS area in the WP dashboard. I shouldn’t have to do this, so I’m contacting the Learning Management System to report this possible bug.

Stephen –

You checked out the site after I had most of the CSS working. What Robkk saw was no styling at all…everything was listed with bullets like a regular < li > would be styled.

That said, your idea to create a child forum worked!

Thank you both for your help!
– Liz

[desiamerican26]

Hi robkk,

Thanks for your fast reply. I am not too good with CSS format.

I just added “Adding CSS” plugin and was trying to see some code to work with it, but unable to do it.

Is there some code generator and if not the plugin, I guess I can add it in “Style.css”

I just need when people posting in forums they have options to change color and size of font. I am unable to find something like and as for CSS I am not very familiar with that.

Thanks
Nik

[Robkk]

use css

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

bbPress Styling Crib

[Robkk]

#bbpress-forums fieldset.bbp-form textarea {
margin: 0 0 8px;
border: 1px solid #222;
}

try this css code

[tonydes]

Hi guys,

I apologize in advance, my skills are pretty minimal and I couldn’t find a solution to my problem. I just installed the forum on my site, but the pictures (avatars) for ‘last updated by’, started by’ are huge! Where do I find the.css file to edit them, and what code do I use?

Thanks in advance for the help!

[Robkk]

idk havent tryed editing the submit button for certain forms yet

but for profile its

#bbpress-forums #bbp-your-profile fieldset.submit button {
float: right;
}

for reply form its

#bbpress-forums .bbp-reply-form fieldset.bbp-form button {
float: right;
margin-top: -120px;
}

you can try that , other than that try doing what stephen said

You should look up some CSS resources and use your browsers ‘inspector’ to look at how to make CSS changes to your theme, use your favourite search engine to find these.

[Jimi Wikman]

It’s because you still have the sidebar column in the code.
You can try to chase it down or just hide it with CSS. @aussiestar14 you can fix your forum by doing this:

add a class to .content-wrap and set the width to 100% (I think if you do it directly on .content-wrap it will mess upp other pages?). Then create a class named .bbpress #sidebar-subsidiary and set display:none in it.

That way you hide the sidebar column and make the content stretch 100%

Hope that helps.

[Jimi Wikman]

I don’t know why, but for some reason I decided to punish myself on my latest project (ekatana.se if anyone wan to look) and I went ahead and installed BBPress along with Buddypress. Now I have done this a few times before in the last 3-4 years and it has always been a very painful experience.

This time was not so bad and I actually got most things working pretty much instantly with just som minor CSS changes. BBPress however is not really a forum in my opinion yet and I had to go through a ton of posts and articles with half baked solutions and snippets just to get anywhere near what I think a forum should look like and behave.

Now I admit that I am biased, having worked for many, many years with IPB which is the best forum out there and I have been working with forum software since 1996…

However, BBPress have really taken a leap forward in the last few years and I look forward to see it go even further, in fact i hope to be able to lend som assistance in the UX and design department should it be needed. Since I am a systemtester as well, I hope to be able to break stuff on a regular basis as well 🙂

I really look forward to the forum grouping I see is already pretty much done and which is working just fine on my forum as far as I can tell. When time permit I will give more input into what features I see as necessary, both in the frontend and the backend and util then I just want to say that I am far from impressed, but I see hope for BBPress.

Keep up the good work!

[Robkk]

I will say there is a bit of a gap now, between the forum, and the title of site/description, would you know how to make that smaller?

try this, but if you see some weird looking css throughout the rest of your site in that area remove it, Or try to find an alternative.

.content {
padding-top: 5px !important;
}

search forum and topic icons in bbpress search then go from there

[Robkk]

they use , the bbpress shortcode for the new topic form.

[bbp-topic-form] – Display the ‘New Topic’ form where you can choose from a drop down menu the forum that this topic is to be associated with.

more shortcodes https://codex.bbpress.org/shortcodes/

create a page , lets say “new topic”

add that shortcode, and save

place an html link in loop-forums.php

the link should look like

<a href="http://sitename.com/new-topic/">New Topic</a>

style it with css with

a.bbp-new-topic-button {
background:#009375;
color:#fff;
}

[Robkk]

Hi Robin, so you don’t like feedback here? I seemed to have hit a sensitive nerve with you! I did try to make some positives as well as what I thought were honest concerns. I looked on the support forum and there were also other older threads with no replies, not just mine, If you can’t take feedback about what you do then I’m sorry to say you will never learn or grow. As for it been free, well I’m not going to go into a debate about that. But I believe there would be ways to make money out of this like here: http://www.packtpub.com/bbpress-complete-comprehensive-guide/book

bbpress is open source , i dont think the community is going to try to make money off of something thats open source, thats probably why there is no ads on this site too.

that book was just written by some guy thats not really affiliated with bbpress. Its like if i myself made a book of all that i know from reading all the documentation. (i dont work for bbpress, i am a volunteer )

topics with no replies, people are busy , there is like only 2 official people that check out this forum occasionly , robin and stephen

jjj might check out the forums though but he also works on wordpress core i think i am not sure.

Other than that the others are volunteers like myself , which i am helping out people because robin helped out me , idk i feel i got to repay them somehow haha

Your own layout looks promising, I hope it goes well.

im on the fence if i should put it on github or not, i feel like i dont want people jacking my forums style sometimes

As for examples

Just any thing that looks like a forum:

bbpress looks like a forum ,its just a really simple one.

which is great because not all people need extravagant features, but if they want they can add wordpress plugins, and also custom functions that you may find on this forum.

if we compare features in bbpress compared to other forum software there is not much of a difference.

All i can see that is different is shortcodes on bottom, which i showed a user how to do in a topic before. using bbpress forum statistics shortcode, and the do shortcode function.

forum icons, which is possible there is a function somewhere if you search this forum.

category and hierarchy layout , if you search the bbpress trac people have shared how to do this if users want that specific layout.

ip boards topic sorting you can create something similar using bbpress views in simple html links.

and the rest is just styling with css, in the documentation it explains… go to this https://codex.bbpress.org/step-by-step-guide-to-setting-up-a-bbpress-forum-part-2/

[Robkk]

but not too simple actually

css is actually the easiest in my opinion

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

[eddie01001]

I solve the problem
I find in my child css
#bbpress-forums div.bbp-forum-content,
#bbpress-forums div.bbp-topic-content,
#bbpress-forums div.bbp-reply-content {
margin-left: 20px; // here what you need change it was 130
padding: 12px 12px 12px 0;
text-align: left;
}

[peter-hamilton]

OK, the way I see it is like this.

There are two avatars cause the forum/topic list has two elements that use an avatar.

1. the avatar from the poster of the topic, this avatar is there with the topic title.
2. there is in the freshness an avatar displayed for the reply poster.

In between the topic title and topic freshness there is an element that handles reply, post and/or voice count.

This makes three elements inside this forum list, two with an avatar, hence two avatars.

The list itself is situated in an UL (unordered list in a bbpress php file called loop-single-reply.php).

This ul has three LI (list) elements inside it, the first topic-title, second topic-count, and third topic-freshness.

btw, you have a cache plugin that prevents s to check your CSS in chrome etc.

This line of code will put the avatars where they need to be, you just add this to your themes CSS file, and remove the display:none from your .avatar CSS.

#bbpress-forums li.bbp-body ul.topic {
border-top: 1px solid #eee;
overflow: hidden;
padding: 8px;
float: left;
width: 100%;
}

Here is how it looked for me after adding this.

good luck
Peter Hamilton

[andys27]

I’ve just started using bbpress and I like the simplicity of it. I’ve been trying to customize it to my need for the past 2 weeks (yeah, I am slow). This is something that I came up with that I’d like to share with the community since I’ve learned so much from over here. And I am really proud of myself for coming up with this since I usually suck at php and css.

If you want a new topic, or new reply button on top of your topics list ore replies list.
You can just add this code to your functions.php and you are good to go. This way, it will only show a “new topic” link if the user is logged in. If they are not, then it’ll show a text saying “to post a new topic register or login”. Of course, you can change the code to whatever you want. And make sure you change the links to your login and register pages. And you can add class to customize the text with css.

//function to add new topic thread
function bbp_login_thread_link() {
if ( is_user_logged_in() ) { ?>

<a href="#new-post">Create a new thread</a>

<?php }

else { ?>

<p> To create a new thread <a href="http://yourwebsite.com/login">login</a> or <a href="http://yourwebsite.com/register">register</a></p>

<?php }

}

add_action( 'bbp_template_before_single_forum' , 'bbp_login_thread_link' );

//function to add new reply thread
function bbp_post_reply_link() {
if ( is_user_logged_in() ) { ?>

<a href="#new-post">Post a Reply</a>

<?php }

else { ?>

<p> To post a reply <a href="http://yourwebsite/login">login</a> or <a href="http://yourwebsite/register">register</a></p>

<?php }

}

add_action( 'bbp_template_before_single_topic' , 'bbp_post_reply_link' );

I am hoping you guys can add this to this article which has examples of layout and functionality. That article helped me immensely and I will feel honoured to have contributed to it.

[Robkk]

@gogitossj34 this code is what your problem is, it changes the size of all avatars in your site.

.avatar {
width: 60px;
height: 60px;
margin: 0 0 1.5rem;
border: 1px solid;
border-radius: 50%;
}

the distorted avatar image is because there is a function in your templates that is used to call the user avatar , and in the function it is proportioned to be at 14px X 14px. your css code stretches this out 14px avatar to be 60px X 60px causing a distorted avatar image.

to remove the distorted image just add this to custom css

.avatar-14 { display: none !important; }

it should work

i dont know what exactly is causing your double avatars though , i would guess that it is the “started by” avatar like how these forums have.

But i am not for sure.

If you want to keep the avatar next to freshness only tell me

I’m not a programmer or such so I cannot understand what you’re saying

im no programmer i had practice with trial and error, and all this is basically common sense

[peter-hamilton]

Site was offline due to problems at host servers, back online now and made few CSS adjustements.

BBFacelook

[Robkk]

3. My main beef with bbPress is the way categories and forums are shown. Forums are placed under categories like sub-forums which looks un-forum like to me.

bbpress has worked on this , https://bbpress.trac.wordpress.org/ticket/1958

since you commented on my layout topic too, ill tell you which one i used , which is

https://bbpress.trac.wordpress.org/timeline?from=2014-03-04T09%3A51%3A07Z&precision=second

i copied all of his files from pastebin and used it as my own. then i style with css

But another way to the have the layout lets say like phpbb , is download Lynqs starter theme.

https://github.com/EpicWebs/bbPress-starter-theme-epicwebs

3. can you give an example of how you would like it to look? doesn’t need to be a bbpress site

heres an example of what he is talkingn about robin

http://thefastdiet.co.uk/forums/

http://teamoverpowered.com/forums/

[Herophantom]

Thank you.

I would also like to update, so after reading some more last night, I found the documentation on the short codes. I tried making a dedicated page and using the short codes to load the main forum index. Now this works in almost every way, including using the proper sidebar that I want, however, the search option at the top is now off set, with the button below the bar instead of next to it. I have been fiddling with the CSS for awhile to see if I can get it to align properly, but so far no luck. And now, even the page provided by the bbpress plugin is doing the same thing. So maybe I messed something up, or maybe I’m just missing something, but if I can get this solved, I will have a perfect solution.