Легкое редактирование шаблона WordPress. Как редактировать шаблон wordpress


Редактирование шаблона WordPress. Создание и изменение темы

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

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

Простейшее редактирование шаблона

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

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

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

Глубокие знания настройки темы

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

К примеру тег bloginfo (), по большей части своего функционала считается устаревшим, и легко заменим более быстрыми и функциональными тегами.

Так же при разработке шаблона может возникнуть вопрос, что использовать  the_excerpt() или the_content() для вывода анонса поста.

На эти и другие вопросы стоит четко знать ответы, при редактировании WordPress шаблонов.

Создание собственного шаблона (уроки)

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

После прощупывания почты разработки можно будет приступить к первому уроки по созданию WordPress темы, суть которого в создании и наполнении главных файлов абсолютно любой темы (Index.php и style.css).

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

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

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

yrokiwp.ru

Как редактировать шаблон Wordpress?

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

Вам понадобится
Инструкция
  • Многие веб-мастера говорят о том, что идеальный браузером для серфинга и сайтостроения является продукт от компании Mozilla. Firefox, пожалуй, единственная программа, которая поддерживает такое количество приложений и дополнений. Для редактирования шаблонов на любой платформе вам понадобится дополнение Firebug, которое позволяет на месте отображать и редактировать любые параметры шаблона.
  • Для его установки необходимо нажать верхнее меню «Инструменты» браузера и выбрать пункт «Дополнения» или нажать сочетание клавиш Ctrl + Shift + A. В открывшемся окне не стоит дожидаться загрузки рекомендуемых приложений для Firefox, следует поставить курсор в поле с текстом «Поиск среди доступных дополнений» и ввести Firebug.
  • В списке результатов поиска нажмите кнопку напротив пункта Firebug. После загрузки этого дополнения станет активной кнопка «Перезапустить сейчас». Нажмите ее, чтобы применить изменения. Если по каким-либо причинам данное приложение не появилось в результатах поиска, перейдите на официальный сайт Mozilla и установите Firebug по следующей ссылке https://addons.mozilla.org/ru/firefox/addon/firebug.
  • После установки этого дополнения в нижней части окна браузера появится небольшая иконка с изображением жука, нажмите на него — дополнение станет активным. К примеру, вы захотели изменить отображение ссылок на главной странице вашего сайта, для нахождения кода этого элемента в окне «жука», которое разделено на 2 части, необходимо поочередно выбрать Html и Style. Теперь в одной части окна будет отображаться html-код, в другой части будет виден код из файлов style.css.
  • В блоке html перемещайтесь по файлу, периодически нажимая блоки , вы увидите, что после нажатия на один из блоков в «жуке», на странице будет появляться выделение такого же блока. Таким образом довольно просто найти редактируемый элемент, код которого вы не знаете.
  • После того, как нужный блок кода был вами обнаружен, переместите курсор в соседнее окно (Style). Здесь вы увидите все параметры отображения для данного блока, например, размер шрифта — это ничто иное, как элемент font-size. Если вы хотите его увеличить, прибавьте несколько единиц к уже существующему значению. Обратите внимание, что вам требуется изменить только цифру, сокращение px не стоит трогать (обозначение пикселей).
  • В этом же блоке обратите внимание на все элементы, среди них могут оказаться padding, margion и т.д. Чтобы разобраться с названиями незнакомых вам элементов, рекомендуется воспользоваться специализированным online-справочником команд — http://htmlbook.ru. Перейдите по этой ссылке, в правом верхнем углу есть поле «Поиск по сайту». Введите искомую команду и нажмите клавишу Enter.
  • В результатах поиска вы увидите использование этого элемента в вариациях. К примеру, вас интересует, что означает элемент margin. Введите это слово в поисковое поле и нажмите Enter. Среди результатов поиска выберите первую ссылку CSS — margin. После перехода по этой ссылке вы сможете ознакомиться с этой командой и узнать все о ее применении.
  • Оцените статью!

    imguru.ru

    Как правильно редактировать WordPress

    Гомер и Барни собираются редактировать WordPress

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

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

    Если редактировать тему WordPress с помощью плагинов

    Можно практически до неузнаваемости «отметаморфозить» свой сайт на WordPress’е с помощью плагинов. Сделать это максимально легко. А потом можно не волноваться из-за обновлений темы. Разве что переживать из-за медленной работы перегруженного плагинами сайта. Или из-за того, что разработчики плагина прекратят его поддержку. Или из-за того, что очередной злоумышленник сможет взломать ваш сайт, найдя «дыру» в безопасности одного из плагинов.

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

    Я хорошо понимаю, что плагин – самый простой способ внести изменения в сайт. И далеко не всегда, он серьезно влияет на безопасность или производительность сайта. Но ведь лучше, когда (пусть и совсем чуточку) быстрее и безопаснее?

    Как редактировать WordPress-сайт с помощью создания дочерней темы

    Раньше я редактировал свой сайт v-zdor.com, просто внося изменения в файлы самой темы. Но дело в том, что на этом сайте тема не обновляется. А вот на hachu-site.ru стоит тема Responsive (которую я, кстати, считаю одной из лучших бесплатных тем WordPress) и разработчики время от времени ее улучшают. Можно, конечно, каждый раз заново копировать изменения в обновленную тему. Но это немного хлопотно (особенно если учесть, что мне еще приходиться вносить изменения в файлы самого движка каждый раз после обновления WordPress).

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

    Сделать дочернюю тему WordPress довольно легко. Для этого нужно:

    1. Создать папку в директории, где хранятся темы (wp-content/themes). Как правило, дочернюю тему называют так же, как и родительскую, только добавляют до названия дефис и слово «child». Но делать это необязательно, называйте ее, хоть «Pakasmakabarabaka», работать от этого она не перестанет.директория с дочерней темой WordPress
    2. Скопировать в созданную папку файл style.css вверху которого должна быть надпись вроде этой.

      /*Theme Name: Twenty Ten ChildTheme URI: http: //example.com/Description: Дочерняя тема для темы Twenty TenAuthor: Ваше имяAuthor URI: http: //example.com/about/Template: twentytenVersion: 0.1.0*/

      Причем обязательные поля здесь только Theme Name: (где должно быть название вашей теперешней действующей темы + слово «Child») и Template: (здесь нужно указать название папки темы, которую вы хотите изменить).

    Заголовок дочерней темы WordPress

    Как выглядит шапка моей родительской темы, на которой в данный момент работает hachu-site.ru

    Все! Теперь у вас есть дочерняя тема! В свой новый style.css вы можете полностью скопировать (или импортировать) код со style.css вашей темы и проводить над ним любые эксперименты. Можно также просто взять style.css родительской темы и поменять в нем шапку.

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

    Вот список файлов, которые я редактировал для своей дочерней темы.

    Файлы дочерней темы для темы Responsive

    Хочу отметить, что лучше новичкам ничего не трогать, а ограничиться лишь редактированием style.css. А возможно, для начала лучше обойтись правками селектора body.

    Селектор Body

    Свойства, которые часто редактируют в первую очередь. Background – цвет фона на всем сайте. Color – цвет текста. Font-family – название шрифта. Font-size – размер шрифта.

    А теперь видео, в котором я покажу, как активировать дочернюю тему WordPress и наглядно продемонстрирую пользу от ее создания. Обратите внимание, что даже не исчезала постраничная навигация, которую я реализовал с помощью добавления новой функции, а не с помощью плагина.

    hachu-site.ru

    Редактирование шаблона WordPress | Как создать свой сайт

    Окт-1-2010 Автор: VeryOldMan

    Вы уже видели, сколько шаблонов WordPress платных и бесплатных можно найти в Интернете?  Очень много. Зачем тогда, спрашивается, нужно редактирование шаблона WordPress? А Вы что-то выбрали для своего сайта или блога? Хорошо, если выбранный шаблон подходит Вам идеально и по структуре и по дизайну. Правда такое бывает очень редко. Даже если шаблон поначалу кажется Вам идеальным, позже, внимательно присмотревшись, хочется что-то изменить. Может быть и такой случай. Вы выбрали на каком-то сайте бесплатный шаблон WordPress, но такой же шаблон выбрал кто-то еще, и еще…

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

    А сделать это совсем нетрудно. Откройте папку кого-либо шаблона WordPress. Или двух-трех. В составе каждого шаблона есть папка под названием images.

    Легкое редактирование шаблона WordPress

    Откройте ее. В этой папке находятся графические изображение, которые были использованы при создании дизайна данного WordPress шаблона. Найдите картинку под названием header. Это традиционное название графики шапки сайта или как говорят хедера (header). Может быть, что кто-то из создателей шаблона даст ему другое название, например, часто встречается Top, но Вы всегда можете определить графическое изображение для хедера визуально. Просто установите шаблон на движок WordPress и посмотрите, как выглядит Ваш сайт в этом шаблоне.

    Ну а дальше, редактирование шаблона WordPress, лишь дело техники. Вернее дело для программы Photoshop. Открываем графический файл header в Photoshop и редактируем его по Вашему вкусу. После чего сохраняем его в своей папке images, естественно с заменой установленного ранее файла. Если Вы хотите полностью заменить графический файл в хедере на свой, то и это не проблема. Только свой файл создавайте такого же размера, как и заменяемый. Определить его размер тоже просто. Откройте файл в Photoshop. Откройте меню Изображение – Размер изображения.

    Легкое редактирование шаблона WordPress

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

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

    stroimsajt.ru


    Смотрите также

    Prostoy-Site | Все права защищены © 2018 | Карта сайта