Update on 30 Jul 2023: This is now included in the plugin. No need to manually add the code in this tutorial.
I built the Bricks Navigator to be able to quickly edit any Page or Template directly with Bricks in a single click besides being able to navigate to various Bricks settings pages and it works great both in the WP admin and on the front end except in Bricks editor pages.
That changes today.
Just add this in the child theme’s functions.php:
// Show WP admin bar in Bricks editor.
add_action( 'init', function () {
// if this is not the outer frame, abort
if ( ! bricks_is_builder_main() ) {
return;
}
add_filter( 'show_admin_bar', '__return_true' );
} );and this at Bricks → Settings → Builder → Builder mode (Custom):
/* --- Show WP admin bar in Bricks editor */
body.admin-bar #bricks-toolbar {
top: var(--wp-admin--admin-bar--height);
}
#bricks-structure {
top: calc(40px + var(--wp-admin--admin-bar--height));
}1000s of clicks saved – guaranteed.
21 comments
Ryan
Is there a way to pack the custom builder mode code into a plugin?
Sridhar Katakam
You can use WPCodeBox.
Ex.: https://brickslabs.com/how-to-hide-bricks-preview-element-actions/
Ryan
Awesome, thanks!
Charlie
Hey Sridhar, I installed the plugin. Thanks. But I am having an issue in that it covers up the top of the left sidebar. Can't see the search bar or conditionals etc. I removed the plugin and added the code and changed the last line "top: 40px" to 60px and it looks perfect. I don't see a way to change that in the plugin. Wondering if a recent Bricks update changed things?
Sridhar Katakam
I've update the CSS in this tutorial as well as the Navigator plugin to fix the issue.
Charlie
Awesome! Thanks much Sridhar!!
Rick Cimmino
Perfect, in a previous comment I wrote that I didn't see any changes but I was wrong. Works great and was really needed. Thank you Sridhar Katakam
Amanda Lucas
Really useful, thanks for this.
Maya Nikolova
Hey guys, how was the white space issue solved? I am seeing it in the latest version of Bricks as well. Thanks!
Sridhar Katakam
Just tested with Bricks 1.6.1 in Chrome and it's working fine here.
Try doing a hard refresh.
If the problem persists, please send your WP login via https://brickslabs.com/support/.
Dustin Dauncey
This doesn't appear to work with 1.5.7 or 1.6 versions of Bricks.
Sridhar Katakam
Just tested in Bricks 1.6 and it's working fine here.
Try doing a hard refresh.
Sinisa Sinjori
Hmm, it doesn't work in Bricks 1.5.6. Or maybe I added PHP code the wrong way (I added it by Advanced scripts - tried to add in several places, but nothing worked - admin_init, admin_footer, etc...).
Siger Smit
I have exacly the same... Disabeling the PHP make the white space disappear.
https://drive.google.com/file/d/1vhNQHYggg_cl7uzAoK54hMCTJW8G4QUV/view?usp=sharing
Sridhar Katakam
Can you provide your WP login via https://brickslabs.com/support/ along with a URL of this post?
Solomon
Great! I was missing this and started searching for ways to add it and a day later you posted it in the FB group.
Nice work as always—Thank You!
Martin Sauter
Interesting idea, but does not quite work for me (Bricks 1.4): There is a white gap between the WordPress admin bar and the Bricks bar.
Nordie
I have the same issue in 1.4.0.2
a white gap between the WordPress admin bar and the Bricks bar
SRD
Not trying to be a pain but you did install and activate the Bricks Navigator plugin first correct? I made this mistake and had the white space, once I activated the plugin the space went away and everything worked correctly.
Sridhar Katakam
Can look into it. Need WP login.
https://wordpress.org/plugins/temporary-login-without-password/
hello@brickslabs.com
Sridhar Katakam
I tested in 1.4.0.2 and it looks fine.