How to Create a Website With Webador: A Step-by-Step Tutorial

Head to Webador using the link above and register with your email address and a password. Once signed in, the platform asks what kind of site you want to build: a standard website, an online store, or a blog. For this tutorial, select Website.

Give your project a name, then choose whether to start with pre-filled content or from scratch. Starting with pre-filled content is recommended—Webador will ask for your business category and a short description of your project, then generate a starter site with relevant text and images based on that input.

Next, select which pages to include. A homepage, contact page, and about page are pre-selected by default. You can also deselect the optional professional domain and mailbox during setup if you want to stay on the free plan initially.

After the page selection step, Webador shows a pricing screen and prompts you to choose a plan. You can continue with the free plan by clicking Continue with free. The editor will then open with your pre-filled site.

Don't spend too long picking a design here—the template can be changed at any point inside the editor without losing your content. Webador applies a new visual style across your entire site with a single click.

The Webador editor loads your site with all content visible in the centre panel. On the left sidebar you will find all available content elements:

• Text elements: titles, paragraphs, buttons
• Media: images, video, audio, photo albums, file downloads
• Structure: sections, columns, spacers, dividers, collapsibles, tables
• Apps: third-party integrations (covered below)

Your site is built in stacked sections, like Lego blocks. Each section sits below the previous one, and you can rearrange them by dragging. The mobile view toggle at the top of the editor lets you confirm how the site looks on smaller screens—templates are already mobile-optimized, so no manual adjustments are normally needed.

As soon as the editor opens, your site is live on a free temporary Webador domain. You can copy that URL and share it with others while you continue building.

Start at the top of the page. The header area holds your logo and navigation menu. You can display a text-only logo, upload a custom image logo, or combine both.

Below the header is the banner section. Click Edit on the banner to:

1. Upload your own images by dragging files from your desktop
2. Search Webador's library of over 2 million free stock photos
3. Set a slogan or headline directly on the banner
4. Edit the call-to-action button label and link it to an internal page, external URL, email address, or phone number

After making changes to any section, click Save to apply them before moving on.

Building Custom Sections

To replace or add sections, drag the Sections element from the sidebar onto the canvas. A popup offers pre-built section templates—welcome sections, about sections, FAQ sections, service sections—or an empty section you can build yourself.

Empty sections support columns. Add as many columns as you need, then drag content elements into each column individually. For example, an About Me section might use two columns: a portrait photo on the left and a headline plus text block on the right. You can drag the column divider to resize each side, and round or fully circle portrait images using the image shape controls.

Adding and Managing Services

For a services section, edit the existing template cards or add a new column and duplicate an existing card using the element dropdown. Delete cards you do not need. Each service item supports its own image, headline, description, and linked button.

Embedding Videos

Drag the Video element onto the page, select it, and paste in a YouTube video URL. Webador fetches and embeds the video automatically.

Webador includes an App element that connects your site to third-party platforms. Drag it onto any section to open the app panel. Available integrations include:

• Social media: Instagram photos and reels, Facebook
• Music and audio: Spotify, SoundCloud
• Bookings: Cal.com
• Accommodation: Airbnb listing snippets
• Fundraising: GoFundMe
• Shopping: Amazon
• Design: Canva
• Video: YouTube

For most integrations, you paste in your profile or listing URL and Webador pulls the live content automatically. This keeps your homepage current without manual updates. Note that this feature is located toward the bottom of the left sidebar—easy to overlook but worth exploring.

Click Pages in the editor menu to see all pages on your site. You can navigate between them or add new ones from here.

Contact Page

The auto-generated contact page includes a map, address field, phone number, email, and contact form. You can:

• Update the map location by typing a city or address into the location field
• Link your phone number text so it dials directly when tapped on mobile (use Insert link → Contact → Phone number)
• Link your email address to open a mail client automatically
• Edit the contact form to add extra fields such as company domain or date of birth

About Page

The about page may arrive mostly empty. Build it up by dragging in section templates:

1. A Meet the Team section with individual member cards
2. A Contact or office section with opening hours
3. A Photo Album or slideshow for office or location images

For each page, open Settings to rename the page and control whether it appears in the navigation menu. Pages you want only in the footer—such as privacy policy or legal notices—can be hidden from the main menu using the toggle in settings.

Inside each page's Settings panel you will find an SEO section. Fill in:

• Page title: Include keywords that describe your business or the page topic
• Page description: Repeat your main keywords in a natural sentence; this text appears in Google search results
• Social media image: Upload an image that displays when someone shares your URL on WhatsApp or social platforms; you can select one from the stock photo library if needed

Applying these settings to every page—not just the homepage—improves your chances of ranking in search results. Using an AI writing tool to draft keyword-rich descriptions can speed this up considerably. For a broader look at SEO fundamentals across website builders, the Wix SEO basics guide covers principles that apply generally.

To update the visual style of the entire site at once, go to Design in the editor menu. From there you can:

• Change the accent color using a hex color code to match your brand
• Click Change template to browse Webador's full template library

Switching templates applies the new look to all pages simultaneously—your content stays intact, only the visual presentation changes. Templates vary in layout style, typography, and color scheme, so it is worth previewing a few before settling on one.

Before publishing under a custom domain, check the global Website Settings panel. Confirm your site name, favicon, and any other general preferences are correct.

When you are ready to go live:

1. Click the publish or upgrade option in the editor
2. Search for your preferred custom domain
3. Select a paid plan that matches your needs
4. Complete checkout—your domain connects to the site automatically

If you plan to add an online store, that process is covered separately. You can find the full walkthrough in the Webador webshop tutorial.

The table below summarises the main plan tiers. Exact prices vary by region and are shown in your local currency during signup.

Webador highlights a discount when you choose annual billing—the pricing screen during signup shows this offer. You can start on the free plan and upgrade at any time without losing your content.

If you are comparing platforms before committing, the Jimdo step-by-step tutorial covers a similar no-code builder and makes for a useful side-by-side reference.

Webador is a solid choice for beginners and small business owners who want a functional, mobile-ready website without writing a single line of code. The pre-filled content generator, global template switching, and built-in app integrations reduce setup time noticeably compared to starting from a blank canvas. The free plan is genuinely usable for testing, and upgrading is straightforward when you need a custom domain or additional features.

If you are ready to get started, try Webador for free and work through the steps above at your own pace.