WordPress для начинающих: создание современных веб-сайтов

Подробное руководство по WordPress для начинающих. Изучите основы WordPress, создание тем, разработку плагинов и лучшие практики создания современных веб-сайтов.

Опубликовано 18.09.2023 Обновлено 20.04.2025

Автор Oleg Dobrynin

5 мин. чтения

Введение

WordPress - это популярная система управления контентом (CMS), которая позволяет создавать различные типы веб-сайтов. В этой статье мы рассмотрим основы WordPress и научимся создавать современные веб-сайты.

Что такое WordPress?

Открытый исходный код: Свободное использование
Гибкость: Различные типы сайтов
Большая экосистема: Множество тем и плагинов
Простота использования: Удобный интерфейс

Установка и настройка

1. Установка WordPress

Локальная установка

        
      
# Скачивание WordPress
wget https://wordpress.org/latest.zip
unzip latest.zip

# Настройка базы данных
mysql -u root -p
CREATE DATABASE wordpress;
CREATE USER 'wordpress_user'@'localhost' IDENTIFIED BY 'password';
GRANT ALL PRIVILEGES ON wordpress.* TO 'wordpress_user'@'localhost';
FLUSH PRIVILEGES;

Настройка wp-config.php

        
      
<?php
define('DB_NAME', 'wordpress');
define('DB_USER', 'wordpress_user');
define('DB_PASSWORD', 'password');
define('DB_HOST', 'localhost');
define('DB_CHARSET', 'utf8');
define('DB_COLLATE', '');

$table_prefix = 'wp_';
define('WP_DEBUG', false);

2. Первый запуск

Настройка сайта

Откройте сайт в браузере
Выберите язык
Заполните информацию о сайте
Создайте учетную запись администратора

Разработка тем

1. Структура темы

Основные файлы

theme-name/
  ├── style.css
  ├── index.php
  ├── header.php
  ├── footer.php
  ├── functions.php
  ├── single.php
  ├── page.php
  └── screenshot.png

style.css

/*
Theme Name: My Theme
Theme URI: https://example.com/theme
Author: Your Name
Author URI: https://example.com
Description: A custom WordPress theme
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: my-theme
*/

2. Разработка шаблонов

header.php

        
      
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
    <header>
        <div class="container">
            <h1><a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?></a></h1>
            <nav>
                <?php
                wp_nav_menu(array(
                    'theme_location' => 'primary',
                    'container' => false,
                    'menu_class' => 'nav-menu'
                ));
                ?>
            </nav>
        </div>
    </header>

functions.php

        
      
<?php
// Регистрация меню
function register_theme_menus() {
    register_nav_menus(array(
        'primary' => 'Primary Menu',
        'footer' => 'Footer Menu'
    ));
}
add_action('init', 'register_theme_menus');

// Подключение стилей и скриптов
function theme_scripts() {
    wp_enqueue_style('theme-style', get_stylesheet_uri());
    wp_enqueue_script('theme-script', get_template_directory_uri() . '/js/main.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'theme_scripts');

Разработка плагинов

1. Создание плагина

Структура плагина

my-plugin/
  ├── my-plugin.php
  ├── includes/
  │   ├── class-main.php
  │   └── class-admin.php
  ├── admin/
  │   └── admin-page.php
  └── assets/
      ├── css/
      └── js/

Основной файл плагина

        
      
<?php
/*
Plugin Name: My Plugin
Plugin URI: https://example.com/plugin
Description: A custom WordPress plugin
Version: 1.0
Author: Your Name
Author URI: https://example.com
License: GPL v2 or later
Text Domain: my-plugin
*/

if (!defined('ABSPATH')) {
    exit;
}

// Определение констант
define('MY_PLUGIN_PATH', plugin_dir_path(__FILE__));
define('MY_PLUGIN_URL', plugin_dir_url(__FILE__));

// Подключение основных файлов
require_once MY_PLUGIN_PATH . 'includes/class-main.php';

// Инициализация плагина
function my_plugin_init() {
    $plugin = new My_Plugin_Main();
    $plugin->init();
}
add_action('plugins_loaded', 'my_plugin_init');

2. Работа с хуками

Добавление хуков

        
      
// Добавление пункта меню
function add_admin_menu() {
    add_menu_page(
        'My Plugin',
        'My Plugin',
        'manage_options',
        'my-plugin',
        'render_admin_page',
        'dashicons-admin-generic'
    );
}
add_action('admin_menu', 'add_admin_menu');

// Фильтр контента
function modify_content($content) {
    return $content . '<p>Added by plugin</p>';
}
add_filter('the_content', 'modify_content');

Работа с базой данных

1. Создание таблиц

Установка таблиц

        
      
function create_plugin_tables() {
    global $wpdb;
    $charset_collate = $wpdb->get_charset_collate();

    $sql = "CREATE TABLE IF NOT EXISTS {$wpdb->prefix}my_table (
        id mediumint(9) NOT NULL AUTO_INCREMENT,
        title varchar(100) NOT NULL,
        content text NOT NULL,
        created_at datetime DEFAULT CURRENT_TIMESTAMP,
        PRIMARY KEY  (id)
    ) $charset_collate;";

    require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
    dbDelta($sql);
}
register_activation_hook(__FILE__, 'create_plugin_tables');

2. Работа с данными

CRUD операции

        
      
// Создание записи
function insert_data($title, $content) {
    global $wpdb;
    return $wpdb->insert(
        $wpdb->prefix . 'my_table',
        array(
            'title' => $title,
            'content' => $content
        ),
        array('%s', '%s')
    );
}

// Получение записей
function get_data() {
    global $wpdb;
    return $wpdb->get_results("SELECT * FROM {$wpdb->prefix}my_table");
}

REST API

1. Создание эндпоинтов

Регистрация маршрутов

        
      
function register_rest_routes() {
    register_rest_route('my-plugin/v1', '/items', array(
        'methods' => 'GET',
        'callback' => 'get_items',
        'permission_callback' => '__return_true'
    ));
}
add_action('rest_api_init', 'register_rest_routes');

function get_items($request) {
    return array(
        'items' => get_data()
    );
}

2. Работа с API

Пример запроса

        
      
fetch('/wp-json/my-plugin/v1/items')
    .then(response => response.json())
    .then(data => {
        console.log(data.items);
    });

Оптимизация

1. Кэширование

Настройка кэширования

        
      
// Кэширование запросов
function cache_query($query) {
    $cache_key = 'my_query_' . md5(serialize($query));
    $cached_result = wp_cache_get($cache_key);

    if (false === $cached_result) {
        $result = get_data();
        wp_cache_set($cache_key, $result, '', 3600);
        return $result;
    }

    return $cached_result;
}

2. Оптимизация изображений

Обработка изображений

        
      
function optimize_image($image_id) {
    $image = wp_get_attachment_image_src($image_id, 'full');
    if ($image) {
        $editor = wp_get_image_editor($image[0]);
        if (!is_wp_error($editor)) {
            $editor->resize(800, 600);
            $editor->save($image[0]);
        }
    }
}

Безопасность

1. Валидация данных

Проверка входных данных

        
      
function validate_input($data) {
    $data = trim($data);
    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;
}

function save_data($title, $content) {
    if (!current_user_can('edit_posts')) {
        return new WP_Error('permission_denied', 'Permission denied');
    }

    $title = validate_input($title);
    $content = wp_kses_post($content);

    return insert_data($title, $content);
}

2. Защита от SQL-инъекций

Безопасные запросы

        
      
function get_item_by_id($id) {
    global $wpdb;
    return $wpdb->get_row(
        $wpdb->prepare(
            "SELECT * FROM {$wpdb->prefix}my_table WHERE id = %d",
            $id
        )
    );
}

Заключение

WordPress - это мощная платформа для создания веб-сайтов. Понимание основ WordPress и правильное использование его возможностей поможет создавать качественные и функциональные сайты.

WordPress, Разработка, Технологии

wordpress cms веб-разработка блог сайт темы плагины

Авторский пост защищен лицензией CC BY 4.0 .