Understanding and Operating Modules

Overview

Modules are independent content blocks on your website, much like LEGO bricks. Covers, service descriptions, image galleries, FAQs, videos, and forms are all different modules. By arranging multiple modules sequentially on the same page, you can build a complete website.

Modules are not "pages." Pages are like chapters in a book, such as the Homepage, About Us, or Contact Us; modules are the paragraphs within those chapters. Each page can accommodate multiple modules, and the same module can be reused.

Before You Start

• Access your website editor by opening the Overview.
• Confirm you are editing the correct page; you can switch pages from the "Pages" tab at the top.
• Have your text, images, links, or descriptions ready, or be prepared to describe what you want AI to assist with.

Adding Modules

1. Open "Modules"

Click on "Modules" at the top of the editor. The panel categorizes available items into "Content," "Shop," and "Integrations," and you can use the search bar to quickly find specific modules.

2. Choose the Right Building Block

Before clicking a module card, review its preview and description to understand its purpose. For instance, to describe services, you might choose "Image and Text" or "Image and Text Card Gallery." To collect information, select modules like Google Forms, Typeform, or SurveyCake integrations.

If you're unsure which to choose, consult the "Complete Guide to Module Types." Selecting the wrong module won't break your site; you can always delete it and use another.

3. Select Insertion Method and Location

For modules with templates and AI generation capabilities, you'll be prompted to choose between "AI Assist" or "Edit from Template." "AI Assist" will ask for your requirements before creating a draft. "Edit from Template" inserts pre-designed content for you to modify later.

Other modules will guide you based on their function, allowing you to choose an insertion point, open a settings form, or request external service data. Follow the on-screen prompts to place the module at the beginning of the page or after an existing module. The system does not automatically add it to the bottom of the page.

Headers and footers are not found in this module panel; add or edit them in the "Layout" section.

4. Fill in Your Content and Save

Depending on the insertion method, the module might first insert a template or open a settings form on the right. After filling in the title, body text, images, buttons, or links, click "Add to Site" or "Save" in the form. For template modules, you can always edit them later by opening the form from the preview or "Layout" section.

Editing Module Content

You can directly click on a module in the preview or select it from the "Layout" list. The settings form on the right displays the adjustable options for that module; it's normal for different modules to have different editable content.

Common adjustable items include:

• Title and Body Text - Information visitors should know.
• Image and ALT Text - Upload images and provide descriptive text for them.
• Buttons - Choose a shared button or set a destination link.
• Layout - Adjust image placement (left/right), number of columns, aspect ratio, or title alignment.
• Visibility - Temporarily hide a module so it doesn't appear on the live site.

Sorting, Hiding, and Managing Modules

Open "Layout" at the top of the editor to see a list of modules on the current page. This is the quickest way to organize your content.

Drag to Reorder

Click and hold the drag handle next to a module to move it. Standard content modules can be reordered within the page. Headers and footers are fixed site frames at the very top and bottom and are not part of the middle content's sorting.

Show or Hide

Use the eye icon to toggle visibility. Hiding is useful for seasonal promotions, plans you don't want to reveal yet, or unfinished content. Hiding is not deleting; modules can be shown again later.

Duplicate Module

For copyable content modules, use "Duplicate" under "More Options." After duplicating, immediately modify the title, images, and links to avoid having two identical content sections on your live site. System-managed blog post lists cannot be duplicated.

Move to Another Page

If your site has multiple standard pages, you can select "Move to Another Page" from "More Options." Before moving, confirm the topic and order on the destination page. Once a module is moved, it will be removed from the original page.

Delete Module

Deleting a module removes it and all its content. Ensure you don't just need to take it offline temporarily; if so, "Hide" is a more appropriate option. Headers and footers cannot be deleted directly from the layout list but can be hidden or reconfigured.

Globally Shared Modules

Globally shared modules allow the same content to be used across multiple pages. For example, headers and footers are typically globally shared: changing the logo or contact information once updates all pages using that header or footer.

Some modules offer a "Globally Share" option in their settings form. Before enabling, confirm if this content truly needs to be identical across pages. When disabling sharing, the system will ask for confirmation to prevent accidental changes to other pages.

Mobile Preview

After creating modules, switch to the computer, tablet, and mobile preview modes in the editor. Kanorio adjusts layouts based on screen width, but very long titles, designs with text overlaid on images, or too many cards might still require manual simplification.

Tips

• Each module should convey one primary message, such as "What We Do" or "How to Book."
• Place the most important content towards the top of the page so visitors don't have to scroll far to find the next step.
• After adding images, always fill in specific ALT text, especially for product, portfolio, and venue photos.
• Before making major changes, hide or duplicate a module to test it before deciding whether to delete the original content.

Related Documents

• Complete Guide to Module Types
• Managing Website Pages
• Drafts, Saving, and Publishing