Kopage user interface and editor explained

After launching the Kopage website builder, you will enter the user interface where you build and edit your website.

The Kopage editor is designed so that you can make many changes directly and visually. Instead of editing your website's HTML code, you work with pages, content areas, texts, images, design settings, and additional modules.

In this guide, we show you the most important areas of the classic Kopage website builder and explain what you need them for.

Briefly explained: In the Kopage Editor, you manage the visible content and design of your website. Technical hosting tasks such as email accounts, databases, or general hosting settings continue to be managed via cPanel.

How do I open the Kopage editor? #

In CURIAWEB, you start Kopage directly via cPanel.

There you will find the Kopage Website Builder at the very top as the first icon.

If you haven't started Kopage yet, you can find the complete instructions at Launch Kopage Website Builder via cPanel.

Understanding the user interface #

For working with Kopage, you should first distinguish between a few basic areas.

In the website builder, you mainly work with:

• your pages and the navigation,
• the actual page content,
• Content Blocks,
• Design and Theme,
• images and files,
• apps or modules,
• as well as settings and other website features.

These areas interlock, but fulfill different tasks.

The website itself is the focus #

Kopage is a visual website builder. That is why you do not work exclusively in abstract settings pages, but rather edit the structure and content of your website using the editor functions provided for that purpose.

For example, if you want to change some text, you edit the corresponding content. If, on the other hand, you want to change the fundamental appearance of the entire website, you use the design or theme functions.

Practical Tip: Before making a change, briefly consider whether it affects only a single piece of content or the overall design of the website. This will help you find the right area in the editor much faster.

Pages and subpages #

One of the most important tasks in the Kopage Editor is managing your pages.

For example, a typical corporate website might consist of the following pages:

Home
About us
Services
References
Contact

Additionally, you can organize content hierarchically and use subpages.

For example:

Services
├── Consulting
├── Planning
└── Implementation

Kopage makes it possible to create subpages and arrange them via drag and drop, or to build submenus from them.

We cover the complete page and navigation management under Managing pages, navigation, and submenus in Kopage.

What are content blocks? #

Content blocks are a central component when building a Kopage website.

Instead of having to code every content structure from scratch yourself, you can use pre-made content blocks and then customize them with your own texts and images.

Depending on the desired structure, such blocks can contain, for example, different combinations of texts, images, and other elements.

This allows you to build a page step by step from individual content areas.

Briefly explained: A page is the parent area – content blocks form the individual content sections within this page.

Add content to a page #

When adding new content, Kopage provides various types of elements or content areas.

These include, among other things, prepared content blocks as well as apps and modules for special functions.

This allows you, for example, to treat a normal text/image section differently than a photo gallery or a contact form.

We explain in detail how to select, insert, and subsequently edit content blocks at Create content with Kopage: editing content blocks, texts, and images.

Move content blocks #

A page often consists of several content blocks.

For example:

Header / Introduction
        ↓
Services
        ↓
About the Company
        ↓
References
        ↓
Contact

The order of such content areas can be adjusted within the editor.

This allows you to change the structure of a page without having to recreate all the content.

Edit text #

Texts are among the most common contents of a website.

In the Kopage editor, you can replace existing texts with your own content and style them accordingly.

When editing, you should not only pay attention to the appearance, but also to a meaningful structure of headings and regular text paragraphs.

Avoid in particular designing entire pages with different font sizes just to make text look visually like a heading. Use the intended heading structures for this purpose.

Edit and replace images #

Existing images within a design or content block can be replaced with your own images.

Kopage also features tools for managing files and images.

This saves you from having to re-upload an image from your computer every time you use it.

We cover detailed image management, galleries, and sliders under Creating images, photo galleries, and sliders in Kopage.

What is the Files Manager? #

The Files Manager is used to manage files that you use within your website.

This applies in particular to images, but can also include other files required for your website.

A central file area is especially practical if you want to use the same media in multiple places on your website.

For files that visitors are supposed to download, we will handle the setup separately later at Manage files and offer downloads with Kopage.

Design and content are two different things #

This distinction is particularly helpful when working with Kopage.

Contents are for example:

Text
Images
Pages
Forms
Galleries
Blog posts

To Design on the other hand, include, for example:

Theme
Colors
Fonts
Header
Menu design
General appearance

For example, if you want to change the text „Welcome to our website“, you are editing content.

If, on the other hand, you want to change the website's basic font or color scheme, you are in the design section.

Theme and Design #

Kopage provides themes and templates as a starting point for the appearance of a website.

The design can be adjusted afterwards. This includes, among other things, various layout, menu, color, and font options.

This means you don't have to program the basic design of your website yourself using HTML and CSS.

We will cover the design in detail in the next article under Customizing Kopage template and design: Colors, fonts, header, and footer.

Important: Do not hastily change the entire theme if you only want to adjust a single text, an image, or a content block. Content and global design should be considered separately.

Apps and modules #

Not every function of a website consists only of text and images.

For additional features, Kopage offers apps or modules.

Depending on the function, this includes, for example:

• Blog,
• Photo gallery and slider,
• Forms,
• Newsletter,
• FAQ,
• Event calendar,
• Google Maps,
• Shop,
• and further extensions.

These modules add features to your website that go beyond a normal content block.

You can find an overview of the additional features later under Using apps and modules in the Kopage website builder.

What is the difference between a content block and an app? #

A content block serves primarily to structure and display page content.

An app or a module, on the other hand, provides a specific function.

Simplified:

Content Block
→ Content and layout of a page

App / Module
→ Additional website function

A text-image combination, for example, is typical page content. A contact form or a photo gallery, on the other hand, requires its own functionality.

Navigation and Menu #

Visitors can access the various areas of your website via the navigation.

Kopage also supports more complex page structures with subpages and multiple menu levels.

Pages can be organized accordingly and arranged in menus.

Clear navigation is especially important so that visitors quickly understand what content your website offers and how to reach it.

Understanding Drag & Drop correctly #

Kopage uses drag and drop in various places to organize elements.

For example, you can use this to rearrange pages or subpages, or to organize content within the designated structures.

Drag and drop means that you pick up an element with the mouse, move it to the desired position, and drop it there.

Practical Tip: For an existing website, first move only a single element and then check the result. Especially with pages and submenus, changing the position can simultaneously affect the navigation.

Responsive design #

Kopage creates responsive websites. This means that the layout can adapt to different screen sizes.

Nevertheless, you should check your website on different screen sizes after major changes.

For example, a content area that looks good on a large desktop monitor can appear less clear on a smartphone due to very long headings, unsuitable images, or an unfavorable amount of content.

We will go into detail about that. Responsive Design: Optimizing Kopage website for smartphones and tablets one.

Website Settings and SEO #

In addition to the visible content, a website has settings that are not always immediately visible to visitors.

This includes, for example, information for search engines and further technical or organizational settings.

Kopage offers options for individual meta tags on pages and other SEO features, among other things.

We treat search engine optimization separately under SEO with Kopage: Page titles, metadata, URLs, and search engine optimization.

Statistics and additional features #

In addition to the actual editor, Kopage also offers functions for evaluating and integrating website statistics.

Such functions are not part of the actual page structure, but can be helpful later to better understand the usage of your website.

We handle Google services, sitemaps, and statistical functions collectively under Google, Sitemap, Analytics and website statistics in Kopage.

The integrated help #

Kopage has built-in help functions. Therefore, if you get stuck on a feature within the editor, it is also worth taking a look at the help section available there.

The integrated help complements our CURIAWEB Knowledgebase: while we explain the use of Kopage within the CURIAWEB hosting environment here in particular, the help available directly in the builder can provide additional information on the respective function.

What should I learn first as a beginner? #

You do not need to know every feature of the Kopage website builder before you create your first website.

For starters, five areas are sufficient for now:

Pages
   ↓
Navigation
   ↓
Content Blocks
   ↓
Texts and Images
   ↓
Design

Once these basics are in place, you can add additional features such as forms, a blog, a gallery, multilingualism, or an online store.

What shouldn't I search for in the Kopage editor? #

Kopage is responsible for your website, but not for all functions of your web hosting.

For example, if you want to create an email account, manage a database, or change certain server-side hosting settings, you use cPanel for that and not the Kopage Editor.

Separation is fundamentally:

cPanel
→ Manage hosting

Kopage
→ Create and edit website

How do I go about editing an existing website? #

If your website is already online, you should make changes in a controlled manner.

First edit the desired area and then check whether the change only took effect where you expected it to.

For global design changes, you should also check multiple pages, as such settings can affect the appearance of the entire website.

Important: A change to a single content block and a change to the global theme can have completely different impacts. Therefore, before making major adjustments, check which area of the editor you are working in.

What happens after the user interface? #

Once you are familiar with the basic areas of the editor, the next step is to understand the appearance of your website.

This concerns templates or themes, colors, fonts, headers, navigation, and other global design elements.

Therefore, we continue with Customizing Kopage template and design: Colors, fonts, header, and footer.

Summary #

The Kopage Editor is the central workspace for your website. There you manage pages, content, content blocks, images, design, and additional apps or modules.

Pages form the basic structure of your website. Content blocks structure the content within a page, while apps and modules provide additional features such as forms, blogs, or galleries.

Design settings, on the other hand, affect the overall appearance of your website and should be distinguished from editing individual content.

Technical hosting tasks remain the responsibility of cPanel.

Once you have understood this fundamental separation between pages, content blocks, apps, and design, further work with Kopage will become much clearer.