Создание сайта на WordPress для начинающих

Choosing the Right WordPress

There are two main WordPress versions:

• WordPress.com — a paid service with limited functionality on cheaper plans
• WordPress.org — the free, open-source version that gives you full control over design, themes, and plugins. This is what we'll use.

Setting Up Hosting and Domain

Hosting is where your site lives online. Here's how to set it up using Hostinger:

Choosing a Hosting Plan

• Business plan recommended: best performance, supports 50 sites, includes a free domain for year one, and provides 50 GB storage
• Payment period: longer commitments (e.g., 48 months) mean lower monthly costs
• Registration: enter your email, create a password, and provide payment details
• Confirmation: verify your email through Hostinger's confirmation message

Registering Your Domain

• In the Hostinger panel, click "Claim domain"
• Choose a short, memorable name in.com zone (if available)
• Confirm your email to activate the domain

Installing WordPress and Basic Setup

Hostinger automates most of the installation process:

1. In the control panel, select "Create new site" → WordPress
2. Choose your domain and server location (closer to your audience = faster loading)
3. Create admin credentials (email and a strong password)
4. Select "Create from scratch" for full control (not AI-generated)

Installing Your Theme and Essential Plugins

Setting Up the Astra Theme

Your theme controls the overall look: fonts, colors, layout.

• In WordPress admin: "Appearance" → "Themes" → "Add Theme"
• Find and install Astra (fast, popular, hundreds of templates)
• Activate it

Cleaning Up and Installing Plugins

Plugins add functionality to your site.

• Cleanup: Go to "Plugins" and delete all pre-installed plugins except LiteSpeed Cache (speeds up your site)
• Install essentials: Install and activate Starter Templates to access pre-built site designs

Choosing and Setting Up Your Site Template

A template is a ready-made layout for your pages.

1. Launch the setup wizard through the Starter Templates plugin
2. Select Elementor as your page builder (free, drag-and-drop interface)
3. Browse the template library by category or keyword (e.g., "restaurant", "portfolio") and choose a free design
4. During import, you can pre-configure logo, fonts, and colors, or skip ahead

Editing Your Site with Elementor

Understanding the Elementor Interface

• Pages consist of containers with elements inside (text, images, buttons)
• The right panel shows "Structure" — the page hierarchy at a glance
• The left panel has three tabs per element: "Content", "Style", and "Advanced"

Editing Elements

• Text: Click and type. Use the "Style" tab to change font, size, and color
• Images: Click to upload your own. Use "Style" to adjust size, corner radius, and shadows
• Buttons: Change text and link in "Content" tab. Customize colors, fonts, and rounded corners in "Style". Separate hover states available
• Container background: Select a container → "Style" → "Background". Set solid color, image, gradient, or video

Managing Space and Adding Elements

• Spacing: Padding (inner) and Margin (outer) are in "Advanced" → "Layout"
• Spacer: Pre-built element to add blank space between blocks
• Add elements: Click "Add Element" and drag widgets onto your page
• New sections: Click the + icon between containers and select a layout type (usually Flexbox)

Global Styles and Responsiveness

• Global settings: Click the Elementor logo → "Site Settings" to change colors and fonts across your entire site at once
• Responsive design: Switch between "Desktop", "Tablet", and "Mobile" modes at the top of the editor. Changes in mobile mode apply only to that view
• Publishing: Always click "Publish" in the top-right corner to save changes

Adding New Pages and Setting Up Navigation

Creating a Page

1. In admin: "New" → "Page"
2. Give it a name and click "Publish"
3. Click "Edit with Elementor" to design it
4. Build from scratch or import a pre-designed block/template from Starter Templates

Adding Pages to Your Navigation Menu

1. On your live site, click the "Customize" button at the top
2. Go to "Menu" → "Main Menu"
3. Click "Add Items" and select your new page
4. Drag items to reorder them
5. Click "Publish"

Editing Header and Footer

Headers and footers are edited in the theme settings, not in Elementor.

1. On your live site, click "Customize" at the top
2. Find "Header" and "Footer" sections
3. Header: Change logo, rearrange elements by dragging, hide or remove blocks (like phone numbers). You may need to access "Transparent Header" sub-settings to change the logo
4. Footer: Similarly adjust structure, text (e.g., copyright), and logo
5. Favicon: In settings, find "Site Identity" and upload an image for the browser tab icon

Key Takeaways

• Building a professional WordPress site without coding is absolutely achievable
• Critical steps: use WordPress.org, set up hosting, install Astra theme, and use Elementor
• Pre-built templates save time and ensure quality design
• Most edits (text, images, buttons) are intuitive through drag-and-drop
• Always configure responsive design for mobile and global styles for consistency