Emulator Pro

GoodwinPress

Инструкция по установке и настройке wordpress шаблона Emulator Pro

Emulator Pro (версия 1.0.0) - красивый адаптивный шаблон от goodwinpress.ru

Emulator Pro - универсальный шаблон, который может использоваться для создания сайтов в различных сферах деятельности. Бизнес-сайт, персональный блог, продажа инфопродуктов, сайт организации и др. Шаблон имеет самые простые настройки, подготовить его к работе можно за считанные минуты. Используя данную инструкцию, даже новичок легко разберется в шаблоне и научится быстро им управлять. Просто внимательно читайте и следуйте рекомендациям. В случае возникновения любых вопросов или проблем, касающихся шаблона, обращайтесь за получением бесплатной технической поддержки.




Введение

Здравствуйте!
Я автор шаблона, который вы приобрели. Спасибо Вам за это. Если Вы впервые приобрели шаблон у GoodwinPress, пожалуйста, прочитайте данное обращение.

Хочу сказать, что вы приняли верное решение. И вот почему. У бесплатных тем есть только одно достоинство — их доступность. Пользователь берет себе бесплатный шаблон, ставит на свой сайт и вдруг сталкивается с какими-то трудностями. В итоге админ остается один на один со своими вопросами. Почему скрипт не работает? Почему миниатюры не показываются? Как что-то добавить или изменить? Ему не к кому обратиться. Ему никто не обязан помогать. К тому же, в таких шаблонах часто встречается ненужный, а то и вредоносный код. И за это тоже никто не отвечает.

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

Без сложных шаблонов нет оригинальных и функциональных сайтов. Но не бывает сложных шаблонов, по которым не возникают вопросы. Поэтому хорошо, что есть у кого спросить.

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

Алексей (Goodwin)




Описание шаблона

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

NB. Везде далее термины "шаблон" и "тема" являются синонимами, равно как "рубрики" и "категории".

Основные фишки шаблона

- статичная главная страница, разбитая на несколько блоков, в которых выводится ваш произвольный контент,
- два слайдера на выбор - классический Flexy Slider и новый Slippry Slider, производит настоящий wow-эффект у посетителей,
- новое мобильное супер меню,
- 400 иконок от Font Awesome для оформления меню и текста,
- адаптивный дизайн (шаблон подстраивается под экраны планшетов и смартфонов),
- резиновый контейнер,
- трехколоночный блог,
- возможность менять цвет элементов шаблона из консли (фон меню, цвет ссылок, фон и шрифт подвала, кнопки и др),
- возможность отключать сайдбары (боковые колонки) из консоли,
- интегрирован подсчет просмотров каждой страницы или статьи,
- большой подвал с 4 блоками виджетов,
- воможность переключить ширину сайта в полноэкранный режим,
- социалка, кнопка "Наверх", красивые метки и рубрики, "хлебные крошки"" от Dimox'a, красивая типографика (модные шрифты от Google Fonts), контактная информация в шапке, логотип или текстовое название сайта на выбор,
- максимальная совместимость с различными плагинами,
- чистый, простой код, который легко понять и легко менять (для тех админов, которые разбираются в css и любят менять шаблоны под себя),
- персональная техническая поддержка, лучшая из тех, что есть.

Что еще?

Стандартные элементы WordPress: выпадающее меню, виджеты в боковых колонках, постраничная навигация, древовидные комментарии, установка фона из админки, 404 страница, описание рубрик и др.



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

Наверх

Процесс установки шаблона

ВНИМАНИЕ!!! Многие пользователи совершают ошибку, когда скачивают архив с шаблоном из письма, в котором он им выслан, и загружают его целиком в админку сайта. Это неправильно!!! В архиве, кроме самого шаблона, содержатся также другие файлы (плагины, инструкция и т.п.). Загрузка такого архива из админки приведет к нарушению путей, появлению лишних папок, в которых шаблон окажется будто матрешка в матрешке, что нарушит его работу. Из админки можно загрузить только такой архив, в котором содержится один лишь шаблон.

Если при загрузке из админки вы получили сообщение - тема установлена с ошибкой, отсутствует файл стилей (css) - это признак того, что вы пренебрегли советом и попытались загрузить весь архив целиком, со всеми потрохами.

Не нужно никакой самодеятельности. Просто следуйте инструкции и выполняйте все по пунктам.

Выберите ваш вариант -

Наверх

Вариант первый - для тех, кто умеет работать с FTP, либо не боится учиться новым вещам.

- Итак, вы сохранили архив из письма на компьютер и распаковали его. Внутри находится папка с темой + папка с плагинами + файл changelog + папка с данной инструкцией.

- настройте соединение со своим сервером по FTP. Для работы с FTP существует несколько клиентов (программ), например, Total Commander, FileZilla, Far и т.п. Для Мака рекомендую программы Coda 2 или Transmit. Данные для соединения с сервером по FTP обычно указаны в панели хостинга. Если их там нет, или вы не нашли, или вам лень это делать - спросите их у теподдержки хостинга, это имя сервера, логин и пароль.

- папку с файлами темы загрузите на сервер в директорию wp-content/themes.

- плагины загрузите по отдельности на сервер в директорию wp-content/plugins.

- Активируйте шаблон на странице Внешний вид в админке вашего сайта. Активируйте плагины. Обновите их, если они того требуют.

Наверх

Вариант второй - для тех, кто не умеет работать с FTP и не хочет этому учиться.

- cохраните архив из письма на компьютер и распакуйте его.

- откройте папку emulator-pro-10. Внутри находится папка с файлами темы (emulator) + папка с плагинами (plugins) + файл changelog + папка с данной инструкцией (documents).

- папку с файлами (emulator) заархивируйте в zip,

- зайдите в админку своего сайта, перейдите на страницу с шаблонами, выберите пункт Установить темы (1), нажмите ссылку Загрузить (2)

- пользуясь загрузчиком движка, загрузите архив (3), который только что создали,

- после загрузки шаблона, активируйте его

Плагины в этом случае вы добавляете следующим образом - заходим на страницу Плагины, выбираем пункт "Добавить новый", в окно поиска введите название плагина Wp Pagenavi, нажмите кнопку "Поиск плагинов", а когда вам будет представлен список плагинов, выбираем первый вариант и жмем на ссылку "Установить". То же самое повторите с плагином Responsive lightbox и любым другим, какой захотите добавить. Активируйте плагины.

Наверх

Но пока не торопитесь переходить на Главную страницу сайта, вам нужно выполнить еще несколько действий.


Общие настройки темы

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

Вот варианты:
1) сайт со статичной главной без блога
2) сайт-блог без статичной главной
3) сайт со статичной главной и с блогом

Вы можете использовать любой из них. Мне больше нравится третий, так как он включает все возможности.

Вариант 1. Сайт со статичной главной

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

В настройках страницы обратите внимание на опцию "Атрибуты страницы".

Здесь находится пункт Шаблон, в котором "Базовый шаблон" уже установлен по-умолчанию. Вам нужно выбрать вместо него шаблон "Главная страница".

б) перейдите в админке на страницу Параметры > Чтение > Настройки чтения

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

В результате этих процедур в качестве главной страницы вашего сайта будет установлена готовая Статическая Главная шаблона. Наполнить ее можно из консоли темы (см. ниже).

Вариант 2. Сайт-блог без статичной главной

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

Вариант 3. Сайт со статичной главной и с блогом

Чтобы на сайте были задействованы одновременно и статичная главная и блог, проделайте все шаги из первого варианта. Когда Главная будет готова, создайте новую страницу, назовите ее Блог. Писать в текстовом поле ничего не нужно. Никаких атрибутов выбирать не нужно. После создания и публикации страницы Блог, перейдите в Параметры > Чтение > Настройки чтения. В выпадающем списке "Страница записей" выберите Блог. В итоге настройки чтения у вас должны выглядеть так:



Так вы сделали главную и блог для своего сайта. В принципе, это все, но я бы обратил внимание еще на одну вещь. Это меню. Люди, которые прежде юзали древние вордпрессовские темы, привыкли к тому, что старая система меню сразу автоматом выводила созданные страницы на сайт. В новой системе меню все совершенно не так. И не такая уж она и новая, кстати, ей уже года 3 или 4. Суть в том, что вам следует зайти в админке на страницу Меню, создать там новое, наполнить его нужными страницами, рубриками - чем хотите. Туда же мы добавляем страницу Блог. Вот только Главную туда добавлять не нужно. Делается она иначе - см. рисунок:

Раскрываем "Ссылки", ставим символ слэш ( / ) в поле "URL", вписываем слово Главная в поле "Текст ссылки" - и нажатием кнопки добавляем данный пункт в ваше текущее меню. Делайте так - и вы построите правильную навигацию, без дублей, лишних страниц и мусора.

Наверх


Настройка шаблона (Консоль)

Что делать после того, как шаблон установлен и активирован? Теперь самое время приступить к его настройке.

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

Зайдя в консоль темы, вы увидите 10 секций, выполненных в виде раскрывающегося аккордеона. Для каждой секции предусмотрена своя кнопка сохранения настроек. Принцип работы прост - открываете секцию при помощи клика мыши, выбираете нужную настройку и нажимаете кнопку "Сохранить".

Наверх

01. ШИРИНА САЙТА

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

Наверх

02. ШАПКА САЙТА

Здесь настраиваются заголовок сайта и контактная информация.

На выбор предлагаются обычный текстовый заголовок или графический логотип.

Если вам достаточно обычного заголовка, выбирайте опцию "Текст". Тогда в шапке будет выводится текстовое название сайта, которое можно задать здесь же. Для ввода текстового названия предлагается два поля - текст, введенный в первое поле, будет окрашен черным цветом, тогда как текст из второго поля будет цветным. Используйте это, чтобы создать симпатичный заголовок. Задать свой цвет для цветной части заголовка можно ниже, в секции "Оформление".

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

Внимание! Некоторые пользователи путаются, и вместо ссылки на файл вставляют в консоль так называемую Постоянную ссылку, которая выводится там же, под названием. Этого делать не нужно. Постоянная ссылка (attachment) это ссылка на страницу сайта с изображением. Вам же нужна ссылка на файл, а не на страницу, помните об этом.

В этой же секции расположено управление блоком с контактной информацией, который выводится в правой части шапки. Включите этот блок, заполните поля - впишите свои данные (адрес, телефон, скайп, email и тп). Этот блок можно использовать не только для контакта, размещайте в нем любой нужный текст.

Наверх
03. СЛАЙДЕР

Впервые GoodwinPress предлагает шаблон с двумя слайдерами. Посмотрите оба, выясните, какой больше нравится и более подходит к решению ваших задач, и включайте его у себя на сайте. Вы можете вывести слайдер или на статичной главной, или в блоге, или и там и там одновременно. Также слайдеры можно вообще отключить на всем сайте. Это красивая штука, но не будем забывать, что любой слайдер потребляет ресуры сервера, не так ли?

1) Slippry Slider - слайдер, который построен на новых селекторах CSS3. Вместо стандартного пролистывания, слайды скользят и плывут, смена слайдов происходит плавно и красиво, вызывая вау-эффект у посетителей. Пример: Демо.

2) Flexy Slider - классический слайдер, который я использовал ранее в шаблоне Web Factory. В этом слайдере применяется стандартное пролистывание с fade-эффектом. Пример: Демо.

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

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

Однако, шаблон Emulator Pro имеет слайдер, который не привязан к постам, и при этом не требует произвольных полей.

Вы можете вывести 4 слайда. У каждого слайда есть три обязательных поля:

- заголовок слайда,
- ссылка на страницу, куда ведет клик с слайда,
- ссылка на изображение слайда.

Вы вписываете заголовок, вставляете ссылку на любую нужную страницу. Например, у вас на сайте есть страница Продукция, она имеет ссылку http://site.com/production - копируете эту ссылку из браузера и вставляете в соответствующее поле в консоли.

Изображение для слайда готовим заранее. Рекомендуемый размер изображений: 1400х500 px. Чтобы не подгонять размеры в фотошопе, вы можете использовать изображения большего размера - в теме интегрирован скрипт, который сам обработает картинку и уменьшит до нужных размеров. Главное, чтобы изображение было не меньше указанных параметров, так как в этом случае оно будет автоматически увеличено, что приведет к ухудшению внешнего вида.

Чтобы разместить изображение, воспользуйтесь ссылкой на медиа-загрузчик движка, которая приведена там же, в консоли, загрузите изображение, скопируйте ссылку на файл и вставьте в соответствующее поле. Например, после загрузки вы получаете вот такое окошко:

Нас интересует ссылка на файл - копируем ее и вставляем в консоли в поле "Картинка".
Повторите эту операцию для оставшихся трех слайдов и не забудьте нажать на кнопку "Сохранить".

Одно важное замечание на счет Slippry Slider.
Как уже говорилось выше, этот слайдер обязан своим потрясающим видом использованию новых селекторов CSS3. Дело в том, что старые версии браузеров, отправленные на свалку истории много лет тому назад, не понимают новых селекторов и не умеют их отображать. Разумеется, я говорю о старых версиях Internet Explorer, дурная слава которых намного опережает их распространение. В старых версиях IE Slippry Slider не будет работать. Казалось бы - и черт с ним, но оказывается, что до сих пор есть люди, до сих пор использующие программное обеспечение, которому 10 лет в обед, и которое давно уже поросло мхом. Кто эти странные люди - я не знаю, но если вы изучаете статистику своего сайта и видите, что в вашем трафике много таких, кто сидит на IE6, IE7, IE8 - скрепите сердце и откажитесь от Slippry в пользу Flexy, либо вообще отключите слайдер, потому что трафик и прибыль от сайта важнее его красоты.

Наверх
04. СЕКЦИЯ БЛОКОВ С ИКОНКАМИ

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

Если вы не будете использовать статичную Главную, эту секцию можно спокойно пропустить.

Для оформления этих блоков в шаблоне применяются иконки от Font Awesome. Более 400 разнообразных иконок для любой вкус интегрированы в Emulator Pro специальным скриптом Эти иконки выводится при помощи css-селекторов. Секция блоков с иконками в консоли темы содержит в себе поля, в которых можно задать код нужных иконок.

Наполнение каждого из блоков делается через три поля:

- заголовок блока,
- иконка,
- текст.

Впишите заголовок и текст. Чтобы задать иконку, сделайте следующее:

- зайдите на страницу http://fontawesome.io/icons/
- выберите нужную иконку - например, автомобиль
- скопируйте ее название - в данном случае, это fa-car
- вставьте его в соответствующее поле в консоли.

Все просто - выбрали иконку, вписали ее название в консоли, получили нужный символ:

На демо все иконки черные, но вы можете задать им свой собственный цвет - в секции "Оформление".

Наверх

05. СЕКЦИЯ С ПОДВИЖНЫМ ФОНОМ И КНОПКОЙ

Полезный элемент, при помощи которого можно направлять трафик на нужные страницы или к определенным частям / объектам сайта. Текст в блоке - любой, подпись на кнопке - любая, ссылка, открывающаяся по клику, - любая. Фишка блока - эффект прокрутки, в котором текст и кнопка при скроллинге страницы движутся вверх или вниз, а фоновое изображение (которое может быть любым), остается на месте.

Если вы не будете использовать статичную Главную, эту секцию можно пропустить.

Заполните все необходимые поля и нажмите кнопку Сохранить. При необходимости, этот блок можно отключить.

Размер картинки для фона может быть любым - шаблон сам вытянет изображение, если это будет нужно. Но оптимально все же - 1200х500, как в слайдере. Загрузка изображения производится так же, как и для слайдера или логотипа (см. выше). Изменить цвет кнопки - в секции "Оформление".

Наверх

06. ИЗБРАННЫЕ ЗАПИСИ

Избранные записи - это компонент темы в нижней части статичной Главной страницы. Через него можно выводить несколько последних постов из одной определенной (избранной) рубрики сайта. Эта опция полезна для создания отзывов, описания каких-либо продуктов, сайтов, книг, для вывода новостей. Количество выводимых постов кратно двум - 2, 4, 6, 8, 10. Пост выводится в виде анонса, который при желании снабжается миниатюрой. В консоли есть отдельная секция для настройки этого блока, в которой вы выбираете избранную рубрику, из которой будут выводиться посты, задаете количество постов, устанавливаете длину анонса.

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

Если вы не будете использовать статичную Главную, эту секцию можно пропустить.

Наверх

07. БЛОГ

В данной секции производится настройка блоговых опций.
Доступны следующие элементы - выбор между анонсами постов и стандартным постом, установка количества символов в анонсе, включение / отключение внутренней навигации. Все сделанные настройки применяются как к странице блога, так и к страницам архивов, рубрик и меток. Тут же задается пол автора сайта - небольшая забавная опция, которая устанавливает в записи (рядом с именем автора) фигурку женщины или мужчины.

Обычный пост это классика. Ваш пост выводится целиком вместе со всем содержимым, как то: картинки, ссылки, форматирование, видео и т.п. Админ по своему желанию может вывести весь пост целиком, или поделить его на две части - внешнюю и внутреннюю. Внешняя часть будет выводиться на индексной странице (также в архивах и поиске), а внутреняя часть будет доступна для чтения только на странице поста. Это деление происходит вручную в каждой записи на сайте, путем установки курсора в любом произвольном месте текста и нажатием кнопки More, которая размещается над текстовым полем.

Анонс - это способ вывода текста, который пришел из сферы журнальных дизайнов. В этом случае движок, при помощи специальных кодов, автоматически делит запись на внешнюю и внутреннюю части. Плюс анонса в том, что он обрабатывает записи автоматически, и если на сайте много постов, то админу не придется вручную обрабатывать их. Минус анонса в том, что в нем не выводятся картинки, видео, форматирование, ссылки. Поэтому в случаях использования анонса в шаблонах, в дополнение к нему используется миниатюра - уменьшеная копия одной из картинок, загруженных в запись. У каждого из нас - свои предпочтения в этом вопросе. Кто-то любит обычный пост, кому-то нравится анонс. Поэтому выбирайте под себя.

В этой секции вы также можете включать / отключать боковые колонки (сайдбары) на всем сайте. Хотите три колонки в блоге - оставьте все как есть. Хотите основную колонку и правый сайдбар - отключите левый и наслаждайтесь.

Блог сверстан с учетом требований сео к внутренней оптимизации. В трехколоночных шаблонах содержимое левой колонки идет впереди содержимого основной колонки. Это плохо с точки зрения сео, так как сайдбар обычно наполнен всякой чепухой (баннеры, рубрики, какие-то формы подписки и тп). Таким образом нарушается правило, согласно которому основное содержимое должно располагаться как можно ближе к шапке. Но в теме Emulator Pro код сверстан так, что содержимое основной колонки располагается над сайдбарами. Это одно из достоинств шаблона, неочевидное, но очень полезное.

Наверх

08. ПОДВАЛ

В этой секции всего две опции - включение / отключение подвала, а также отключение ссылки "Вход". Я размещаю эту ссылку на админку во всех шаблонах goodwinpress, но во многих обращениях за техподдержкой я встречаю вопрос - как ее убрать. Теперь вы можете легко сделать это без всякого копания в коде.

Наверх

09. СОЦИАЛКА

Здесь включаются и отключаются кнопки таких социальных сетей, как Facebook, ВКонтакте, Google +, YouTube, Instagram, Twitter, Одноклассники, а также кнопка сервиса RSS. Кнопки выводятся в подвале. К каждой кнопке вы даете свои ссылки. Просто включите кнопки тех сетей, которые вам нужны, и вставьте в соответствущее поле ссылку на свой аккаунт (например, http://vkontakte.ru/durov). Сами кнопки выводятся в подвале сайта. Ненужные кнопки можно отключить.

Обратите внимание на возможности RSS - в этом шаблоне имеется выбор между обычным, стандартным фидом движка, и вашим персональным фидом от Feedburner! Если вы один из тех, кто использует Feedburner для продвижения своего фида, то в поле "тип RSS" выберите feedburner, а следующее поле впишите адрес своего персонального фида. Найти его можно в вашем аккаунте на feedburner.com, на вкладке Edit Feed Details, самое нижнее поле содержит урл вашего фида (например, http://feeds2.feedburner.com/wpbot). Если используете дефолтный фид, оставьте поле пустым..

Запомните, что эти кнопки не являются закладками! Это не закладки, это ссылки на ваши профили в соц. сетях. Для создания кнопок, добавляющих сайт в закладки или публикующих контент в социальных сетях (расшарить), обратите внимание на превосходный сервис - генератор социальных кнопок share42.com. Там все на русском, очень просто и красиво.

Наверх

10. ОФОРМЛЕНИЕ

Секция "Оформление" одна из важнейших в шаблоне. Здесь вы работаете с цветом, придаете уникальность и красоту сайту. В секцию интегрирован скрипт colorpicker, при клике в поле открывается окно, где выбирается нужный оттенок. Хорошо, если знаете точный код нужного вам цвета - его можно просто вписать или вставить в поле, и оно тут же подсветится соответствующим оттенком. Если же вы действуете эмпирически, просто водите курсором по цветовому полю, чтобы подобрать подходящий вариант.

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

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

Обязательно возьмите на заметку сайт http://www.colourlovers.com/palettes, где можно подобрать гармоничные сочетания цветов для оформления. Я черпаю свои цветовые идеи оттуда. На этом сайте представлены (помимо всего прочего) тысячи цветовых палитр, каждая такая палитра содержит от 3 до 5 оттенков, которые подходят друг к другу и могут быть использованы для оформления сайта. Выбираете наиболее симпатичные палитры и пробуете применить их к шаблону - использовать цвета палитры: один для фона, второй для заголовка, кнопок и ссылок, третий для текста, четвертый для меню, пятый для подвала.

Например, открываете любую палитру, слева под каждым оттенком указан hex код цвета (отмечен красной рамкой). Копируете этот шестизначный код и вставляете в нужное поле секции "Оформление".

Наверх

Оформление - последняя секция консоли. Ниже дается описание других опций темы.




Как добавить иконки в меню

Одна из фишек шаблона - иконки в главном меню сайта. Это такие же иконки, какие мы использовали в текстовых блоках на статичной главной странице, от Font Awesome. И размещение иконок производится похожим образом. Я расскажу, как это сделать.

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

Если вы уже знакомы с меню в WordPress, перейдите в админке сайта на страницу Меню и посмотрите в верхний правый угол экрана, найдите кнопку "Настроки экрана", нажмите на нее. Откроется скрытая панель настроек (см. рисунок). Поставьте галочку в поле "Классы CSS".

Как только вы поставите эту галочку, в каждом пункте вашего меню появится новое поле "Классы CSS". В это поле вы вставляете код нужной иконки, то есть:

- зайдите на страницу http://fontawesome.io/icons/
- выберите нужную иконку - например, домик (раз уж на примере Главная страница),
- скопируйте название иконки - в данном случае, это fa-home
- вставьте его в поле "Классы CSS" в нужном пункте меню,
- перед fa-home добавьте еще две буквы fa, чтобы получилось как на скриншоте: fa fa-home


Наверх

Мобильное меню

В шаблоне используется новая система меню, которой я научился у добрых людей из http://frebsite.nl. Если вы просматриваете сайт на смартфоне или планшете, или просто уменьшите ширину окна браузера на вашем десктопе или ноутбуке, то увидите, как главное меню сайта исчезает, и вместо него появлятся ссылка с иконкой и надписью Навигация:

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

Чтобы сделать такую мобильную навигацию, просто зайдите к себе в админку и создайте новое меню, наполните его нужными пунктами. Самое главное, перед сохранением, обязательно поставьте галочку в поле "Мобильное меню", которое выводится в области Параметры меню (см. рисунок):

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

Хотел бы подчеркнуть один важный момент. Вы можете сделать только одно меню и использовать его одновременно в качестве основного и мобильного. Это делается путем установки обоих галочек. Такой вариант вполне доустим, кроме одного случая - если в главном меню у вас установлены иконки Font Awesome. Мобильное меню не рассчитано на добавление иконок. Во-первых, на мобильных устройствах они просто не нужны, а во-вторых, иконки могут вызвать искажения мобильного меню и испортить его внешний вид. Поэтому мобильным не нужно делать такое меню, в котором установлены коды иконок. Возможно, в следующей версии шаблона я вернусь к этому моменту и займусь его улучшением.


Наверх

Количество просмотров и рейтинг записей

В шаблон интегрирован код, который позволяет считать количество просмотров и демонстрировать его на сайте (под заголовками, рядом с именем автора и датой публикации). Эта опция не является моим изобретением, она осуществляется силами плагина Post Views. Для того, чтобы подсчет работал, требуется две вещи - активировать плагин Post Views и разместить в некоторых файлах шаблона специальный код. Код я уже разместил сам, поэтому вам осталось просто активировать этот плагин. Чтобы упростить задачу, я приложил его к шаблону.

Кроме простого подсчета просмотров, этот плагин имеет более глубокие функции. Например, у него есть виджет, при помощи которого можно вывести в подвале или в боковой колонке список с самыми популярными записями сайта. Такие фишки для WordPress появились уже давно, но все рецепты, которые есть в сети на этот счет, строят рейтинг популярности на основе количества комментариев. На мой взгляд, это совсем не показатель. Количество комментариев не отражает популярности страницы или записи. А плагин Post Views считает популярность на основе фактических просмотров, это более точный критерий.

Помимо этого, данный плагин предлагает еще и подробную статистику по просмотрам, создает отчет относительно текущего дня, недели, месяца, года. Доступ к этому отчету производится в адмнке сайта, на странице плагина: Параметры > Post Views (см. скриншот).


Наверх

Постраничная навигация

Чтобы включить постраничную навигацию по сайту, активируйте плагин wp pagenavi, который приложен к шаблону (и находится в папке plugins). В русской локализации он называется Список страниц. Если у вас навигация выглядит не так, как на демо, зайдите в панель настройки плагина и снимите галочку в поле "Использовать стиль pagenavi-css.css".


Наверх

Эффект лайтбокса

Если вы обратили внимание, на демо-сайте шаблона используется симпатичный лайтбокс. Эффект работает от плагина Responsive Lightbox, который я приложил к шаблону. Он работает уже сразу после установки, но также у него имеется панель настройки, в которой вы можете покопаться, чтобы получить больше от этого замечательного плагина.


Наверх

Миниатюра записи

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

Если миниатюра не установлена, то ничего страшного - у вас будет просто выводиться один текст, без всяких отступов или пустого места.


Наверх

Описание рубрики

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

Пример с демо -

Как добавить описание к рубрике? Заходим в админку сайта, меню Записи > Рубрики, выбираем рубрику, нажимаем ссылку "Изменить" и попадаем на страницу, в которой имеется поле для описания - см рисунок

Подобная фишка есть и у меток, и заполняется описание меток точно также.


Наверх

Возникли проблемы с шаблоном?

В случае возникновения каких-либо вопросов или незадокументированных проблем, вы можете написать мне на почту goodwinpress@ya.ru. Поддержка осуществляется только по email. В теме письма обязательно укажите ваш ID номер, который выдается вместе с темой. Нелишним будет также указать адрес сайта и название вашего хостинга.

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

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

Это важный вопрос, ибо некоторые люди почему-то считают, что теперь у них есть бесплатный личный круглосуточный консультант, который должен отвечать на любые их вопросы. Конечно, это не так. Я рад помочь Вам с шаблоном, но не позволяю манипуляторам управлять моим временем. Поэтому пишите мне во всех случаях, когда требуется помощь, подсказка, совет по шаблону. Но если у Вас возник вопрос, который не относится к шаблону, вы можете найти ответ на него в поисковых системах, форумах и т.п. Создание и поддержка шаблонов это не хобби, это заработок, поэтому я не могу тратить время на посторонние вещи.

Наверх

Скидка на темы от GoodwinPress

Хочу проинформировать Вас, что владелец любой коммерческой темы от Гудвина имеет в своем распоряжении 25-процентную скидку на другие мои темы. Например, если стоимость шаблона составляет 820 руб, для вас второй шаблон будет стоить 615 руб.

Скидки не суммируются.


Дополнительные вопросы

Могу ли я использовать этот шаблон на нескольких своих сайтах?
Да, вы можете использовать тему на любом количестве СВОИХ сайтов без ограничений. Для использования темы на сайтах других людей (клиентов, друзей и т.п.) вы должны оплатить стоимость используемой копии (со скидкой 25 процентов).

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

Могу ли я публиковать, копировать, раздавать инструкцию к шаблону?
Нет, вы не можете публиковать инструкцию, копировать, раздавать, выдавать за свою.

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

Наверх

Если вы нашли опечатки

Друзья, создание шаблона, его тестирование, составление инструкции - это большая работа. Иногда автор может ошибиться в чем-то. Если вы нашли опечатку в данной инструкции, сообщите мне об этом, чтобы я внес исправления. Спасибо! Почтовый адрес goodwinpress@ya.ru




2014 © Goodwinpress.ru