Is it possible to customize the menu in forum and topic pages to delete the breadcrumbs altogether and only have a “Back” button option?

Wordpress Version – 4.7.4
bbpress – Version 2.5.12

Be Forbes Art Forum

[@robin-w Moderator 7 years, 7 months ago]

yes, install my bbp style pack plugin

bbp style pack

and go to

dashboard>settings>bbp style pack>breadcrumbs to set breadcrumb options or disable altogether

[@forums1234 Participant 7 years, 7 months ago]

Thank you! bbp style pack is a wonderful app. I’d previously downloaded it and styled my forum with it. It performed beautifully.

What I’m looking to accomplish is one navigation option only, “Previous Page,” or “Back.” I know that flies in the face of what is bbPress, but it’s vital to my interests. Is that even possible?

Thank you in advance.

[@robin-w Moderator 7 years, 7 months ago]

so

1.no breadcrumb – that’s easy to achieve

2. back button – yes but back to what –
a) forum->topic and then back to forum for that topic – yes do-able
b) forum->sub-forum and then back to higher forum – yes do-able
what else?

[@forums1234 Participant 7 years, 7 months ago]

a) forum->topic and then back to forum for that topic – yes do-able … that’s exactly what I need!

How do I achieve that?

[@forums1234 Participant 7 years, 7 months ago]

So that I’m clear … a forum on a certain page > topic on that forum > back to forum on that page.

[@robin-w Moderator 7 years, 7 months ago]

ok, closest without code would be :

1. go into

dashboard>settings>bbp style pack>breadcrumbs

Leave Disable all forums breadcrumbs UNTICKED

but tick disable on 1, 2, & 3

then put this into

dashboard>settings>bbp style pack>Custom css

.bbp-breadcrumb-forum {

  border-radius: 28px;
  padding: 7px 15px;
  text-decoration: none;
  background: #3498db linear-gradient(to bottom, #3498db, #2980b9) repeat scroll 0 0

}

.bbp-breadcrumb-forum::before {

content: "Back to ";

}

you may need to play with the background color to get it to suit your website – I’ve given you a blue gradient

[@forums1234 Participant 7 years, 7 months ago]

I’m amazed at how good it works! Thank you! Can I ask how to do one tweak? The button functions perfectly. However, the top 10% is of the button is cropped, and does touch the “Subscribe.” This too makes me happy because it’s perfectly spaced to get rid of the button altogether and “let ‘er rip with with the words “Back to XXXXXX”.

Is there a way for me to remove that styling? Which is a nice way of asking if you would, if I’m honest and transparent. I’m WAY happy even if the button is cropped because it satisfies my needs.

[@forums1234 Participant 7 years, 7 months ago]

oh, https://sterlingforums.com/forbes-art-forum/

[@forums1234 Participant 7 years, 7 months ago]

I just figured out how to do it. Thank you!

[@robin-w Moderator 7 years, 7 months ago]

great – glad you are fixed

[@laimonplus Participant 7 years, 7 months ago]

Morning! how can someone correct the error message “ERROR: Topic ID is missing” when someone is trying to create a new topic with a bbpress plugin

[@enacta2 Participant 7 years, 6 months ago]

@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;
}