How to Build a Website in Convertri – Complete Step-by-Step Guide

Learn how to build a website in Convertri with our step-by-step guide. Follow this guide to create pages, add content, link menus, and publish your site fast.

While you may know Convertri as a high-speed funnel builder, it is also a powerful website builder capable of creating full-featured, professional websites.

This guide shows you how to build a website in Convertri, helping you create your own website that converts visitors.

You'll discover:

How to link your pages
The different ways of adding privacy policies
How to build a website from scratch in less than an hour

Video Tutorial:

In this in-depth webinar, Dan shows you how to build a website from scratch using Convertri.

What is Convertri?

Convertri is a cloud-based funnel and website builder focused on speed. Unlike traditional block-based editors (like WordPress or Squarespace), Convertri uses a "free-form" editor. You can move elements freely on the page, similar to design software like Photoshop, giving you complete creative freedom without needing a professional web developer.

Key features for websites:

Built-in web hosting: Fast, secure hosting is included, so you don't need a separate host.
Free-form editor: Pixel-perfect design control.
Mobile optimization: Automatically generates mobile versions of your pages.

How to Build Your Own Website: Step-by-step instructions

Step 1: Preparation and Setup

Create a funnel. Start by creating a new funnel from scratch (e.g., name it "Gym Website") and select a domain.

Plan your pages. Decide which pages you need (e.g., Home, About, Services, Testimonials, Contact).

Publish early. It is recommended to create and publish your pages (even if blank) first. You will need the published URLs to set up your navigation menu links later.

Instead of building a menu on every single page, use the Master Header feature so you only have to build it once.

Access Master Header: Go to the Funnel view → Click "Header and Footer" on the left → Click "Edit" on Master Header.

Create the background: Drag a panel onto the canvas, make it full-width, and resize it to the top of the page.

Add the Menu Element:

Drag the Menu element from the elements tray.
Add items: In element properties, click "Menu Items" and add names (Home, About, Services).
Styling: In properties, you can change the text font, background color, and "Mouse Over" color (e.g., text turns white when hovered).
Linking: Set the item type to "Link" and paste the URLs of your previously published pages.
Open in new tab: Toggle this on for external links, but keep it off for internal site navigation.

Apply to pages: Once the Master Header is built and saved, go to each individual page in your funnel, click "Page"→ "Headers and Footers" →Toggle "Use Header" to ON. You must republish the page for this to appear.

Step 3: Page Design & Layout

Organize images. Use the "Folders" feature in the image manager to keep assets specific to the website separate from other projects.

You can also use the built-in Pixabay integration for royalty-free images.

Hero section (Top of Page)

Add a background image.

Opacity layer: To make text readable over a busy image, add a panel over the image, set the color to black, and adjust the opacity (transparency) to a lower value.

Content sections. Use Panels as containers for each section (e.g., About section, Testimonial section).

Why? This is crucial for the mobile version. If elements are inside a panel, they stay grouped together when the site is converted to mobile view.

Global text styles. Set default text styles for the page so you don't have to change fonts for every new text box manually.

Step 4: Functional elements

Contact Forms:

Add input fields (First Name, Email, etc.) and a Contact Us Button.

Alignment: Use the alignment tools (Select multiple elements → Alignment → Distribute Vertically/Center Align) to make the form look professional quickly.

Configuration: Go to "Forms" → Select your Autoresponder (e.g., Mailchimp) → Map the fields.

Note: If your autoresponder isn't listed, use the "HTML Forms" option to paste in code from your provider.

Privacy Policy:

Hyperlink method: Highlight text → Click the Chain icon → Enter the URL → Toggle "Open in new tab" (to prevent users from leaving your site completely).

Download method: Create a button → Set Mode to "Download" → Upload your PDF file.

Step 5: Mobile Optimization

Check mobile view. Convertri automatically generates a mobile version, but elements can sometimes scatter.

The Panel Trick. If elements (like an image and its caption) are separated on mobile, go back to Desktop view. Place a transparent panel behind those specific elements to "group" them. When you "Re-mobilize," they will stay together.

Step 6: Clone for efficiency

Once you have a page with the correct fonts, header, footer, and basic layout, Clone that page to create the other pages (like About or Contact). This is faster than building each one from scratch.

Best Website Builder Practices for Professional Results

Desktop first. Always build the desktop version completely before tweaking the mobile view.
Use "Collections" for headers and footers. Since Convertri is page-based, you don't have a global header by default. Build your Header once, save it as a "Collection," and drop it onto every new page. This saves hours of work.
Search Engine Optimization Settings. Click Page > Meta Info in the top bar. Fill in your Page Title and Description. This is crucial for reaching your target audience and achieving a high search engine ranking.
Containment is key. Always put related text and images inside a transparent "Panel". This tells Convertri these items belong together, keeping your mobile view organized.

Common Mistakes to Avoid

Editing mobile too early. If you manually move items in the Mobile view, you break the "auto-remobilize" link. If you later change the desktop view, the mobile version won't update automatically.
Ignoring 404 Pages. If a user types a wrong URL, they see a generic error. A custom "404 Error" page will keep them on your site.
Overlapping elements. In a free-form editor, it's easy to stack items accidentally. Check your "Layers" panel to ensure text isn't hiding behind images.

Troubleshooting & Final Polishing

Mobile View Issues

If your mobile site looks jumbled:

Click the "Remobilize" button in the mobile editor to reset the layout based on the desktop view.
Verify that elements are properly grouped within panels in the desktop view.

Publishing

Click "Publish" in the top right.
For a professional look, connect your own domain (e.g., www.yourbusiness.com) via the "Account" settings rather than using the .convertri.com extension.
Visit your live URL to ensure all links and forms work.

Once live, use the HTML Element to embed pixels (Facebook, Google Analytics) for social media marketing tracking. You can also easily share your fast-loading pages on social platforms to drive traffic.

Summary Checklist:

Plan site structure (Home, About, Contact).
Create "Header" and "Footer" collections.
Build desktop pages using Panels for grouping.
Check Mobile view and adjust text sizing.
Add Meta Data (SEO) for every page.
Connect the custom domain and publish.

FAQs

Is Convertri good for building a full website?

Yes. While Convertri is famous for sales funnels, its website builder capabilities are excellent for creating fast-loading, multi-page websites. Because it includes web hosting and free SSL, it is often more cost-effective and faster than traditional platforms like WordPress for small to medium businesses.

Can I use my own domain name with Convertri?

Yes. You can connect a custom, free domain (e.g., yourbusiness.com) that you purchased from the Namecheap or GoDaddy website builder. Convertri provides simple CNAME records to point your domain to its servers, ensuring your site appears professional.

Is Convertri a free website builder?

Convertri is a premium platform, but it effectively replaces several other tools (hosting, SSL, funnel builder, page editor). It offers a 14-day free trial, allowing you to start a new site and test the editor features and built-in marketing tools before committing.

Do I need a professional web developer to use Convertri?

No. Convertri is designed for entrepreneurs and marketers, not coders. With its drag-and-drop editor, you can visually create a website. If you can use PowerPoint or Canva, you can build a site in Convertri without hiring a professional web developer.

How can I make my Convertri site SEO-friendly?

To rank on search engines:

Go to the "Page" settings in the top toolbar.
Select "Meta Info".
Fill in your Page Title, Description, and Keywords.
Use proper site structure by grouping content logically and using header tags (H1, H2) within the text elements.

Yes. You can easily add tracking pixels (like the Facebook Pixel or TikTok Pixel) to your site's header script section. This allows you to run social media marketing campaigns and retarget visitors who have viewed your website.

Start building high-converting pages and automate your email marketing today.

Get Your Free Trial