If you are unable to add content where you want to, it maybe that you need to unwrap a containing content block leftover from the previous version of Design Tools.
The Problem
You might run into a problem with new elements being bumped down the bottom of the page after upgrading content from legacy Design Tools to the new version.
This happens when the original content was wrapped in a content block, and it’s interfering with how new content behaves in the new version.
For example, it might prevent you from adding a content block inside an accordion panel, inserting it below the accordion instead.
How to Fix it: Video Instructions
Please Note: There’s currently a bug with the buttons within Design Tools that unwrap elements, so this is a temporary workaround that requires editing the HTML slightly. The instructions will be updated as son as there’s a fix (1-22-2024)
Video Transcript/Summary
This tutorial demonstrates how to unwrap a block in the design tools, a common issue encountered after upgrading from a legacy version to a new version. This issue often prevents inserting a block where desired, causing it to be pushed to the bottom of the page.
Situation:
- After upgrading to the new version of design tools, all content on the page may be wrapped in a single block. This wrapping can prevent adding new blocks within the desired context, like within an accordion panel.
Temporary Solution:
- Due to a current bug in the tools that would normally handle unwrapping, a slightly more technical approach is required.
Step-by-Step Guide:
- Access Advanced Editor:
- Go to the action toolbar on the side panel and open the advanced editor.
- If the advanced editor option is not visible, go to the three dots at the top, select ‘User Settings’, scroll to ‘Enable All Advanced Tools’, and check ‘Enable Advanced Editor’.
- Select the Content Block to Unwrap:
- In the advanced editor, locate and click on the content block that needs to be unwrapped.
- Ensure you select the right block, usually found at the top of the page. It is not the ‘H3’ heading, but the ‘div’ element right above it.
- Remove the Div Element:
- Delete the ‘div’ tag that says ‘Content Block’.
- After deleting, go down and click ‘Save Changes’. If a yellow panel covers the save option, close the panel first.
- Verify the Change:
- Once saved, try placing your cursor at the previous problematic spot. You should now be able to add the content block exactly where you want it.
Note:
- A future update will introduce tools within the editor to unwrap a ‘div’ more easily. This video will be updated once the bug is resolved and the process becomes simpler.