По разным причинам вам может понадобиться перенести свой сайт на другой хостинг или VPS сервер. Это может быть вызвано тем, что ваш проект развивается и для него уже недостаточно ресурсов сервера, а может просто вас не устраивает уровень обслуживания. За все время развития Losst я менял хостинг провайдера много раз, то, что описано в истории сайта далеко не все. Возможно, позже у меня дойдут руки дописать, но не сейчас.

В этой статье я расскажу как выполняется перенос сайта wordpress, как это лучше сделать, что вам необходимо знать для того чтобы переезд прошел гладко и незаметно для пользователей. Ведь это главное.

Несмотря на то что WordPress - это популярный движок и для него существует не только встроенная возможность переноса базы данных на другой сервер, но и огромное количество плагинов для этого, я не рекомендую их использовать. На своем опыте я убедился, что при использовании стандартного экспорта-импорта почему-то теряется множество картинок и потом нужно их восстанавливать. На losst еще до сих пор остались статьи с битыми картинками с тех времен. Мы будем делать все вручную с помощью таких инструментов:

  • mysql;
  • rsync;

Этого будет вполне достаточно, если вы менее опытный пользователь, то сюда можно добавить еще два инструмента:

  • phpmyadmin;
  • клиент ftp;

Упор я делаю на VPS, рассчитывая на то, что у вас есть доступ к серверу по SSH. Но эта инструкция может быть использована чтобы выполнить перенос сайта на Wordpres на другой хостинг. Большинство современных хостингов дают доступ к ssh консоли хотя бы в html интерфейсе.

Подготовка к переносу WordPress

Первое на что нужно обратить внимание, и желательно, при регистрации хостинга, это DNS. Нам нужно чтобы пользователи ничего не заметили. А поэтому сервера имен не должны меняться. Лучше всего, если ваши сервера имен будут у регистратора доменных имен и он же будет управлять доменной зоной.

Если же вы используете сервера имен вашего хостинга, то при передаче управления на другой хостинг сайт будет недоступен несколько часов. Поэтому сервера имен передайте регистратору, даже если сейчас они у вашего хостинга, а пользователей направляйте на ip сервера с помощью A записи.

Перенос сайта WordPress

Сначала нам нужно перенести все файлы сайта на другой сервер. Конечно, вы можете использовать для этого FTP клиент, сначала скачать все файлы по одному с одного сервера, а потом загрузить по одному на другой. Но это сработает, только если у вас немного файлов. С сайтом в несколько гигабайт это может занять дни. Поэтому будем использовать более простой способ через SSH. Подключитесь к вашему серверу по SSH:

ssh root@address1

rsync -avz -e ssh /папка/с/файлами/сайта root@address2:/папка/для/файлов/сайта/

Естественно, что папка для файлов сайта должна уже существовать. Дальше, на этом сервере нам нужно создать резервную копию базы данных, для наших целей этой команды будет вполне достаточно:

mysqldump -u root -p имя_базы > dump.sql

Если у вас большая база данных, то выполнение может занять несколько минут. Осталось передать базу на другой сервер, кладем ее в домашний каталог:

rsync -avz -e ssh dump.sql root@address2:~/

Если ваш сайт использует https, то нужно передать на новый сервер сертификаты, пока вы не подключите домен и не создадите новые:

rsync -avz -e ssh /путь/к/сертификату/site.pem root@address2:~/
rsync -avz -e ssh /путь/к/сертификату/site.key root@address2:~/

Дальше нам останется выполнить еще несколько настроек на этом сервере, но сначала нужно развернуть все на другом. Я предполагаю, что сервер уже настроен, веб-сервер и система управления базами данных установлены и работают. Подключаемся к нему по SSH:

ssh root@address2

Сначала файлы. Утилита rsync сохранит владельца файла из предыдущего сервера или сделает им root. А нам нужно чтобы файлы сайта принадлежали тому пользователю, от имени которого запущен Nginx и php-fpm или Apache. Посмотрите группу и пользователя, от которых они запущены:

Затем поменяйте текущего пользователя и группу всех файлов сайта на нужные с помощью утилиты chown:

chown -R losst:losst /путь/к/файлам/сайта/

Флаг -R включает рекурсивную обработку всех файлов, первый параметр - пользователь, второй, через двоеточие - группа. Дальше мы готовы перейти к базе данных. Сначала нужно создать нашу базу и создать пользователя, с помощью которого WordPress будет к ней подключаться. Для этого войдите в интерфейс mysql:

> CREATE DATABASE имя_базы_данных;
> CREATE USER "имя_пользователя"@"%" IDENTIFIED BY "пароль";
> GRANT ALL PRIVILEGES ON "имя_базы_данных" . * TO "имя_пользователя"@"localhost";
> GRANT ALL PRIVILEGES ON "имя_базы_данных" . * TO "имя_пользователя"@"address1";
> FLUSH PRIVILEGES;

С помощью этих команд мы создаем новую базу, затем пользователя, даем ему права делать с ней все что он захочет, если он подключен с localhost или сервера с ip address1, а последней командой обновляем таблицу привилегий. Нам осталось только загрузить информацию в базу:

mysql -u root имя_базы_данных < dump.sql

В принципе, для создания базы, пользователя и ее разворачивания можно было использовать Phpmyadmin, но в консоли все проще. Дальше нам осталось отредактировать файл wp-config и указать новые параметры доступа к базе:

vi /путь/к/файлам/сайта/wp-config.php

define("DB_NAME", "имя_базы_данных");
/** MySQL database username */
define("DB_USER", "имя_пользователя");
/** MySQL database password */
define("DB_PASSWORD", пароль");
/** MySQL hostname */
define("DB_HOST", "localhost");

Если хотите использовать HTTPS, то укажите путь к переданным сертификатам в конфигурации Nginx или Apache. Вы уже знаете как перенести wordpress, осталось только протестировать. Теперь возвращаемся на ваш локальный компьютер и добавляем в файл /etc/hosts псевдоним вашего домена, который будет указывать на новый адрес. В Windows тоже есть этот файл, но только находится он по другому адресу:

address2 ваш_домен.ru

Дальше открываем сайт в браузере, убеждаемся, что это именно новая версия и кэш DNS обновился, затем проверяем как все работает, если все хорошо, то можно перенаправлять A запись регистратора на этот, новый ip адрес:

Доменная зона обновится не мгновенно, на это потребуется довольно много времени, до нескольких дней. Все это время некоторые пользователи будут обращаться к старому серверу чтобы он выдавал новые страницы нужно подключить сюда базу данных. Помните, мы разрешили подключаться к нашей базе от этого сервера, теперь просто укажите на старом сервере address1 в wp-config.php данные доступа и адрес сервера address2 вместо localhost. Готово. Теперь ваш сайт перенесен. Осталось дождаться полного обновления доменной зоны и можно выключать первый сервер. Не забудьте обновить SSL сертификаты, если их использовали.

Добрый день дорогие читатели. На днях я рассказывал вам как делается на другой хостинг без смены домена. Сегодня я хочу дополнить этот расказ постом о том, как сделать перенос wordpress на другой домен со сменой хостинга или без смены хостинга.

Навигация по странице:

Вы наверно знаете, что если просто взять и направить новый домен на сайт, то админка и отдельные части сайта будут открываться со старого домена + будут глючить меню постоянно перекидывая не туда куда вам нужно. Есть 2 пути решения этой проблемы, исправить дамп базы данных или воспользоваться волшебными строчками кода для файла wp-config.php WordPress:

define("WP_HOME", "http://новыйдомен.ru");
define("WP_SITEURL", "http://новыйдомен.ru");

Перед любыми действиями по переносу сайта или смене домена, сделайте полную резервную копию рабочего сайта!!!

Этот код полностью решает проблему с перебрасыванием с нового домена на старый и заставляет грузится админку вордпресс с нового адреса, но к сожалению ему не под силу изменить все ссылки внутри постов, страниц, таксономий, виджетов и так далее. По сути этот код пхп подменяет домен который прописан у ваших настройках, перенос wordpress на другой домен при этом не выполняется:и можно банально изменить домен в настройках, чтоб не дописывать код в wp-config.php.

Но сегодня не об этом, нам нужно сделать полную замену старого домена на новый.

Для переноса wordpress на другой домен нам потребуются вот такие инструменты:

Название Описание Ссылка
(первый клик сгенерировать ссылку,
второй открыть в новой вкладке)
FileZilla - бесплатный FTP клиент ФТП клиент для работы с файлами и каталогами на вашем хостинге.
Adminer Php файл для скачивания базы mySQL. Можно воспользоваться встроенным phpMyAdmin на вашем хостинге, если он конечно есть, но я опишу универсальный вариант с использованием этого файла.
Notepad++ Стильный и удобный редактор файлов. На голову выше штатного текстового редактора в виндовс.
Смена домена wordpress

Для смены домена в WordPress нам нужно скачать дамп базы данных. Сделать это можно с помощью пхп файла Adminer или воспользовавшись панелью хостинга phpMyAdmin.

Пошаговая инструкция по смене домена в Вордпресс:

1) скачиваем Adminer по ссылке выше и заливаем его через фтп к себе на хостинг. Для этого нам нужен ФТП клиент FileZilla, а также фтп доступ к вашему хостингу. Запускаем фтп клиент FileZilla и вводим наши фтп данные как показано на скриншоте:

2) в правой колонке у нас файлы с сервера, а в левой файлы нашего ПК. В левой колонке нужно найти папку где лежит adminer-4.2.2.php (кстати у вас может быть немного другое имя), а в правой нужно найти директорию где лежит наш сайт, там будут обязательно файлы "wp-config.php", "index.php", директории "wp-content", "wp-admin", "wp-includes" и залить админнер на сервер.

3) Открываем браузер и набираем там вашсайт.ком/adminer-4.2.2.php (заменить под свой вариант) должна открыться страница вот такого плана:4) Если вы знаете эти данные что просит админнер то вводим их, если нет то открываем файл wp-config.php, он в корне вашего сайта и берем нужные данные доступа к базе, как показано на рисунке:

5) вводим данные в форму входа и нажимаем войти, у нас должно появится окно вот такого плана:


6) нажимаем на вкладку экспорт слева:и у нас откроется вот такое оно (не спешите сохранять базу, тут есть парочка нюансов, о них дальше и пойдет)

7) можно скачать базу целиком и потом мудохаться с заменой юрл, а можно разбить ее на 2 части и избежать проблем. В первую часть базы мы включаем все таблицы кроме "wp_comments" и "wp_posts" внимательно смотрите на скин ниже:


и нажимаем экспорт. Сохраняем файл, обязательно обозначаем что это первая часть, например добавляем в имя цифру 1:Теперь делаем вторую часть для этого в том же экспорте нужно поставить чербоксы только возле таблиц "wp_comments" и "wp_posts", смотрите скин:
и опять нажимаем экспорт только к имени добавляем число 2:

8) Открываем первую часть базы в Notepad++, который уже должен быть инсталлирован на наш ПК:и нажимаем сочетание клавиш Ctrl+f, в этом окне пишем свой домен в окно поиска и нажимаем Enter:
продолжаем поиск до того момента пока мы не найдем данные вот такого плана:

"siteurl", "http://сайт"

""home", "http://сайт"

Будьте очень внимательные, в первой части мы только здесь должны заменить ссылки на новый домен, скин прилагаю:
как вы поняли нужно заменить в этих местах старый домен на новый. Сохраняем первую часть базы и закрываем ее дабы она не путалась под руками.

9) Открываем вторую часть в Notepad++ и делаем немного другую вещь. Опять нажимаем Ctrl+f но в поиске переходим во вторую вкладку "Replace" и заполняем как у меня на скине:

Все посты сменили свой домен, теперь нам нужно сохранить этот дамп и закрыть.

10) Возвращаемся к нашему админнеру, переходим во вкладку импорт и заливаем сначала первую часть дампа потом вторую по очереди:

11) После успешной заливки обеих частей дампа в базу, ваш сайт сменил доменное имя, и если вы до этого направили ДНС нового домена на ваш хостинг, то сайт откроется с нового доменного имени, смена домена wordpress - прошла успешно, перенос wordpress на другой домен - выполнен.

12) Заходим в админку, первая вкладка настроек "общее" (вашсайт/wp-admin/options-general.php) смотрим правильный ли у нас домен указан в обеих полях и нажимаем сохранить изменения при этом изменений мы никаких не делали. Все, теперь ваш сайт будет работать с нового домена.

Перенос wordpress на другой домен

Теоретически я уже рассказал как делать перенос wordpress на другой домен, точнее вот здесь (дальше я буду называть эту пошаговую инструкцию как "Инструкция 1") я рассказал как перенести ВП на другой хостинг, а в заголовке (дальше буду называть "Инструкция 2") я описал как делать смену домена Вордпрес. Осталось только структурировать все описанное.

И так, структурировання пошаговая инструкция :

1) Из "Инструкции 1" делаем все пункты от первого до пятого (1 - 5) включительно.

3) В результате таких действий у нас есть все файлы со старого хостинга и база из 2 частей со старого хостинга, в которой уже записан новый домен.

4) Эта инструкция подразумевает что вы уже привинтили новый домен к новому хостингу, этот процесс я описывать не буду. Подключаемся к новому хостингу, там у нас должна быть сделанная база и привинчен сам сайт (созданные папки куда заливать файлы по ФТП). Из "Инструкция 1" вам нужно сделать пункты с 13 по 15 включительно.

5) В "Инструкция 1" в п. 16 говорится что нужно залить 1 часть базы, у нас же 2 части, то есть мы заливаем по очереди первую и вторую часть базы данных.

6) На этом все, перенос wordpress на другой домен закончен и мы можем насладится его работой.

В этой инструкции я немного все упростил, не стал описывать все по новой, ведь перенос wordpress на другой домен и перенос сайта wordpress на другой хостинг - задачи довольно похожие. Вам главное понимать, что скачивать вам со старого хостинга нужно не 1 дамп цельный, а 1 дамп разбитый на 2 части. Ну и от сюда следует что вам нужно будет закачать на новый хостинг 2 части одного дампа базы. + в этих частях нужно знать как и где делать смену домена на новый. Мы сделали перенос wordpress на другой домен, если у вас что то не получилось вы можете обратиться ко мне и я вам помогу.

Сейчас, поддерживая около 17% сетевого контента, WordPress стремительно становится наиболее предпочитаемой CMS для среднестатистического пользователя. Но что делать с сайтами, созданными с устаревшей CMS, или без нее вообще? Означает ли переход на WordPress то, что вам придется начать все сначала и потерять уйму времени, энергии и денег, которые вы вложили в этот веб-сайт? Нет!

Перенос сайта (включая дизайн) на WordPress гораздо проще, чем вы думаете. В этом уроке мы покажем процесс переноса на примере нашего проекта. Мы также рассмотрим некоторые вопросы, с которыми вы возможно столкнётесь, и найдём на них ответы.

Подробнее, об этом уроке

Перед тем, как мы примемся за работу, давайте обозначим некоторые моменты. Во-первых, этот гайд был написан для новичков и будет наиболее полезен для простых веб-сайтов. Некоторые из вас, возможно, столкнутся с продвинутыми аспектами миграции на WordPress, но эта инструкция в этом вряд ли чем-то поможет. Если зависли на каком-нибудь моменте связанном с более продвинутым переносом, то опишите свою проблему в комментариях.

Цели

Данный урок призван помочь вам со следующим:

  • планирование эффективного перехода на WordPress;
  • проведение через технические моменты, связанные с переносом;
  • решение наиболее частых сложностей, связанных с переносом.
Предположения

Я надеюсь, что вы имеете начальное предоставление о работе с WordPress. Опыт работы с WordPress может быть полезным, но не является необходимым. Я также предполагаю, что у вас есть веб-сайт и дизайн, который вы хотите перенести на wordpress.

Первые шаги
  • Оцените веб-сайт . Внимательно просмотрите страницы на вашем существующем веб-сайте и определите тип контента (стандартные страницы, фотогалереи, страницы ресурсов и т.д.), обратите внимание на любую информацию, которую можно посчитать важной.
  • Подготовьте среду . Настройте WordPress и приготовьтесь к импорту.
  • Импортируйте контент . Перенесите и организуйте ваш контент через утилиту импорта, вручную (для небольшого количества контента, когда утилиты недоступны) или через настраиваемый процесс переноса.
  • Перенесите дизайн . Встройте свой существующий дизайн в предустановленную тему WordPress.
  • Проверьте веб-сайт и начинайте . Внимательно проверьте результат импорта, подправьте, где необходимо, установите редиректы URL и начинайте!

    • С этим планом в голове давайте начнём прорабатывать каждый шаг подробно.

    Начните с плана

    Ключом к успешному переносу является внимательная оценка вашего нынешнего сайта. Вам нужно понять как импортировать и структурировать контент в wordpress перед тем, как переносить его туда. В то время, как принципы переноса являются одинаковыми, детали часто различаются. Ниже приведены два списка вопросов, которые необходимо себе задать во время разработки плана.

    Импортируемый контент
    • как много контента необходимо импортировать (количество страниц, изображений)
    • можно ли ваш контент перенести вручную, или вам необходима утилита
    • если вам необходима утилита, то существует ли она
    • может ли контент определен в обычные «посты» или «страницы», или необходима настройка
    • должен ли дополнительный контент располагаться на определенных страницах
    • изменится ли структура URL. Если да, то необходимо ли перенаправление со старых URL-адресов
    Существующая функциональность
    • включает ли веб-сайт сторонние сервисы (данные и т. д.)
    • необходимо ли перенести формы (контактные формы, формы для заявлений и т. д.)
    • есть ли ограничения контента (например, только для зарегистрированных пользователей)
    • продает ли веб-сайт продукцию (виртуальную или реальную)
    • необходимо ли перенести отдельные администраторские настройки
    Рабочий пример

    Мой брат решил пожертвовать свой сайт для примера: его проект продает постеры и открытки компании вегетарианской еды. Он построил сайт на простом HTML, с вставками PHP базового уровня для шапки и нижнего колонтитула. Ниже представлен скринкаст, где я изменяю этот сайт, чтобы вы поняли процесс работы. Наслаждайтесь!

    Установка WordPress

    Перед тем, как импортировать контент, нам необходимо подготовить WordPress. Если вы просто экспериментируете или предпочитаете оффлайн разработку, начните с установки wordpress. Если же нет, то следующим шагом будет установка wordpress на сервер вашего хостинг-провайдера. Или вы можете использовать процесс переноса как отличную возможность перейти на новый хостинг.

    После того, как wordpress настроен и запущен, вы можете начинать работу!

    Для нашего примера, мы установили wordpress на тот же хостинг, в директорию /wp для продолжения процесса переноса.

    Настройки и плагины

    С установленным wordpress нам остается сделать минимальные поправки:

    • Обновите постоянные ссылки . Кликните «Настройки->Постоянные ссылки» , чтобы внести изменения. В большинстве случаев я просто изменяю постоянные ссылки на «postname» .
    • Обновите пользователей . Я создал аккаунт андимистраторского уровня для себя и для любого администратора или редактора, что необходимы для клиентов и партнеров. Я также убираю дефолтное имя пользователя «admin» , если оно существует.

    В зависимости от целей проекта, нам может понадобится переустановить плагины. Здесь описаны основные категории плагинов.

    • Управление формами . Перенос форм так, как они есть может превратить все в хаос. Простое создание форм с нуля гораздо проще. Моим фаворитом является gravity forms . Другие варианты — это formidable и contact form 7 .
    • Управление SEO . SEO — очень деликатное явление. Смысл моей работы заключается в создании контента для людей, а не для поисковых систем. Поэтому, существует адекватный подход к SEO, поддерживаемый экосистемой wordpress. И если на вашем старом сайте есть пользовательские мета-описания, необходимо их перенести без потерь. Для этого поможет wordpress SEO .
    • Множество языков . Если ваш сайт поддерживает несколько языков, у WordPress есть решение. Мой выбор — плагин WPML . Еще одним решением может стать qTranslate .
    • Безопасность . Безопасность на WordPress — это хорошо знакомая мне тема. Возрастающая популярность WordPress сделало его неплохой целью для различного рода атак. Сам WordPress редко является проблемой, в основном она кроется в плохо охраняемой хостинговой среде и устаревших или плохо разработанных плагинах. Для большинства своих проектов я использую регулируемые хостинги WordPress, которые предлагают неплохие стандарты безопасности. В ряде опций можно назвать WPEngine , ZippyKid , Pagely и Synthesis . В добавок в регулируемому хостингу обратите внимание на плагины безопасности, такие как Better WP Security или WordFence.
    • Бэкапы . Если вы выбрали управляемый хостинг, то бэкапы обычно включены. Если вы сами делаете бэкап или вы хотите дополнительный слой защиты для данных, то есть отличные варианты, как например, VaultPress, CodeGuard, BackupBuddy, BackWPup .
    Импорт контента

    Итак, мы запустили и настроили WordPress, теперь самое время перенести весь ваш контент.

    Если у вашего старого сайта есть CMS, вам может быть доступна утилита. Начните искать скрип для переноса контента в Кодексе. Ели есть совпадение — здорово! Следуйте инструкциям и принимайтесь за работу. Если всё хорошо, то вы перенесёте свой сайт без каких-либо проблем.

    Если вашей CMS нет в списке или у вас нет CMS и у вас менее 100 страниц, тогда пригодится ручной перенос. Копируйте и переносите контент, записывая старые URL.

    Если у вас пользовательские CMS или база данных записей без инструмента переноса, а также большой объем контента, вы можете привлечь специалиста для переноса содержимого перед тем, как начать. Чем больше объем контента, тем выше вероятность человеческой ошибки и тем важнее автоматизация процесса.

    В нашем случае, мы перенесли контент вручную и заменили существующую навигацию меню WordPress. Вы сможете посмотреть процесс в этом скринкасте.

    Перенести дизайн

    Теперь настало время перенести на WordPress наш дизайн. Если вы хотите обновить внешний вид сайта, тогда стоит приглядеться к множеству отличный тем WordPress в официальном хранилище и сторонних магазинах, например ThemeForest и Creative Market. В нашем случае, представим, что вы полностью довольны дизайном.

    Оценка дизайна

    Оцените исходный код будущего дизайна как можно лучше, перед тем как сражаться с переносом. Если код основан на таблице или более сложный, чем тот, с которым вам комфортно работать, то результат может не стоить затраченных усилий. Когда все возможно, не все практично.

    Работа с исходным кодом

    Следуя своему опыту, могу сказать, что наиболее простой способ переноса дизайна — это работа с исходным кодом в браузере. Хотя доступ в хостинговой среде может быть полезно (особенно при работе с изображениями и скачиваемыми файлами), однако способы построения веб-сайтов настолько различаются, что вам придется переделывать оригинальную архитектуру, чтобы добиться чего-либо полезного.

    Прямая работа с исходным кодом сэкономит ваше время, покажет скрытые полезные функции и предоставит вам все, что нужно. Я пользуюсь браузером Google Chrome.

    Создание пользовательской темы

    Если вы в этом новичок, просмотрите информацию об использовании тем в Кодексе. Для процесса переноса вы можете создать новую тему WordPress с нуля, или изменить уже существующую тему, чтобы она соответствовала вашим вкусам. Я советую второй способ.

    Большинство моих проектов переноса начались с последних версий предустановленных тем WordPress. Недавно я удалил исходную тему, чтобы создать мою тему, которую я буду использовать в нашем примере и, которую вы можете сами использовать. Давайте начнем работу!

    Скачайте копию (zip) шаблона для переноса или продолжайте со своей темой, на выбор.

    Стиль страницы.

    Нашим первым шагом будет перенос стилей со старого сайта. В большинстве случаев это не сложнее, чем поиск в исходном коде соответствий на.css:

  • Откройте style.css.
  • Замените детали в теме (имя, URL, описание и т. д.) на ваши собственные.
  • Вставьте стили со старого сайта.
    • Заметка по поводу картинок

    Если вы переносите стиль страницы, найдите и обновите любую информацию об изображениях. В общем, мне нравится держать все изображения в папке /images/ в директории темы. Чаще всего необходимо менять расположение изображений в оригинальной CSS, и я удостоверился, что поменял все ссылки и шаблоны соответственно.

    Заголовок

    Следующим шагом будет создание заголовка для нашей новой темы. Нашей целью будет совместить структуру текущего кода с шаблонами WordPress. Вот что нам стоит сделать:

    • Скопируйте HTML структуру старого сайта.
    • Замените статическое меню на меню, поддерживаемое WordPress.
    • Используйте тэг WordPress title и оставьте wp_head на месте.
    • Вставьте другие важные теги из старого заголовка.

    Давайте взглянем на код!

    Оригинальный HTML Vegan Food Pyramid posters, postcards and wallpapers Vegan Food Pyramid
    • Products
    • Wallpaper
    • About
    • Contact
    Подогнанный заголовок (header.php) try{Typekit.load();}catch(e){} Объяснение

    Одной из проблем переноса является определение того, стоит ли улучшать код по мере продвижения. У нашего проекта есть разделы, которые можно улучшить, но мы решили оставить все как есть. Большинство из вас будет работать с переносом дизайна, который не был предназначен для улучшений.

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

    Давайте проработаем изменения, которые мы внесли.

    • Тип документа . Убедитесь, что вы перенесли тот же самый тип. В этом случае оригинальный html уже имеет доктайп HTML5 (относительно редкий случай на старых сайтах). Используя современный доктайп в коде, написанном для старого кода вы можете испортить шаблон.
    • Мета-теги . Я обычно переношу большую часть метатегов так, как они и есть, заменяя их в WordPress. Исключение в нашем случае составляет ссылка на файл стилей, вставляемая автоматически через wp_enqueue_style в файле functions.php .
    • Скрипты . Скрипты могут быть запутанными. Если скрипт находится на каждой странице (например, трекинговый скрипт, или скрипт шрифта), тогда необходимо разместить его в файле заголовка или нижнего колонтитула. Если необходимо, чтобы он появлялся лишь в отдельных местах, то подойдут теги условий. Лучше всего добавьте все скрипты в заголовок через wp_enqueue_script . Если вы готовы принять вызов, то я советую вам этот способ.
    • wp_head . Оставьте внизу тега в файле header.php . WordPress также использует wp_head, чтобы расставить скрипты и файлы стилей, используемые в теме и в плагинах, что вы установили. Без wp_head большинство плагинов просто не будут работать.
    • Body_class . Обратите внимание на использование тега . WordPress использует это, чтобы предоставить ряд полезных классов к тегу пока вы присматриваете страницу. В нашем примере они не используются. Ваши должны иметь уникальные ID или классы на каждой странице, в этом случае вам нужно создать произвольные функции используя теги условий, чтобы добавить соответствующие классы для каждой страницы.
    • Меню WordPress . Переход на меню WordPress является одним им самых сложных задач в переносе. Он будет у нас довольно прямолинейный. У нас есть простое меню, которые использует класс active (сгенерированый через PHP), чтобы показать, какую страницу посещает пользователь. Функция wp_nav_menu очень гибкая и предлагает встроенную функциональность, чтобы обрабатывать текущее состояние элемента в меню. Я обновил условия в файле стилей на active и изменил их, чтобы они использовали эквивалент, сгенерированный wp_nav_menu , который является current-menu-item . Смотрите скринкаст о переносе контента, чтобы понять, как настраивать меню на нашем примере.

    Вот и готова оболочка. Давайте приступил к следующему шагу.

    Подвал

    Перенос подвала обычно обходится без проблем. Как и в случае с шапкой, нам необходимо объединить части оригинального исходного кода. Давайте займемся этим.

    Оригинальный HTML

    © 2013 VeganFoodPyramid.com

    Подогнанный футер (footer.php)

    © VeganFoodPyramid.com

    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src="" + gaJsHost + "google-analytics.com/ga.js" type="text/javascript"%3E%3C/script%3E")); try { var pageTracker = _gat._getTracker("UA-6992755-1"); pageTracker._trackPageview(); } catch(err) {} Объяснение

    Некоторые подвалы сложно перенести (например, со сложными меню и виджетами), но в большинстве случаев это довольно просто. В нашем случае мы объединили HTML с нашим шаблоном подвала, оставляя обращение wp_footer . Мы также изменили ссылку на дату, чтобы использовать PHP и быть уверенными, что он обновляется каждый год.

    Домашняя страница

    Одна из проблем переноса — это то, что существует куча способов выполнить эту работу. Хорошим примером может служить домашняя страница, потому что она обычно наиболее отличается от остальной части сайта. Самый простой способ обычно самый верный. Я решил разместить весь контент с домашней страницы прямо в шаблоне. Изменять ее придется редко и это всегда можно будет сделать, изменяя шаблон.

    Давайте посмотрим на код без заголовка и футера, который мы уже перенесли.

    Оригинальный HTML Poster $30 each Buy Postcards $50 for 50

    Includes free shipping worldwide

    Buy Подогнанная главная страница /images/Vegan-Food-Pyramid-New.jpg">