Website sections serve as a bridge between your clients and your company, and they display valuable information, ensuring efficient interaction. They play an important role on your website because they guide visitors to the information they need quickly and easily. Boxmode’s ready-to-use sections are of great value and usefulness: they help to build a site quickly and efficiently using pre-designed blocks. This will save you plenty of time.
Seeing how important these features are, Boxmode created ready-to-use website sections that appear under Sections in the working canvas.
Boxmode contains a range of elements in Sections. Click the + icon on the left side of the editor, tap Sections and you will see the categories cascading from the Sections tab:
- Welcome – Create an appealing welcoming page that would demarcate you among competitors.
- About us – This is a section where you can give visitors more details about your company, its history, team members, values, and goals.
- Features – This is a place where you can describe your product/services, focusing on what problems they solve.
- Testimonials – This is the place to post your visitors’ reviews and feedback.
- Contacts – Provide visitors with multiple options to get in touch with you (emails, phone numbers, physical addresses).
- Banners – Upload personalized banners to promote your business.
Adding a section
Choose one of the available section forms and drag it to the canvas (the sections menu will automatically disappear). Drop the form in the desired area that will be highlighted to better represent its location.
Please note: To cancel the process, press Esc on your keyboard when moving the section.
Moving the section
Once you’ve added the section to the page, you can relocate it to the place you see fit. Click on the item and you will see its controls. Tap and hold the “crossed arrows” icon and drag the item to any other location on the page. Drop the element on the highlighted area of the canvas.
Resizing the section
To change the size of the section, simply tap on it and grab one of its anchor points, moving up/down or left/right. Shape the desired form.
Editing the section
The section itself consists of Basic elements like Container, Paragraph, Image, and widgets like Maps, Forms, etc. Each of them can be edited as a separate component. To learn more about widgets, read this article.
You can also add or remove elements in the section and enrich it with your own content. Tap on the inserted element you see on the section to bring out its controls.
For example, if you wish to edit a text section, tap on the “crossed arrows” icon to relocate the text block. Tap Edit to format the text according to your needs. You can change the text:
You can also link the text to other pages of your website and make it open in the new tab if you need. Tap the “trash bin” icon to delete the text.
Once you’re done with the text formatting, tap on the web page section you’ve added to call out its controls. Click on the “brush” icon and the Design control will appear.
This is the place where you can change the colors of the section and add shadow and borders to it. The second “color” option you see on the panel allows you to change the background color.
Switch to the image item on the design panel if you want to add an image to the background and adjust image settings.
Here you can change the section’s background image by choosing one from the Unsplash photo platform’s library directly in the editor (click From library) or by uploading one from your computer (click From computer). Next, you can customize the image depending on your needs:
- choose its position in the browser: click parallax or scroll;
- choose format: title or no-repeat;
- edit alignment: vertical/horizontal;
- change color scheme;
- add border/shadow.
Close the Design window. Tap on the “trim” icon to format the image. You can pick the Fit or Fill option and move the slider depending on how you want your background image to look.
Tip: Insert links to parts of the website page from your site’s menu so your visitors can be redirected there with a single click. To do this, tap on the section to bring out its control and click on the link item.
Deleting the section
To remove sections of a web page from the canvas, tap on the section to bring up its controls and click the “trash bin” icon.
Try the section functionality yourself!