The powerful Layout Editor feature in our social networking software, allowing administrators to effortlessly modify page layouts and customize styles in a visual and intuitive manner. With this feature, admins can take full control over the design and appearance of their social networking platform, creating a unique and tailored experience for their users.
In this article, we will guide you how to enable Live Editor mode to start the current theme variant as well as general introduction about various options this feature is supporting
Let's start by logging into your site with Admin user
Open the Header Account menu on the top-right corner, click on the Editor Mode menu. You will see that web frontend will be switched to the Live Editor mode and the toolbox will be displayed.
You can disable Live Editor mode by simply clicking on the (X) button on the top of toolbox
Layout Editor Toolbox
Now, we will generally introduce you to the Layout Editor toolbox
View as Guests
Enabling this option to be able to configure/customize the Login page as well as viewing your site as Guests
For Screens
This tool provides options on the screen size to help you have visually check how your site display on different devices
Live Edit
This option is active by default when enabling the Layout Editor mode.
In Live Edit, you can edit/add/remove block at the current page by clicking on the Edit icon on certain blocks and do necessary modifications.
Edit Page Content
You can Add/Edit/Delete blocks to certain layout sections of the current page, including:
+ Header page
+ Top page
+ Side page
+ Main page
+ Subside page
Edit Site Content
Similar to Edit Page Content but applying blocks for ALL pages.
Edit Layout
With this feature, you can configure how a certain layout section (slot) displays or behave on the current page layout, such as scrolling behavior, width of layout sections (slots), etc.
In the below screenshot, we are editing the side section (slot) of the layout of Home page
Change Layout
You can configure the layout of the current page according to their preferences.
Edit Styling
Using Edit Styling option, you can have various tools to customize the fonts and colors of their site effortlessly and visually. With this feature, admins can easily tailor the visual aspects of the platform to align with their brand identity or create a unique and engaging user experience. From selecting the perfect font styles to choosing vibrant color palettes, admins have full control to create a visually stunning and cohesive platform that reflects their vision and captivates users.
Display Presets
In this section, you can configure defined displaying styles for blocks, items. Blocks can be configured to use these defined displaying styles when editing a block with the Live Edit tool
The screenshot below is the configuration of the displaying style with name "Account Setting"
You can then configure this "Account Setting" style when editing the block Account Setting in Live Edit
Toggle RTL
You can enable this option to see how your site displays in Right-to-Left (RTL) layout
Toogle Dark Mode
Dark mode offers a stylish alternative to the traditional light mode, reducing eye strain in low-light environments and providing a more immersive browsing experience. Experience enhanced readability, reduced screen glare, and a modern look with the Dark Mode.
You can use this option to check how your site displays in Dark Mode.
View Histories
The View Histories tool allows you to trace and review changes made in the Layout Editor. With this feature, you can easily track the evolution of their page layouts, view a history of modifications, and revert to previous versions if needed. By providing transparency and accountability, the View Histories feature ensures that administrators have a clear understanding of the changes made, enabling them to maintain consistency and make informed decisions about their platform's design and layout.
Discard Changes
The Discard Changes help you to discard any modifications or edits made to a page but haven't saved them yet. This feature provides a quick and convenient way to revert back to the original content or layout of a page, ensuring that unintended changes can be easily undone. With the Discard Changes feature, you can experiment and make adjustments with the confidence of knowing that they can easily discard any unwanted modifications and start fresh with the original content or layout.
We have introduced briefly about the Layout Editor on MetaFox. With this powerful tool, you'll be able to configure appearances, layout, and themes in your social networking software, creating a visually appealing and personalized platform that resonates with your brand and captivates your users. Remember to regularly review and refine these settings to keep your platform fresh and engaging.
Empower your community with a visually stunning and user-friendly social networking experience through effective configuration of appearances, layouts, and themes.