[vegetarianzen]

Hello Team bbpress

I am using the plugin bbpress. I want to customise that view of forum similar to http://www.veggieboards.com/forum/index.php this link.

I have created the child theme and add the css folder and archive-forums.php file in the child theme. I am not able to customise plugin using css only because I want to change the structure. If I change plugin core file then future update overwrite my code and when I am place the complete plugin in child then its stop working and page become blank.

Please give me the solution I am waiting your solutions.

My bbpress plugin Version: 2.5.14

Wordpress Version: 4.8.2

Thanks

[pmatteudi]

Hi there,

I’m writing because I have trouble to understand how templates are managed in BBPress (and wordpress I guess :)).
I’d like to have a specific template on the main forum page (the one displaying the different forums). And another template for the page displaying the different topics.

Currently in the wordpress page where I pasted the short code [bbp-forum-index], I call the template bbpress.php, which is presented in the bbpress codex (See example at the end of the topic).

But how can I create a specific template for my forum index (listing all my forums), for instance “forum-display.php”. And another template, listing my topics (for instance “topic-display.php”).

Maybe my file bbpress.php is not appropriate to do so ? or need to be customized a bit ?

NB : I’m using twenty twelve theme

I hope my question is clear,
Thank you for your help,
Pierre

<?php
 
/*
Template Name: index-forum
*/
 
get_header(); ?>
  
<div id="primary" class="site-content">
 
		<div id="content-forum" role="main">
	 
	 
		<?php
		/*
		Start the Loop
		*/
		
		while ( have_posts() ) : the_post(); ?>
		 
		 
		<?php
		/*
		This is the start of the page and also the insertion of the post classes.
		 
		Post classes are very handy to style your forums.
		*/
		?>
		 
			<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
			<?php
			/*
			This is the title wrapped in a header tag
			and a class to better style the title for your theme
			*/
			?>
		 
			<header class="entry-header">
			 
			<h1 class="entry-title"><?php the_title(); ?></h1>
			 
			</header>
			 
			 
			<?php
			/*
			This is the content wrapped in a div
			and class to better style the content
			*/
			?>
		 
			<div class="entry-content">
			<?php the_content(); ?>
			</div>
			 
			<!-- .entry-content -->
			 	 
			</article>
			 
			<!-- #post -->
			<?php endwhile; // end of the loop. ?>
		 
		</div>
	 	<!-- #content -->
	 	
	 	<div class="login-sidebar"><?php dynamic_sidebar('forum_login_zone');?></div>

</div> 
	<!-- #primary -->
  
<?php
/*
This is code to display the sidebar and the footer.
Remove the sidebar code to get full-width forums.
This would also need CSS to make it actually full width.
*/
?>
		 
<?php get_footer(); ?>

[denrocs]

Apologies, I realised this would help after posting 🙂
I’ve set up a temporary WP site on a personal server with the same theme, WP 4.7.5 and BBPress 2.5.13 at http://wp.createlabs.co.uk/forums/

At the moment, the links to Child Forum 1 and Child Forum 2 are just plain blue links with a comma after Child Forum 1 which separates them.
What I’d like to achieve is what I have put in the image link above? The bottom image is what I’m trying to get the links to look like (https://imgur.com/OKO9pZ8)

Instead of a plain blue link, alter the CSS to highlight each link so they look more like flat rounded buttons rather than standard links.

I hope that helps, please let me know if I can do anything else 🙂

[Anonymous User]

Hello guys I have bbpress on my website working like charm in all devices except mobiles when i open the forum with my phone it becomes mess. I was searching a lot for hours and i found some guys gave me custom CSS and i put it also no luck the issue still the same so if anyone have faced this issue before and solved it tell me how and it would be greatly appreciated.

This is my website forum :http://www.empirearticles.com/forum/

Thanks in advance,

[denrocs]

Hi all

I’m using the ‘Kleo’ WordPress theme on WordPress 4.7.5 and BBPress 2.5.13, and am trying to change the standard links to forums in BBPress as they are too difficult to read currently, specifically the ‘bbp-forum-link’ class.

What I’m trying to achieve is a background highlight on each link, with rounded corners, plus a little extra space between them using the following code:

color: #e4e4e4;
    background: #232323;
    padding: 1px 2px;
    margin: 2px 2px;
    line-height: 1.7;
    border-radius: 3px;

I have also put this image together of what I’m trying – https://imgur.com/OKO9pZ8

How would I put this code into the custom style.css file of Kleo to stylise these links, please?

No link to site as it is on my local host (MAMP PRO 4 if that helps)

Many thanks

[Divvy]

Hey,

Sorry, I know that this topic have almost 3 years old, but I have a solution.
I’m going to add here in case there is more people looking for the same.

I have found this code to place badges (achievements) under user avatar in bbpress:

add_filter( 'bbp_get_reply_author_link', 'my_append_badges_via_filter', 10, 2 );

function my_append_badges_via_filter($author_link = '', $args) {

	# Needed to get the user ID of the person intended to be displayed.
	$user_id = bbp_get_reply_author_id( $args['post_id'] );
	#Construct your output here.
	$badge_output = '';

	$achievements = badgeos_get_user_achievements( array( 'user_id' => $user_id ) );
	if ( !empty( $achievements ) ) {
			$badge_output .= '<div class="achievements">';
        foreach ( $achievements as $achievement ) {
						if($achievement->post_type != 'badges')
							continue;
            $badge_output .= '<div class="achievement achievement-' . $achievement->post_type . '">';
            //echo '<h2>' . get_the_title( $achievement->ID ) . '</h2>';
            $badge_output .= get_the_post_thumbnail( $achievement->ID, 'thumbnail', array('title'=>get_the_title( $achievement->ID ) ) );
            //echo __( 'Earned on: ', 'text-domain' ) . date( get_option( 'date_format' ), $achievement->date_earned ) ;
            $badge_output .= '</div>';
        }
			$badge_output .= '</div>';
  } 
		
	return  $author_link . $badge_output;
}

To make badge smaller I added this CSS code:

.achievement.achievement-badges{width:50px;}

But the code is not perfect. Because is not showing badges only under avatar, is also showing at:
– forums main page
– forum page
– above topic (information bar)

Would be great too if have:
– link in badges to archivements tab page

Can someone help me with this? 🙂

Thanks!!

[cyklokopce]

Hi, could you please help me, is there any CSS code to hide that line on the top of every forum page? It looks like this: Home > Forum > Topic…

I use bbPress 2.5.13 and wordpress 4.8.1

My forum is here: http://www.cyklokopce.sk/forums/forum/info-o-trasach-lokalitach/

And the line is Domov › Diskusné Fóra › Info o trasách, lokalitách…

Thank you!

Daniel

[cyprineman]

Hello everybody !

I’m using BBP Style Pack but there is only the option disable or enable the freshness on the overview forum.

That’s why I would like to find to way so the freshness appears but is not linked to any topic. CSS seems a good idea but I’m not good at idea.

Can anyone help me please ?

Thx

[Vinod Dalvi]

I can see the lines in your shared forum.

To reduce spacing you can also try using below CSS code.

.bbp-forum-info .bbp-forum-title {
    margin-bottom: 0;
}

[Vinod Dalvi]

It’s hard to help you without accessing your site but please try using below CSS code on your site as described here http://freewptp.com/how-to-use-custom-css-in-wordpress-site/ to reduce spacing.

#bbpress-forums .bbp-forum-info .bbp-forum-content {
    margin: 0 !important;
}

[Vinod Dalvi]

You can just hide it using below custom CSS code on your site as described here http://freewptp.com/how-to-use-custom-css-in-wordpress-site/

#bbpress-forums fieldset.bbp-form label[for="bbp_anonymous_website"],
#bbpress-forums fieldset.bbp-form #bbp_anonymous_website {
    display:none;
}

Or you can overwrite following bbPress template file in your child theme and remove website field code from it.

/bbpress/templates/default/bbpress/form-anonymous.php

[screenprotector]

Hi

In the French version of bbpress (the latest version), I want to change the header “Participants” (it’s “Voices” in the English version) to “Voix”. Could someone tell me how to do that please ?

Now, I’ve spend a lot of time researching and trying different things from CSS to PHP and I’ve gone back removed all the changes because nothing has worked so far. And I wanted to get things ready for any suggestions you guys might be able to supply. I am using DIVI 3 theme and builder.

For info, I have removed the side bar from the forum, and that is the only customization of bbpress I’ve left in place. I used custom CSS i found on this forum.

I’d appreciate knowing what to change and were to change it. I’m a beginner so I’d need fairly basic instructions, but I know where to put CSS into the Divi theme, and I know how to go into the PHP and how to create a child theme.

thanks in advance
best regards
SP

[darrennye]

After reading many forums, and trying many other themes, I found that all stock wordpress themes, had no issue with the right margin on bbpress content (and the submit button) from being cut off. Disabling all plugins also made no difference. So I went back to WooThemes and had another chat with a tech, and I explained all this to them. Nicole immediately knew what the problem was. I added the following to Canvas > Settings > Custom CSS:

/* ADDED FOR BBPRESS COMPATIBILITY */
fieldset { width: auto; }

Wallah!! That did it.

I asked her to please put this in the next WooThemes Canvas update, so others don’t have to spend days figuring this out.

[locutus1]

I’ve got bbp style pack already. Some things don’t work and it might be the fault of my host because I had another issue that was caused by my host. When entering a forum, “Create new topic” appears automatically. I would like to remove the automatic “Create new topic” message and create a “create new topic” button. bbp style pack makes the button but won’t remove the automatic message. Can anyone suggest another plugin that will let me do this?

Also, in some of my forums I would like to rename the button from “Create new topic” to something else but only in some of the forums. I’ve been told this can be done with CSS. Can anyone give me the code for this? Thanks.

[marioxxz]

Hey everyone,
I would like to remove the “Forums” tab from the profile menu, but don’t know how to do it.
I tried the css method and the PHP method.
NOTE: I’m using both BBPress and Buddypress, but the tab is generated by BBPress.

[locutus1]

Hi. I have 2 main forums both with sub-forums. If I go into any forum I see “create new topic” which is the default. That’s fine for the first main forum but I would like to change it for the 2nd main forum. I want all the sub-forums of the 2nd main forum to display something else instead of “Create new topic”. Is that possible? I’m guessing this might be possible with CSS. I’m dealing with many forums so do I have to specify every forum one by one or is there one command that can be applied to the 2nd main forum and it would impact every sub-forum? Thanks.

[daoist]

Hi,

I am very new to BBpress and any coding of anything. But I have edited wordpress through trial and error.

How do I start editing changing bbpress font easily? is there a plugin I can add? Please speak in simple terms – I have looked at the guides, but they are way too complex for me – and information overload.

I just want to play with the way the forum looks – and major part of it for me is font size and font type.

Please help.

[enacta2]

@robin-w I applied your CSS code for root and forum and it works well. But the top part of the box is missing. I tried to ‘fix’ the button so it’s whole, but I’m unable. I tried many different CSS lines, including the following, and none worked.

Can you please tell me how to make the button so it’s complete?

I don’t have a live site with bbPress. It’s only on my localhost mirror for now, until I get it all setup the way I want.

/* Set breadcrumb from topic to its forum with blue button */
.bbp-breadcrumb-forum {
  background: #6D84B4;
  background-image: -webkit-linear-gradient(top, #6D84B4, #3B5998);
  background-image: -moz-linear-gradient(top, #6D84B4, #3B5998);
  background-image: -ms-linear-gradient(top, #6D84B4, #3B5998);
  background-image: -o-linear-gradient(top, #6D84B4, #3B5998);
  background-image: linear-gradient(to bottom, #6D84B4, #3B5998);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  -webkit-box-shadow: 0px 2px 0px #000000;
  -moz-box-shadow: 0px 2px 0px #000000;
  box-shadow: 0px 2px 0px #000000;
  font-family: Arial;
  color: #000000;
  font-size: 11px;
  padding: 7px 15px 7px 15px;
  text-decoration: none;
}

.bbp-breadcrumb-forum:hover {
  background: #AFBDE1;
  background-image: -webkit-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: -moz-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: -ms-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: -o-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: linear-gradient(to bottom, #AFBDE1, #6D84B4);
  text-decoration: none;
}

/* Set breadcrumb prepended text for button from topic to its forum */
.bbp-breadcrumb-forum::before {
  content: "Back to the ";
}

/* Set breadcrumb appended text for button from topic to its forum */
.bbp-breadcrumb-forum::after {
  content: " forum";
}

/*-------------------------------------------------------------------------------------------*/

/* Set breadcrumb from forum to its root with blue button */
.bbp-breadcrumb-root {
  background: #6D84B4;
  background-image: -webkit-linear-gradient(top, #6D84B4, #3B5998);
  background-image: -moz-linear-gradient(top, #6D84B4, #3B5998);
  background-image: -ms-linear-gradient(top, #6D84B4, #3B5998);
  background-image: -o-linear-gradient(top, #6D84B4, #3B5998);
  background-image: linear-gradient(to bottom, #6D84B4, #3B5998);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  -webkit-box-shadow: 0px 2px 0px #000000;
  -moz-box-shadow: 0px 2px 0px #000000;
  box-shadow: 0px 2px 0px #000000;
  font-family: Arial;
  color: #000000;
  font-size: 11px;
  padding: 7px 15px 7px 15px;
  text-decoration: none;
}

.bbp-breadcrumb-root:hover {
  background: #AFBDE1;
  background-image: -webkit-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: -moz-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: -ms-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: -o-linear-gradient(top, #AFBDE1, #6D84B4);
  background-image: linear-gradient(to bottom, #AFBDE1, #6D84B4);
  text-decoration: none;
}

[PinkishHue]

1) Topic Type and Topic Status are only viewable to you/forum admins (aka keymasters), regular users do not see them

2) Wherever you add custom CSS (probably ‘Appearance > Customize’ in the admin menu’s), add this:

.bbp-forum-title {
  font-size: 18px; /* make this size whatever you prefer */
}

3) This functionality isn’t built in to bbpress but you could add another plugin to make this happen. Here is an old topic that might provide some suggestions for you: https://bbpress.org/forums/topic/rating-and-sorting-plugin/

Hope that helps

[Robin W]

may be theme rather than plugin related, but try

bbp style pack

to do styling

can’t see the forum (get no topics), but you can fix the sidebar with

#sidebar .bbp-login-form label {
  width: 100%;
}

you can put this into the custom css part of your theme or in the custom css of the plugin above

[blueshiningstar]

Thank you Robin !

I tried to reload the css, but no change.

I tried to change other settings:
Forums index styling is working. I changed the size of “3. Forum Headings Font”.

“Topic/Reply Styling – 5. Topic/Reply Date Font” doesn’t work.

So,“Topic/Reply Styling” doesn’t work.

I doubt below plugin.
“bbPress – Sort topic replies1.0.3”

[ourwritesorg]

Hi, I’m having an issue where post replies are going the full width of the screen. I can’t find what I should edit in which CSS file to fix this. Could anyone point me in the right direction?

Here’s an example: http://www.ourwrites.org/forums/topic/the-honest-act-2017/

Thanks!

[Robin W]

ok, try

enable the root breadcrumb in

dashboard>settings>bbp style pack>breadcrumbs

so that you’ve disabled breadcrumb home and breadcrumb current

Then in custom css have

.bbp-breadcrumb-root::before {

content: "Back to ";

}

.bbp-breadcrumb-forum {
display : none ;
}

[Robin W]

simplest way is to install my style pack

https://wordpress.org/plugins/bbp-style-pack/

navigate to

dashboard>settings>bbp style pack>breadcrumbs

disable breadcrumb home, breadcrumb Root, and breadcrumb current

This just leaves the ‘previous’ showing

then put this into the custom css tab of my plugin

.bbp-breadcrumb-forum::before {

content: "Back to ";

}

The breadcrumb will then become ‘back to xx’ with xx being whatever they came from

[Robin W]

put this into your custom css

#bbpress-forums div.bbp-topic-content img, #bbpress-forums div.bbp-reply-content img {
  max-width: 70%;
}