Page Builder AMA Recap: Your Answers to All Things Page Builder
If you weren’t able to make it to our Page Builder AMA (Ask Me Anything) event on July 28, 2022, we want to make sure you’re able to check out the questions and answers you missed! We’ll be holding more of these in the future, so be on the lookout for information about how to get involved.
This AMA event was hosted by several BigCommerce employees across various departments and teams to answer questions from our Developer Community about app development on BigCommerce. The hosts were:
- Heather Barr, Developer Community Manager
- Jordan Ardlt, Senior Product Support Engineer
- Erik Christensen, Manager — Merchandising, App Experience and Headless
- Jayanth Kanive, Lead Software Engineer
The Q&A
Are there plans to remove the arbitrary 10.5px padding that automatically gets added to the left and right side of all new columns?
We don’t currently have specific plans to remove this default padding, but we will be releasing the ability to create custom layouts that can be tailored for specific use cases/themes, which would allow you to create a layout that doesn’t require customizing every time you drop a new one on the page.
In general, the layout widget was designed to play nicely with Cornerstone specifically, which includes this padding. Allowing custom widgets tailored to other themes or use cases is a priority for this reason.
Are there plans to improve the default Page Builder widgets (for example: ADA compliance & not causing pages speed issues)?
Yes, these are things we very much want to improve over time. The Image widget in particular we want to improve to better deal with responsive images, for example (though not limited to that widget).
Are there plans to integrate the data for the widgets into the theme so you can safely store and easily transfer it?
We are exploring some possibilities here, yes. One concept we are exploring is allowing a theme to define a default arrangement of widgets that it comes with, and it’s possible we could make downloading a theme take a “snapshot” of the current widget layout and bundle it with that theme. Can’t guarantee any specific solution yet but it’s certainly something we are thinking about.
Is there any way to get the Stencil context in Page Builder? If not, are there plans to add it?
There is not currently a way to do this, but this question has come up a lot (including from other internal teams), so it is definitely something we want to add, though I don’t yet have a timeline to share.
However, there is a potential workaround for this! You can use the handlebars {{inject}} helper to add your Stencil context variable into the jsContext, and from there you can expose the stencil context to the window, like so:
const jsContext = JSON.parse({{jsContext}});const { myVariable } = jsContext;window.myVariable = myVariable;
If you add that code to the page you need the context for, you can then access it in your widget through window.myVariable. This would still require you to add the content via JS in your widget (instead of in the HTML), but it works!
Can we have a way of reproducing Layout via API, or alternatively a way to duplicate pages?
Yes! We are actually deep in development on opening up an API for Layouts which would allow both of these things. It is currently in progress.
Can we have a way to save Page Builder widgets to the theme so they transfer with it? I usually build out new themes on a sandbox and none of the Page Builder widgets copy over with the theme when I import it to the live website, so I have to create them all on staging for the client to review and then recreate them all on the live website.
This is a feature that I’ve thought of a few times myself! We actually do already have a feature request ticket created for this functionality, so our engineers are aware of the desire.
In a previous AMA we answered a similar question — it is something we are considering. You can check out the original question and answer here.
Will there ever be an auto-save function for Page Builder. Sometimes I forget to save and then get logged out and lose all my work.
I hear you and it’s definitely something we’ll consider. One thing holding us back here is that currently we’re not super happy with how difficult it is to tell exactly what changes you’ve made to your widgets in the current saved state vs. what’s live on your site, and making the saves happen automatically could potentially make this more of a pain point. The feedback is appreciated though, we’ll give it some thought.
Is it possible to add the ability to use layouts within layouts?
We’ve talked about this, but no specific plans yet. We’re hoping the ability to create custom, more complex layouts helps a bit with some of the same use cases.
Are there plans to add the ability to utilize hidden fields within arrays? It would be useful for things such as building accordion widgets, where currently the only option is to use an HTML field.
Interesting use case! We hadn’t specifically planned on doing this, but we do want to refine our widget schemas in general (removing some of the more confusing legacy concepts like “tabs” that are no longer represented visually in the UI, among other things), and we’ll definitely consider this in doing so.
Will you be introducing a Heading Widget (h1 — h6), to enable structured text content for pages?
We aren’t planning to do this exactly and will probably just keep the Text widget. However, we do have a project called Global Styles that will allow widgets to better absorb styles from the theme, allowing you to set a widget’s typography to e.g. Header 1, which is defined by the theme, rather than having to set each widget’s styles individually. The specific names and number of the global styles aren’t fully specced out yet, so it may not end up being “Header 1”, but I believe this would at least partially address this need.
Are there any plans to release any kind of responsive settings? Currently styling attributes are fixed regardless of device.
We are hoping that the Global Styles feature (described in the linked message) addresses a lot of this need, so we’ll probably start there and see if the need remains after that. We already consider there to be an excessive amount of work required to customize every single widget on your page rather than having a way to set the styling globally, so we’re a bit leery of potentially tripling the number of settings before addressing that issue.
Do you plan to add the functionality for HTML widgets to accept handlebars so we can use theme elements in them?
I’m not aware of any current plans to add support for handlebars in HTML widgets, but this would definitely be an awesome feature to have. I think it would be worthwhile to submit a feature request for this so that our engineers can look into it.
However, there is a workaround for this that could be implemented. You can use the handlebars {{inject}} helper to inject it to the jsContext, and if you add the jsContext to the browser window like so:
window.jsContext = JSON.parse({{jsContext}});You would then be able to access your injected handlebars variable in your HTML widget with JavaScript.
More Information
For more information about Page Builder, head over to our Page Builder page on our Developer Center! Here, you’ll find information and documentation about all things BigCommerce.
If you have more questions, comment on this post or tweet at us @BigCommerceDevs!
