BUILD YOUR WEBSITE

Create a Website WordPress From structure until ready for use

Learn how to structure your website. Set Astra Theme Design with Elementor Make it responsive and prepare the website to be ready for actual use

Start creating a website → View Launch Checklist
✓ Astra + Elementor ✓ Mobile Responsive ✓ Follow these steps.
yourwebsite.com
E
01 · Blueprint Structure your website 02 · Build Start creating a web page 03 · Responsive Adjust Tablet & Mobile 04 · Launch Check before going online
WEBSITE BLUEPRINT

Before designing, start with the structure.

A good website shouldn't start with choosing colors or widgets. But it should start with the purpose, content, and user journey.

01

Website goals

Want users to read information, Contact us, book a service, Buy products or learn about content

02

Paste Sitemap

Determine what pages are required. And how should each page be connected?

03

Place Layout

Order Hero, Content, Benefits, CTA and Footer Before starting the actual design

04

Know the user

Design text, buttons, and structure Suitable for people who actually use it.

05

Prepare Content

Prepare a topic message Images, logos and contact information Before starting to create a page

06

Set a CTA

Every page should have what it needs. Clearly let the user continue.

BUILD WORKFLOW

Steps to create a website

Sorting since theme setting all the way to creating pages and launching the actual website.

01
ASTRA

Set the theme and main structure

Set Logo, Header, Footer, Container Width, Typography and basic layout with Astra

→
02
PAGES

Create necessary pages

Create Home Page About Us Services, Contact Us, and Articles Page Before going into design details

→
03
ELEMENTOR

Create Layout with Container

Learn Container, Flexbox, Gap, Padding, Width and widget placement

→
04
DESIGN

Place Design System

Set Font, Heading, Main Color, Button Color, Border Radius and distance to the same standard

→
05
RESPONSIVE

Adjust Tablet and Mobile

Check the font size, Column, Padding, Pictures and buttons in every section

→
06
LAUNCH

Check before opening the website

Test link, Form, Email, HTTPS, SEO, Mobile and speed

✓
WEBSITE PAGES

What pages should a general website have?

There is no need to create dozens of pages. Let's start with the home page that users actually need to use. Then add content later.

01
Home Introduce your business, highlights, and main CTA.
Required
02
about us story trustworthiness and brand information
Recommended
03
Service/Product Describe in detail what the website offers.
Required
04
Contact Us Form, Email, Telephone and contact channels
Required
05
Article/Blog Content for SEO and user information
SEO
06
Privacy Policy Website Privacy Policy
Legal
DESIGN WORKFLOW

What are Astra and Elementor used for?

Separate duties clearly It will make creating a website easier. and reduce duplicate settings

THEME LAYER

Astra Theme

Used to control website level structure. such as Header, Footer, Global Layout and Typography

01
Header Logo, Menu, Button and Mobile Menu
02
Footer Widgets, Copyright and Footer Layout
03
Global Layout Content Width, Sidebar และ Page Structure
04
Typography Font and website level text size
PAGE LAYER

Elementor

Used to design the content of each page From Hero, Cards, Sections, CTA and Responsive

01
Container Structure and Flex Layout
02
Widgets Heading, Text, Image, Button, etc.
03
Spacing Padding, Margin, Gap และ Width
04
Responsive Adjust Desktop, Tablet, and Mobile
BEST PRACTICE

Astra + Elementor

Use Astra to maintain website level structure. And use Elementor to design the content within the page.

01
Set Global first Header, Footer and Typography
02
Create Page Layout Use Elementor to design sections
03
Avoid duplicate settings No need to set the Global Style again for every page.
04
Check Responsive Every page before Publish
RESPONSIVE DESIGN

A good website must be usable on every screen.

Don't just look at the desktop. After creating each section, the Tablet should be checked. and mobile always

Heading is not so big that it overwhelms the screen.
Column changes to vertical when necessary.
The buttons are easy to press and have enough space.
Images do not overflow Container
Not too much padding on Mobile
LAUNCH CHECKLIST

Check the website before publishing.

Tick ​​things that have been checked. The system will automatically calculate the readiness of your website.

WEBSITE READINESS
0%

Complete the checklist. Before opening the website to real users

✓
Check every page. There are no experimental messages or unfinished sections.
✓
Links and buttons work CTA and Menu to the correct page
✓
Forminator FAQ No text or images flooding the screen.
✓
Form tested Forminator can send data and email.
✓
HTTPS working The website opens with SSL without warning.
✓
Basic SEO settings Title, Description และ Sitemap พร้อม
✓
Check website speed Images and files are not larger than necessary.
FAQ

Questions about creating a website

For a website structure like this It is recommended to use Astra Header Builder. Manage main header And use Elementor for the content within the page. It will be easier to take care of and reduce duplicate settings.
Let's start from the home page first. Because it will help define the Design System such as color, heading card buttons, and spacing. Then apply the same style to other pages.
It's not necessary. Astra fits into the Global segment. such as Header and Footer Elementor is suitable for content and layout. within each page
It is not recommended to wait until the entire website is finished. Responsive should be checked after creating each section. Because it will help you edit the layout more easily. and reduce work back later
NEXT STEP

Ready to start designing with Elementor?

The next step is to learn Container, Widget, Spacing and Responsive To create the actual website page yourself

Start Learning Elementor →
Scroll to Top