Как установить тему WordPress, настройка и выбор шаблона. Attitude — шаблон для wordpress со множеством настроек


Вы знали, что 40% пользователей покидают сайты с плохим дизайном? Зачем терять прибыль? Выберите и установите прямо сейчас один из 44 тысяч премиум шаблонов для сайтов. Идеальный выбор для вашего бизнеса!

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

На сегодняшний день сайт – необходимый атрибут любого бизнеса. Возможностей для создания профессионального сайта существует очень много. Но многих наших читателей интересует вопрос: «Как получить хороший сайт, но при этом не тратить баснословные суммы на индивидуальную разработку у дизайнерского агентства?». Не все знают об этом, но сайт можно довольно просто создать самостоятельно где-то за 59$. Именно столько стоит премиум шаблон WordPress, который, в отличие от бесплатных шаблонов, будет иметь действительно качественный дизайн, высокую скорость работы, очень богатый функционал и будет полностью совместим с большинством полезных плагинов и дополнений. Именно благодаря гибкости WordPress любой сайт на этой платформе можно считать универсальным.

Настраиваемые темы WordPress – Наша подборка премиум шаблонов

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

Bimber – настраиваемая тема Вордпресс для журнала с вирусным и популярным контентом

С этим шаблоном вы получите очень крутой журнал с отточенным дизайном и возможностями для размещения и продвижения самого востребованного контента. Для этого в нем есть красивые значки для категорий записей и инструмент Snax для загрузки контента пользователями через браузер.

Authentic – классный WP шаблон для личного блога или журнала

Простой с точки зрения дизайна и кода шаблон Authentic – идеальное решение для блогеров и путешественников, которые постоянно находятся в поисках вдохновения. В этой теме вы найдете все, что вам нужно: минималистский дизайн, простота настройки, готовые варианты дизайна шапки, архива записей и галереи для красивого представления контента, интеграция с соц. сетями (Pinterest, Twitter, Facebook и Instagram), расширенные возможности для форматирования текста и 100% адаптация под мобильные устройства.

Еще шаблон поддерживает раздел портфолио, позволяет размещать рекламные баннеры и продавать товары (WooCommerce). Для статей-обзоров можно использовать систему оценок.

SanFrancisco – полностью настраиваемая тема WordPress для журнала и блога

1. Настройка шаблона

1.1. Добавление копии

1.2. Продажи и SEO

1.3. Структура копии

1.4. Аутсорсинг или самостоятельная настройка?

1.5. Добавление контента на сайт

2. Другие страницы

2.1. Добавление и настройка формы контактов

2.2. Добавление Google Maps

Общими усилиями мы уже установили наиболее важные элементы , пришло время поговорить о содержании. В этом уроке мы взглянем на и другие типы сайта, а также на все связанные с ним аспекты. Давайте начнем с основ и создадим первый пост на вашем сайте. Напишем, к примеру, что-то вроде «Привет, мир!».

Чтобы приступить к созданию первой публикации, перейдите в панель управления WordPress/Записи/Добавить новую . Здесь вы увидите множество вариантов для редактирования. Вот некоторые основы создания постов на сайте WordPress:

1. Не используйте заезженные фразы и клише. Будьте оригинальными.

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

3. Не переусердствуйте со знаками препинания.

4. Не переходите на снисходительный тон.

5. Создавайте легко читаемые тексты. Убедитесь, что информация соответствует общей теме:

— Заголовки;

— Подзаголовки;

— Маркеры;

— Нумерованные списки;

Жирный шрифт;

— Курсив и подчеркивание.

6. Увлекайтесь тем, о чем пишете. Это единственный способ создать осмысленный пост и привлечь внимание читателя.

7. Более чем важны заголовки в тандеме с увлекательным и интересным содержанием.

8. Обращайте внимание на тайтлы.

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

10. Избегайте нецензурных слов и выражений, если они употребляются не в ироническом контексте.

11. Никакой жаргонной лексики быть не должно.

12. Используйте видео/изображения в качестве иллюстраций к текстам.

13. Не бойтесь быть оригинальными.

14. Играйте словами.

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

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

Писать SEO оптимизированные тексты на самом деле намного проще, чем может показаться. Просто придерживайтесь ниже приведенных правил:

Работайте с 1-2 ключевиками в тексте. Те же ключевые слова могут быть использованы в мета-описаниях, заголовках и URL;

Оптимизируйте изображения и используйте альтернативный текст. Важно: в описаниях картинок используйте одно короткое ключевое слово.

Используйте ссылки. Этот момент очень важен. Залинкуйте публикацию с 1-2 уже существующими на сайте постами схожей тематики, которые имеют высокий рейтинг. Также рекомендуется, чтобы ключевые слова были связаны между собой, а каждая ссылка открывалась в новом окне.

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

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

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

1. В панели инструментов выберите пункт Записи;

2. Нажмите Добавить новую;

3. Заполните все поля, начиная с заголовка;

4. Введите свой текст или скопируйте его в текстовое поле;

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

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

Форма контактов является обязательным плагином для любого современного сайта или блога. Наш Cherry Framework включает в себя уже встроенную Contact Form 7. Давайте посмотрим как его можно его настроить.

1. Перейдите к Плагины/Установленные.

2. Вы увидите, что плагин Contact Form 7 уже установлен.

4. Здесь находится форма контактов, созданная по умолчанию. Чтобы настроить ее, нажмите Изменить.

5. Измените название контактной формы и сохраните изменения.

6. В поле Шаблон формы вы можете вставить между тегами.

7. В блоке Письмо вы также можете изменить параметры во всех имеющихся полях.

8. Скопируйте код Контактной формы и вставьте его в свой пост.

Другой плагин, который может быть полезен вашему сайту – Google Map. С его помощью можно показать свой адрес и обозначить координаты на карте, чтобы пользователи могли определить ваше местоположение.

На этом этапе все. Надеемся, у вас не возникло проблем с настройкой шаблона.

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

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

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

Для чего нужно изменять шаблон, думаю, все понимают. Кроме вас его наверняка скачали тысячи людей (особенно бесплатные темы ), и нам бы не хотелось, что бы наш сайт был похож на чей-то чужой, правда же? 🙂

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

Каким образом происходит настройка шаблона WordPress?

Как мы помним на статических сайтах для настройки внешнего вида нам достаточно открыть нужную страницу, скажем index.html и привязанные к ней css-файлы в текстовом редакторе(или html редакторе) , и просто внести необходимые изменения в коде страницы.

Но в CMS WordPress страницы нашего сайта динамические , т.е. они генерируются сервером при помощи PHP-программы, непосредственно после запроса пользователя из браузера. Другими словами мы не можем просто взять и изменить готовую страничку, т.к. готовой странички нет 🙂

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

Из чего состоит тема оформления для WordPress?

Главным образом из php-файлов, css-файлов, изображений и скриптов, используемых в теме. Все эти файлы находятся в папке \wp-content\themes\название_вашей_темы\

Список php-файлов а так же основной css стиль темы можно так же увидеть перейдя в админ. панель на вкладку Дизайн — Редактор, там же можно и редактировать их. Однако для серьезных изменений советую использовать Notepad++ он заметно облегчает работу с кодом. При сохранении не забывайте ставить кодировку файла utf_8

Я буду рассматривать структуру на примере своей темы, у вас детали могут отличаться, но общий принцип думаю поймете..

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

Шапка сайта.

За шапку в стандартизированных темах отвечает файл header.php В состав шапки обычно входят такие элементы как Меню, Название сайта, логотипы, баннеры, может входить навигация, поиск, слайдшоу и т.д. Все зависит от конкретного шаблона. Так же там прописываются доктайпы, меты и прочие значения тэга html странички.

Основной контент

  • 404.php который отвечает за вывод страницы с ошибкой 404.
  • archive.php который отвечает за страницы с архивами такими как рубрики, метки, календарь и т.д.
  • index.php — главная страница сайта
  • page.php отвечает за вывод страницы «Страницы» пардон за каламбур) ее вы видите если кликаете у меня вверху на «Об авторе», «Карта сайта» «Гостевая» и т.д.
  • single.php отвечает за вывод конкретной записи, наподобие той, которую вы читаете в данный момент 🙂
  • comments.php нетрудно догадаться отвечает за блок с комментариями
  • recent-comments.php недавние комментарии
  • и т.д.

Боковая колонка (sidebar)

За вывод боковой колонки нашего блога отвечает sidebar.php . В некоторых темах их может быть несколько, у меня одна. Сайдбар это важная часть сайта, в нее как правило помещают виджеты, баннеры, навигацию, и прочую полезную информацию которая должна быть у посетителя всегда на виду, вне зависимости на какой бы он странице не открыл ваш сайт. В моей теме так же на боковой панели находится поиск.search.php и searchform.php отвечают за поиск и все что с ним связано.

Подвал сайта (footer)

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

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

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

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

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

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

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

Заходим в административную панель сайта. Переходим в раздел меню “Внешний вид/Темы”. Жмём на кнопку добавить новую.

В поиске набираем название искомой темы, в нашем случае это «Aldehyde». Кликаем на кнопку “установить”, а затем “активировать”. После этого новая тема заработает. Теперь нам нужно настроить её под себя.

Настройка темы на примере шаблона «Aldehyde».

Для того чтобы приступить к настройке темы или шаблона необходимо перейти в меню к пункту “Внешний вид” и кликнуть по кнопке «Настроить».

В разделе Header settings (Настройки шапки):

  • в подпункте “title, tagline & logo”необходимо добавить название, логотип и иконку сайта.
  • в подпункте “social icons” устанавливаем социальные иконки. Здесь необходимо указать информацию в виде ссылок на соц. сети владельца сайта.
  • далее идёт подпункт “изображение заголовка”. Здесь меняется изображение фона шапки.

Во втором разделе Design and layout (Дизайн и оформление) можно выполнить настройку дизайна и макета сайта. В этом разделе можно установить желаемое отображение контента в блоге (одна или несколько колонок). Помимо отображения контента раздел позволяет активировать или отключить на некоторых страницах или даже на всем сайте отображение боковых колонок. Еще в этом разделе можно применять различные таблицы стилей и устанавливать информацию в подвале сайта.

Раздел Design and layout содержит следующие подпункты:

  • Blog layout – оформление ленты блога
  • Sidebar layout – включение и выключение сайдбара (боковой колонки)
  • Custom CSS – правка CSS стилей шаблона для продвинутых пользователей.
  • Custom Footer Text – Добавление текста в подвал сайта.
  • Theme Skins – выбор цветовой схемы шаблона.
  • Цвета. Раздел позволяет выбрать цвет и фон имени и описания ресурса.
  • Веб-шрифты Google. Раздел поможет выбрать различные шрифты от компании Google.
  • Фоновое изображение. Тут можно закачать необходимое фото или картинку для фона.

В следующем разделе именуемым Main Slider (Основной слайдер) можно выбрать подходящие для него настройки. Но в первоначальной стадии он не является нужным, поэтому не рекомендуется пока обращать на него особое внимание. К недостаткам основного слайдера можно отнести высокую загруженность ресурса. Более того этот компонент можно по праву называть противником мобильных версий сайтов.

Затем идёт раздел Custom showcase (Пользовательская витрина). Здесь вы можете красиво оформить 4 блока с ссылками на важные страницы вашего сайта.

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

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

Настройка отображения и вида меню.

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

  1. Необходимо дать меню имя и кликнуть по кнопке «Создать».
  2. Добавить туда самые необходимые страницы верхней степени.
  3. В настройках такой страницы использовать текст ссылки для последующего его отображения.
  4. Необходимо поставить или убрать галочку в пункте автоматического добавления страниц верхней степени.
  5. Выбрать место для отображения меню на сайте. Данная тема поддерживает два меню в шапке.

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

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

Так вот, чтобы у каждого, кто переходит на ваш блог/портал «радовался глаз» и благодаря этому человек задерживался бы на страницах, необходимо настроить шаблон, сделать его красивым, удобным…

Какие варианты решения данной задачи существуют

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

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

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

Это первый вариант — сделать заказ!

Второй вариант — попробовать самостоятельно.

Как именно это провернуть, я расскажу в сегодняшнем выпуске.

Третий вариант — купить готовый шаблон! Но его тоже можно редактировать и настраивать.

Как настроить тему wordpress

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

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

Как бы то ни было сейчас все разберем.

Как установить шаблон вордпресс из интернета

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

Итак, откройте поисковик и введите запрос «шаблоны вордпресс». Мне нравится один очень популярный сайт:

http://wp-templates.ru

Перейдите на него, нажмите на кнопку демо под понравившейся темой и посмотрите, как он на вид. Чисто, упал глаз на него или нет. Если да, то смело кликайте по кнопке «Скачать».

Выполнится загрузка архива zip. Ваша задача перейти в админ панель -> внешний вид -> темы -> добавить новую -> загрузить тему -> перетащите архив с шаблоном в область «Выберите файл» . Так, чтобы архив соприкоснулся с кнопкой. Хорошо, загрузили, теперь нажмите «Установить», затем «Просмотреть».
Отлично, сейчас мы перешли в панель настройки темы. Об этом мы поговорим ниже. А пока покажу, как открыть стандартные шаблоны вордпресс.

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

Всё, больше лишних действий не будет. Как можно было заметить, мы работали только со вкладкой «Внешний вид».

Настройка шаблона (темы) wordpress под себя

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

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

Все, что возможно разместить в сайдбаре выполняется через виджеты.

Например, в недавнем выпуске я рассказывал, . Это не один из стандартных виджетов вордпресса, а сторонний виджет. Чтобы его установить, потребуется воспользоваться виджетом «Текст» и при этом нам нужен скрипт для вставки. В статье, ссылка выше, я про это подробно рассказывал.

Что можно расположить в боковой панели?

У меня в сайдбаре очень небольшой инструментарий. Из вордпрессовских виджетов установлен только «Поиск». А «Интересные выпуски» я прописал от руки.

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

А порядок расположения должен быть примерно такой: сначала обязательно «Поиск», потом рубрики, а дальше интересные записи и прочее.

Как установить виджет?

Наведите курсор мыши на вкладку «Внешний вид», нажмите на «Виджеты».

Левой кнопкой мыши захватите и удерживайте необходимый виджет, я захватил виджет «Изображение». После этого перенесите его в правую панель, в сайдбар или футер, куда необходимо установить, туда и ведите курсор.