От автора: приветствую вас, друзья. В очередной статье на тему WordPress мы с вами рассмотрим вопрос, как изменить шаблон WordPress. Если вы еще никогда не сталкивались с необходимостью изменения шаблона WordPress, тогда обязательно прочтите данную статью, поскольку рано или поздно вам, скорее всего, придется столкнуться с вопросами настройки и редактирования шаблона WordPress.
Для начала давайте определимся с наиболее часто возникающими вопросами, с которыми сталкиваются пользователи при настройке шаблона WordPress под себя. Вот примерный их список:
как редактировать шаблон WordPress
изменить ширину шаблона на WordPress
как изменить размер шаблона WordPress
как изменить цвет шаблона WordPress
как изменить шрифт в шаблоне WordPress
И это лишь небольшой перечень проблем, с которыми вы можете столкнуться или которые вы сможете помочь решить другим, в том числе и за вознаграждение, если вы занимаетесь разработкой сайтов на заказ.
Все вопросы в списке выше можно решить двумя способами в зависимости от темы, которая используется для сайта. Начнем с самого простого варианта, который не требует знаний верстки. Этот вариант подойдет, если шаблон поддерживает редактирование из настроек.
Перейдем в раздел Внешний вид — Настроить и увидим главную страницу сайта и в левой части страницы доступные настройки сайта. Среди них могут быть и настройки оформления.
Для примера давайте попробуем изменить цветовую схему сайта. Зайдем в меню Цвета и изменим фон боковой и центральной частей сайта.
Как видим, это довольно удобно и изменить цвет шаблона WordPress достаточно просто — результат мы видим сразу же и можем его оценить.
Однако не всякая тема предлагает все необходимые нам настройки шаблона WordPress. Например, там вряд ли будут настройки, позволяющие изменить ширину шаблона на WordPress, например, даже в текущей теме нет настроек, позволяющих изменить шрифт в шаблоне и так далее. Как же быть в этом случае? Вот здесь нам и придется прибегнуть ко второму варианту и здесь уже необходимы некоторые навыки верстки.
Итак, нам потребуется редактировать чаще всего только один файл — это файл стилей style.css. Находится он в папке вашей темы. Давайте в качестве примера изменим цвет шрифта. Кстати, сделать это можно прямо из админки WordPress. Только будьте аккуратны и внимательны, чтобы случайно не «поломать» сайт. Лучше всего сделайте резервную копию темы перед тем, как что-то менять в ней. Итак, идем в меню Внешний вид — Редактор и по умолчанию у Вас должен быть открыт для редактирования файл стилей темы.
Если это не так, тогда выберите этот файл из списка справа, он называется Таблица стилей (style.css). Чаще всего цвет шрифта задается в body, поэтому найдем стили данного элемента и пропишем красный цвет для в качестве цвета шрифта.
После сохранения файла можем обновить сайт и увидеть красный цвет для основного шрифта на сайте.
Как видим, настройка шаблона WordPress под себя — достаточно несложная задача. Достаточно немного знаний CSS и вы сможете изменить шаблон WordPress и произвести необходимую настройку шаблона. По той же схеме мы можем решить и другие аналогичные задачи. На этом я с вами прощаюсь. Удачи и до новых встреч!
Пришло время немного познакомиться с ее структурой, и принципами редактирования элементов нашей темы. Тут мы не будем разбирать такие настройка на админ. панели как Фон, цвет текста размер шрифта и прочее.
Думаю раз вы дошли до этой ступени, то уже имеете представление о WordPress, и сможете разобраться с кнопками, на которых все написано по русски 🙂 Мы же пойдем на чуть более продвинутый уровень настройки шаблона wordpress.
Для чего нужно изменять шаблон, думаю, все понимают. Кроме вас его наверняка скачали тысячи людей (особенно бесплатные темы
), и нам бы не хотелось, что бы наш сайт был похож на чей-то чужой, правда же? 🙂
Кроме того возможно в выбранной вами теме оформления есть какие-то элементы, которые вам мешают и их нужно убрать, либо же вы что-то хотите поменять местами. В общем, причин довольно много, и я не думаю, что найдется хоть один человек, который не хотел бы внести какие-то изменения в скачанный шаблон.
Как мы помним на статических сайтах для настройки внешнего вида нам достаточно открыть нужную страницу, скажем index.html и привязанные к ней css-файлы в текстовом редакторе(или html редакторе) , и просто внести необходимые изменения в коде страницы.
Но в CMS WordPress страницы нашего сайта динамические , т.е. они генерируются сервером при помощи PHP-программы, непосредственно после запроса пользователя из браузера. Другими словами мы не можем просто взять и изменить готовую страничку, т.к. готовой странички нет 🙂
Но у такой динамической страницы есть своя структура, зная которую можно вносить изменения в ее настройки. Я не знаток php и целенаправленно его не изучал, но для общей настройки шаблона для WordPress глубоких знаний и не нужно, достаточно будет немножко вникнуть в тему, так что сильно не пугайтесь)
Главным образом из php-файлов, css-файлов, изображений и скриптов, используемых в теме. Все эти файлы находятся в папке \wp-content\themes\название_вашей_темы\
Список php-файлов а так же основной css стиль темы можно так же увидеть перейдя в админ. панель на вкладку Дизайн — Редактор, там же можно и редактировать их. Однако для серьезных изменений советую использовать Notepad++ он заметно облегчает работу с кодом. При сохранении не забывайте ставить кодировку файла utf_8
Я буду рассматривать структуру на примере своей темы, у вас детали могут отличаться, но общий принцип думаю поймете..
На этом скриншоте я разбил тему на 4 условных составляющих, за генерацию которых отвечают свои php-файлы. Очень похоже на блоковую модель статичных страничек, не так ли. Однако есть свои нюансы.
За шапку в стандартизированных темах отвечает файл header.php В состав шапки обычно входят такие элементы как Меню, Название сайта, логотипы, баннеры, может входить навигация, поиск, слайдшоу и т.д. Все зависит от конкретного шаблона. Так же там прописываются доктайпы, меты и прочие значения тэга
html странички.За вывод боковой колонки нашего блога отвечает sidebar.php . В некоторых темах их может быть несколько, у меня одна. Сайдбар это важная часть сайта, в нее как правило помещают виджеты, баннеры, навигацию, и прочую полезную информацию которая должна быть у посетителя всегда на виду, вне зависимости на какой бы он странице не открыл ваш сайт. В моей теме так же на боковой панели находится поиск.search.php и searchform.php отвечают за поиск и все что с ним связано.
footer.php отвечает за вывод нижней части сайта — подвала. Там обычно находятся копирайты, информация о создателях и дизайнерах, счетчики, и т.д. иногда туда помещают какой-то функционал сайта, который не стали помещать в верхние части сайта, что бы он не отвлекал внимания посетителя.
Особняком стоит functions.php в нем перечислены различные функции вашего сайта, в том числе и доступные только администратору.
Как вы заметили, на всех страницах нашего сайта присутствуют футер, хэдер и сайдбар, куда бы вы не перешли. И лишь содержание основного контента постоянно меняется, в этом и есть смысл динамических страниц.
Надеюсь вы теперь в общих чертах поняли структуру вашего шаблона , и если захотите что-то убрать или наоборот добавить, то будете знать где искать нужный элемент)
Пост получился довольно большой, поэтому о CSS-стилях темы и картинках я . Там же мы и посмотрим как Firebug облегчает работу с кодом страниц.
Тема довольно сложная для новичка, поэтому если есть какие-то вопросы или что-то осталось непонятным, то не стесняйтесь,задавайте вопросы в комментариях.
Всем привет!
Сегодняшний пост будет посвящен новичкам, и в нем я расскажу вам, как установить шаблон (тему) на wordpress ? Все прекрасно понимают, что стандартные шаблоны, которые по умолчанию идут вместе с «движком» wordpress, не блещут красотой и оригинальностью.
Поэтому, перед каждым новичком, встает задача подобрать красивый и оригинальный шаблон, который будет радовать, как самого автора ресурса, так и его посетителей. Ах, сколько мучений и времени требует это занятие. То одно не нравится, то другое, что есть в одной теме, нет в другой... Ужас, одним словом. А как хочется, чтобы блог отличался от других ресурсов в сети.
На самом деле, в интернете существует огромное количество тем, как платных, так и бесплатных. И если вам хочется, что бы ваш ресурс ни походил не на чей другой придется немного раскошелиться и приобрести платный шаблон. В этом случае разработчик поможет вам довести его до совершенства. Но не каждый новичок готов выложить, пусть и небольшую, но все же денежку на покупку платной темы. Хотя, разброс стоимости шаблонов довольно приличный, но сейчас не об этом.
Вот и приходится на первых парах подбирать себе, что-то более или менее удовлетворяющее ваши потребности. Вот несколько сайтов, на которых вы можете подобрать шаблон для своего ресурса:
| http:// www. goodwinpress. ru/ http:// blogstyle. ru/ http:// www. wptheme. us/ http:// wordpresse. ru/ http:// skinwp. ru/ http:// www. webblock. ru/ http:// wp- templates. ru/ http:// xtemplate. ru/ |
А если немного постараться, то и бесплатную тему можно изменить до неузнаваемости и сделать ее хоть немного уникальной в глазах поисковых систем. Но об этом я, как-нибудь напишу , поэтому предлагаю вам , чтобы ничего не пропустить. А сейчас перейдем непосредственно к теме нашего поста.
Установить шаблон на wordpress можно тремя различными способами, по крайней мере мне известны только три. Возможно, вы знаете и другие варианты установки? Буду вам благодарен, если поделитесь ими в комментариях к данному посту. И сейчас мы рассмотрим каждый из них более подробно. Итак, приступим.
Для управления темами в административной панели ресурса перейдите во вкладку «Внешний вид/Темы», в которой вы сможете управлять, уже имеющимися шаблонами:
Или же, перейдя во вкладку «Установить темы», и подобрать более подходящий шаблон для своего ресурса:
Здесь вам предлагается на выбор три варианта:
1. Загрузить уже имеющуюся тему со своего ПК. Для этого нажмите ссылку «Загрузить», «Обзор», укажите путь до нее и нажмите «Установить»:
После загрузки вам предложат просмотреть, как она будет выглядеть, активировать ее или перейти на страницу «Внешний вид/Темы»:
2. Воспользоваться поиском по ключевому слову. Хотя вряд ли вам удастся полноценно им насладиться. Дело в том, что поиск, мягко говоря, отвратительный. Мне удалось найти несколько шаблонов только тогда, когда я ввел в поисковую строку запрос «SEO». Остальные ключевые слова, вводимые мной, полностью игнорировались.
При вводе любого другого слова мне все время высвечивалась одна и та же надпись: «Нет тем, удовлетворяющих вашему запросу». Такое ощущение, что в интернете не существует блогов на другие тематики... Попробуйте сами, может у вас получится найти шаблон, отвечающий ?
3. Ну и последний пункт — воспользуйтесь фильтрами. Здесь вам предлагается подобрать шаблон соответствующий вашим требованиям по определенным особенностям. В принципе можно поиграться с фильтрами и найти подходящую тему для своего сайта. После того, как вы определитесь с выбором, вам просто нужно будет активировать шаблон и на этом установка его будет завершена.
Этот и следующий способ не совсем востребованы, т.к. уступают в плане удобства, но все же я решил о них рассказать. Возможно, кому-нибудь когда-нибудь пригодится. Итак, как еще можно установить шаблон wordpress? Если кто из вас не знает, что такое filezilla и как с ним обращаться, . После его прочтения вам станет все понятно. Прочитали? Тогда можно продолжить.
Чтобы установить шаблон wordpress, вы заранее должны скачать на свой ПК (персональный компьютер) уже готовый шаблон и разархивировать его. После чего соединяемся с сервером при помощи клиента:
И просто перетаскиваем шаблон курсором мышки со своего ПК в папку на сервере, которая называется themes, путь до папки: httpdocs или public_html (в зависимости от хостинга)/wp-content/themes. После чего, как сказано в первом способе установки, переходим в административную панель ресурса во вкладку «Внешний вид/Темы» и просто активируем ее. На этом установка темы wordpress закончена.
И сейчас я вам расскажу о последнем способе установки шаблона wordpress, через панель управления хостингом. Я пользуюсь услугами , поэтому буду показывать на ее примере. Итак, поехали. Для того что бы установить шаблон worpdress, он как и во втором случае должен быть заранее скачан на ПК. Только единственное отличие от второго варианта установки, его не нужно разархивировать.
После того, как тема скачана, переходим в панель управления хостингом все в ту же папку themes и нажимаем «Закачать файл»:
Указываем путь до архива с шаблоном и нажимаем «Закачать»:
Теперь архив будет доступен в папке themes. Разархивируйте его, а сам архив удалите, чтобы он не занимал лишнее место на сервере:
После этого снова переходим в административную панель блога во вкладку «Внешний вид/Темы» и активируем ее. Все тема установлена.
На этом у меня все. Желаю всем удачи. Пока и до новых встреч!
Как вам статья? А какой способ установки предпочитаете вы? Жду ваших комментариев!
Выбор темы для WordPress очень важный шаг перед предстоящей огромной работой. Ведь именно от этого будет зависеть какое «лицо» будет у вашего сайта или блога. В вашем распоряжение будут десятки тысяч, как бесплатных так и платных шаблонов, и их выбор будет зависеть только от вас. К выбору темы нужно подходить щепетильно, потому что разные темы имеют разную структуру и разметку, так же разное количество сайтбаров, стилей и многое другое. В этом уроке мы разберем как установить тему WordPress.
Шаблон для вашего сайта на WordPress можно получить несколькими способами:
Каждый из вариантов поможет вам внедрить подходящую для вашего сайта тему, все различие в том на сколько ваш шаблон будет уникален и функционален.
При установлении тем доступных для скачивания с официального сайта WordPress вы в любом случае будете использовать ту, которая уже есть у кого то. Выбирая из популярных вы можете быть уверены что схожий шаблон есть у тысяч пользователей популярной платформы. Но не спешите расстраиваться ведь любую тему можно видоизменять и корректировать, которая может кардинально отличаться от основной. При желании вы можете изучить наши уроки по созданию дочерних тем и способов изменения внешнего вида сайта.
Покупая премиум тему у разработчиков вы обеспечите себе более-менее уникальную тему, которую использует меньшее количество пользователей сети, хотя опять же данный метод получения шаблона для сайта не намного лучше чем предыдущий. Ведь вы заплатите за то что уже есть у кого то другого. Преимуществом покупки таких тем является то, что они в общем идут более качественные и функциональные.
Что бы заказать уникальную тему у программистов-разработчиков вы потратите не малое количество денег, но в итоге получите именно то что желали и данная тема будет доступна только вам. Огромным преимуществом разработки собственной темы это ее уникальность, без лишнего кода и ненужных вам настроек и функционала. К тому же наличие такого шаблона придаст вашему сайту имидж в глазах пользователей.
Создание шаблона самостоятельно - кропотливый труд требующий не маленьких знаний программирования, верстки и дизайна. Данный способ доступен далеко не всем. Именно по этому темы которые продают и разрабатывают не так уж и дешевы.
К статье прилагается видео урок по установке и настройке темы WordPress.
Для того что бы установить тему WorrdPress, нужно зайти в , во вкладке внешнего вида, затем перейти к темам.
Откроются доступные вам темы которые уже установлены. Что бы выбрать, а затем скачать и установить свеженький дизайнерский шаблон нужно перейти по ссылке сверху «Добавить новую».
Войдя в меню выбора темы вы увидите количество предлагаемых вам шаблонов. В моей версии их около двух тысяч.
Вам предлагают выбрать нужную вам тему по внешнему виду или подобрать параметры поиска самостоятельно, что вы и можете сделать перейдя во вкладку «Фильтр характеристик».
По предложенным характеристикам темы WordPress
можно сортировать по цветам, разметке страниц и функциям предоставленных в темах.
Темы можно просматривать онлайн и установить к себе в «движок». После установки опять переходим во вкладку «Темы» и найдя скачанную ранее нажимаем активировать.
После выполнения этого действия выбранная вами тема будет внедрена в ваш сайт и будет отображаться на всех страницах.
Перейдя во вкладку меню «Внешний вид»/ «Настроить» нам откроется наш сайт и с левой стороны от него настройки темы, которые зависят от самой темы и ее функционал может отличаться. Здесь можно по предложенным параметрам, которые зависят от самого шаблона, настроить некоторое отображение в «реальном времени»:
Мы рассмотрели все возможные варианты как установить тему WordPress, мы можем видеть что это деяние не займет у вас много времени. Также с установленным шаблоном нам станет доступна настройка сайтбара и виджетов, но их мы рассмотрим в отдельном
5 комментариевПосле установки вордпресса сайт работает, но выглядит не презентабельно. Работая со встроенной темой, у вас не получится привлечь заинтересованных читателей, потому что выглядит она довольно убого. Так что осталось определиться какую тему выбрать для сайта и найти подходящую.
В статье я расскажу, где взять темы бесплатно и как установить тему wordpress на сайт. А также про основные настройки оформления: шапка, фавикон, меню, сайдбар, статистика
На самом деле тем настолько много, что глаза разбегаются. Чтобы немного определиться с выбором, нужно хотя бы мысленно прикинуть – как будет выглядеть ваш сайт? Ответьте на несколько вопросов, которые немного сузят круг поисков:
Когда вы мысленно представите внешний вид своего сайта, вам будет намного проще определиться с выбором.
К примеру, я хочу шаблон с белым фоном и не яркими цветами, сайдбар справа одной колонкой. Наверху выпадающее меню, дополнительное меню в сайдбаре. Статьи отображаются текстом.
Посмотрите подробную видео-инструкцию как установить тему wordpress и выполнить основные настройки:
Есть несколько способов для решения этой проблемы, я рассмотрю три варианта. Можно еще заказать у фрилансеров или сделать самостоятельно, но новичкам эти способы не подойдут.
Сейчас можно смело менять тему, потому что ваш сайт пуст. Но если вы решите поменять ее снова через пару месяцев, когда уже будут статьи, посты, баннеры и другая информация, сначала сделайте резервную копию! В случае непредвиденных ошибок (криво встала тема и «сломала» сайт), просто восстановите прошлую версию.
1. Выбрать из предлагаемого списка WP
В разделе Внешний вид выберите Темы и нажмите на Добавить новую.
Здесь можно выбрать подходящий шаблон из свежих или популярных тем, либо настроить фильтр по своему желанию.
Чтобы посмотреть конкретный шаблон поближе, нажмите на Просмотреть. Если он вас полностью устраивает, жмите Установить, а дальше Активировать.
2. Скачать из интернета.
В интернете можно найти очень много бесплатных тем. Достаточно вбить в поиск «скачать шаблон вордпресс» и получите много сайтов.
Я обычно беру с сайта best-wordpress-templates.ru . Очень удобный поиск и выбор по тематике.
Но самый большой плюс – возможность наглядно увидеть предложенный шаблон на конкретном сайте. Достаточно нажать Демо и вы сможете оценить выбранную тему в действии.
Когда выберите подходящий шаблон, скачайте его и загрузите на свой сайт. Для этого зайдите Внешний вид – Темы – Добавить тему и наверху нажмите «Загрузить тему». Выберите архив с шаблоном, который вы только что скачали, нажмите Установить. И в следующем окне Активировать.
Многие шаблоны из интернета можно найти в базе WordPressа, просто введите в Поиск тем ее название. Обычно она указывается на странице шаблона.
3. Взять шаблон Александра Борисова из курса (пример на моем сайте)
Я не могу выложить его в свободном доступе, чтобы не нарушить авторские права. Но вы можете скачать его из курса по этой ссылке . Установка этого шаблона мало чем отличается от Скачать из интернета.
Каждая тема индивидуальна, так что с конкретными шаблонами нужно разбираться самостоятельно. Но есть ряд общих настроек, которые нужно настраивать везде:
Создать мобильную версию сайта
Желательно сразу задуматься о мобильной версии сайта, потому что сейчас очень многие люди заходят в интернет с телефонов/планшетов. А кроме того, с недавних пор google стал понижать в поисковой выдаче сайты, которые не адаптированы для мобильных.
Здесь есть несколько вариантов:
Если вы решили установить бесплатный шаблон у А. Борисова, для него можно приобрести мобильную версию (390 рублей).
Есть простой способ: выбрать из уже готовых вариантов. Просто вбейте в поиск Шапки для сайта и перейдите в Расширенный поиск (в google). Там настройте Форма картинок – Панорама.
Теперь все картинки в нужной форме.
Способ с Photoshop:
Запускаем программу, зайдите в Файл – Создать. Установите ширину и высоту для шапки.
Обычно нужный размер шапки указывается в самом шаблоне, но стандартный размер: ширина 1240px, высота – 200-350px (желательно 250-300px).
После этого просто переносите картинки в это поле, и подстраивайте под размер. Для удобства зажмите Shift – так размер будет увеличиваться равномерно со всех сторон.
Фавикон – маленькая иконка 16×16 пикселей, отображается на вкладке браузера рядом с названием вашего сайта или страницы. Делается довольно просто и быстро, а сайты с фавиконом выглядят намного лучше, чем без него.
Есть два способа создать фавикон:
После этого вы получите маленький файл, который нужно перекинуть в главный раздел сайта. Зайдите в Filezilla, www – site.ru и перекиньте фавикон в эту папку.
Важно: у изображения должно быть разрешение ico. Если у вас другой формат, можно переконвертировать его с помощью онлайн-сервисов (к примеру, image.online-convert.com/ru/convert-to-ico)
После настройки шаблона нужно заняться заполнением сайта: страницы, рубрики, меню.
Для начала нужно создать несколько страниц:
Для создания страниц можно использовать раздел в левом меню Страницы – Добавить новую. Либо добавить с помощью верхнего меню +Добавить – Страницу.
Создание раздела : в левом меню выберите Записи – Рубрики. И здесь создавайте новые рубрики. Если хотите создать подрубрику (к примеру, Супы входят в рубрику Рецепты), нажмите Родительская и выберите из выпадающего списка Рецепты.
После этого можно создать меню :
Зайдите в главном меню (слева) Внешний вид – Меню. Придумайте название (к примеру, верхнее или главное меню) и нажмите «Создать новое меню». Добавите из списка страниц и рубрик слева нужные элементы – поставьте галочку и нажмите Добавить в меню.
Нужно добавить его в сайдбар, чтобы читателям было удобней ориентироваться. Для этого перейдите в раздел Внешний вид – Виджеты. Из Доступных виджетов выберите Произвольное меню и перенесите в правую часть – поместите в раздел SideBar. Теперь из выпадающего окна выберите меню, которое вы создали (к примеру, основное меню).
Сайдбар – боковая колонка на сайте, на которой содержится вспомогательная информация для посетителей (поиск, меню, подписное окно и другое).
В сайдбар таким же способом можно помещать и другую информацию: просто перемещайте нужный виджет в раздел сайдбара.
Очень полезный виджет Текст – он универсальный. В него можно вставлять различный код (к примеру, для статистики, баннера или подписки) и информация будет отображаться в сайдбаре. Имейте это в виду.
Кстати, с помощью этого виджета можно →
Для начала зайдите на сайт liveinternet.ru, нажмите наверху слева Получить счетчик. Заполните информацию о вашем сайте.
В следующем окне проверьте правильно ли все указано, если все верно, проходите дальше.
Выберите внешний вид вашей статистики – как она будет выглядеть? Полная информация на месяц или только один день? Если хотите поставить другой цвет, просто нажмите на иконку и выбирайте.
Внизу поставьте галочку в виде двух картинок – так вы сможете разместить картинку в сайдбаре или другом удобном месте. Намного удобней.
После этого у вас будет два окошечка с кодом:
Первый нужно разместить в HTML-код. Для этого зайдите Внешний вид — Редактор и в списке справа выберите Заголовок (header.php). Найдите в коде слово body. Можно нажать ctrl +F, чтобы было проще найти это слово.
Когда найдете, вставьте код из первого окна под этой строчкой и сохраните.
Второй – это ваша картинка, вы можете ее разместить в удобном месте. Например, в сайдбаре. Зайдите Внешний вид – Виджеты. Выберите Текст и перенесите в раздел сайдбара. Назовите (к примеру, Статистика) и вставьте код. Чтобы ссылки не индексировались, можно закрыть его для поисковых роботов. Для этого добавьте . Посмотреть, как именно это выглядит можно на скрине.
Чтобы посмотреть подробную статистику, нажмите на иконку в сайдбаре и введите домен и пароль, которые вы указали при регистрации.
Вот и вся основная информация по настройке темы. Теперь вы знаете, какую тему выбрать для сайта и как установить тему wordpress. А также выполнить другие основные настройки оформления (как установить фавикон на сайт, как создать шапку для сайта в фотошопе, как поставить статистику и меню). Если остались вопросы, пишите в комментариях.
