HTML2WP. Серия #2. Разбор файлов. Подключение стилей, скриптов настроек

Артем Абрамович

Меня зовут Артем Абрамович и я являюсь фрилансером-вордпресером. Занимаюсь настройкой и редактированием сайтов созданных на CMS WordPress. Это основная моя специализация, есть еще несколько работ, которыми я занимаюсь, но обо этом вы можете более подробно узнать из моего портфолио.

100 комментариев к “HTML2WP. Серия #2. Разбор файлов. Подключение стилей, скриптов настроек”

  1. и снова здраствуйте! ) У меня несколько вопросов, но не по теме видео. буду очень благодарна за ответ!

    1) Я в поиске плагина для вывода статей в рубрику “ТОП”. Изрыла весь интернет,ничего однозначно хорошего не нашла. Топы по рубрикам мне не очень нравится. Хотелось бы что-то найти для всех статей, без учета рубрик.

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

    Ответить
    • Добрый день!
      1. Как-то задача у вас странно звучит. ВЫ или рубрику Топ делайте и туда нужные статьи добавляйте или просто используйте что-то вроде Популярных статей. Просто надо определиться с параметром популярности – по коментам, по просмотрам, а может просто в ручную. Вот тогда и искать нужное
      2. Последние коменты – это же штатный виджет ВП. Или вам надо как-то по хитрому эти коменты выводить?

      Ответить
    • +WPRUSe · Финты WordPress
       1) я имела ввиду топ по популярности/просмотрам. 2) штатный у меня в теме не отображает сами комментарии. Просто пишет ” Вася написал в рубрику !гворди в стакане!”, а это не особо цепляет аудиторию. Мне бы хотелось, чтобы отображался сам комментарий.

      Ответить
    • 1. Что бы так записи выводить надо сначала просмотры прикрутить. Посмотрите у wp-kama.ru у него есть уже готовое решение
      2. Хм, ну это точно есть плагины в репозитории. Поищите по тегам widget comments

      Ответить
  2. зачем подключать стили отдельно? по 5-10 штук. Что бы какой-то из них отключить(допустим стал не нужен) надо будет лезть в код. Т.е. из админки их не отключить. И вообще, все давно перешли на sass/less. Какой смысл в отдельном подключении?

    Ответить
    • 1. Так устроен ВП, возьмите любую тему и посмотрите как в ней подключаются стили и скрипты
      2. Если говорить просто про пользователей, то никто и никогда не отключает такие файлы. На крайняк можно настройку запилить, чтобы была возможность из админки отключать
      3. sass/less используют на стадии верстки темы из макета, в данном случае имеем готовый хтмл-шаблон и sass/less не имеет смвсла подключать
      4. Да, файлов много, но это так сверстана тема. В итоге все файлы стилей можно и нужно объединить в один. Но про это будет отдельное видео , когда подойдем к оптимизации сделанного

      Ответить
    • Где вы ее откопали. тему эту? Уже 2017 год. Импортами в css уже никто не пользуется. Я так и не понял зачем раздельно подключать стили. Зашел в sass отредактировал, перекомпилировал в css. Понятно что пользователь таким из админки заниматься этим не будет(стили отключать), а мне это зачем?
      Что значит на стадии верстки? Есть кто и прямо в теме верстает, с самого начала.

      Ответить
    • Сие не важно, где откопал. Зато бесплатно и более-менее прилично. А так да, вертка старенькая…

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

      Представьте себе, что есть, например, командный проект: один чел рисует макет, другой верстает хтмл, третий натягивает на ВП. В нашем случае – как раз рассматривается третий товарищ. И если предыдущий так сверстал не используя сас, то все вопросы к нему)) Хотя за такое конечно надо по голове стучать)))

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

      Ответить
  3. У меня проблемка появилась. Вот я все как в видео скопировал из шаблона style.css в папку темы все файлы. открываю свой сайт и открываю просмотреть код. вижу, что все скопированное не подключилось. Что мне нужно сделать?

    Ответить
    • Это значит что файл стилей не подключен или возможно в браузере закешировалось. Нажмите Ctrl+F5 несколько раз, если ничего не меняется, значит проверяйте подключение

      Ответить
  4. Я этот урок осилил. Единственное, Артем, я не могу найти файлы с переводом. В видео вы сказали что они будут для нас бонусом. Где их искать?

    Ответить
  5. Большое спасибо Вам за эти прекрасные уроки, нравится Ваш стиль подачи материала, продолжайте в том же духе. Подписка, лайк)
    Такой вопрос возник с подключением стилей.
    Стили подключаются вот так:


    Как я понимаю это чтобы в разных браузерах подключались разные стили. Как это все делается с помощью средств wordpress? Как определять версии браузеров? Спасибо.

    Ответить
    • То есть их не нужно подключать в файле functions.php с помощью wp_enqueue_style() ? Оставлять как есть в разделе head, только путь до файла поменять?

      Ответить
  6. Автор, что хочу я сказать, конечно, вижу неточности, косяки, и то, что 45 ошибок было в конце видео и т д и т п, НО материал просто супперски полезный, пусть и не весь, но за такие видео БОЛЬШУЩИЙЙ респект!

    Ответить
    • Рад, что все нравится. Про ошибки подробнее можно, так сказать обратную связь, чтобы их потом не делать

      Ответить
    • Из тех что я называю “косяков” это непрофессиональный подход, хоть повторюсь, видео качественные и несут ОГРОМНУЮ пользу. Косяки в этом видео – мы на самом деле не подключили множество js файлов, так как там нужно было указать еще и правильный путь, либо подключать файлы отдельно. Я это сразу заметил и меня обеспокоило, что мы еще не решили первый вопрос, как сразу переходим ко второму. Также мы даже не перенесли папку с парой js файлов, которые, наверное, нужны. Потом произношение хтмл, ну это ппц=)) И некоторые мелкие вещи, с которыми лично я не очень согласен, но это может мои тараканы. Но За видео ОГРОМНОЕ СПАСИБО!

      Ответить
    • Хм, глобально понятно, буду исправляться. Спасибо за конструктив

      Ответить
  7. не понял в чем разница подключения плагина OptionTree. Как все таки лучше использовать? В режиме темы или в режиме плагина?

    Ответить
    • В режиме плагина просто он будет в списке плагинов и у него будут настройки видны. В режиме темы – настроек не будет, вроде как получаются невидимые настройки)

      Ответить
    • То есть по большому счету все равно как его использовать? Кстати, настройки можно же отключить , когда заку сдаешь. Можно через функции отключить или есть плагин такой, забыл как называется, можно найти… короче он позволяет отключить все ненужное в админке, просто ставим галки.

      Ответить
    • Так то да, можно как угодно использовать. Разницы нет

      Ответить
    • А возник такой вопрос, если делать с интеграцией в тему и если плагин обновится, как быть тогда

      Ответить
    • Никак, только вручную копировать обновленный плагин в файлы темы

      Ответить
  8. Хотел переименовать папку в ” domains”. В итоге вернул прежднее название, но теперь не могу попасть в вордпресс. В чем может быть предлема?

    Ответить
    • А зачем переименовывать папку и где именно? В опенсервере?

      Ответить
    • WPRUSe · Финты WordPress некорректно описал ситуацию: в папке “domains” были похожие проекты, по этому хотел переименовать

      Ответить
    • Все равно не понял) В папке domains должны храниться все проекты, к ней опенсервер обращается. Если не находит, проверьте может ссылки доступа изменились. Но наверное проще будет по новой просто все сделать

      Ответить
  9. Здравствуйте, Артем.
    Вопрос возник, делал один в один (в конечном итоге даже с гитхаба полностью скопировал function, только поменя название Slug на свой).
    Итог: css – подключены все файлы, js – только один (script.js) остальные ни в какую (делал не на локальном, а на хостинге непосредственно).

    Ответить
    • тоже самое, после попытки подключить js появляется 11 ошибок в консоли и подключается, только script.js – https://goo.gl/6bSGUf

      UPD: ряд ошибок исправил (не хватало файла: magnific-popup, добавил + у anime.css не совсем верно путь подключения был указан) Остались ошибки связанные только с js, причем в одной из них, сообщается, какая-то переменная в script.js не работает. Непосредственно ресурс, где клепаю тему: https://goo.gl/C9s4Js

      Ответить
    • Эт потому что там такой файл скриптов. В нем одном подключаются все другие. В следующих сериях я все это разношу по нормальному

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

      Ответить
    • Понял, меня смутило только то, что в исходном коде они автоматом у подцепились, а у меня только один файл.
      Спасибо что разжевали. Буду считать, что js у меня нормально подключен о_О (хотя меня все равно терзают смутные-сомнения)

      Ответить
  10. Здравствуйте.
    При подключении плагина способом, когда закидываем папку в каталог темы, при вставки кода /**
    * Required: set ‘ot_theme_mode’ filter to true.
    */
    add_filter( ‘ot_theme_mode’, ‘__return_true’ );

    /**
    * Required: include OptionTree.
    */
    require( trailingslashit( get_template_directory() ) . ‘option-tree/ot-loader.php’ );

    вылазит ошибка:

    Fatal error: require(): Failed opening required ‘E:OpenServerdomainswp-posadka-verstky/wp-content/themes/business/business/option-tree/ot-loader.php’ (include_path=’.;e:/openserver/modules/php/PHP-5.6;e:/openserver/modules/php/PHP-5.6/PEAR/pear’) in E:OpenServerdomainswp-posadka-verstkywp-contentthemesbusinessbusinessfunctions.php on line 10

    Опять-таки, не переводит плагин вообще, когда закидываю файлы перевода ( po и mo ) если кастомно устанавливать плагин… Помогите пожалуйста.

    Ответить
    • Хм, что не так у вас с сервером, надо проверять. Вам говорят что не могут подключить файл. Проверьте есть ли у вас файл по данному пути. И еще момент, я все показываю на сервере с php 7. В этом еще может быть ошибка

      Ответить
    • у меня тоже стоял PHP7 – вышла ошибка, потом перевел на 5.6 – то-же самое. Файлы проверял – есть… Поковыряю – отпишу – не знаю получиться-ли … Спасибо за оперативность и за уроки.))

      Ответить
  11. Еще одна проблема возникла. При добавлении фильтра add_filter( ‘ot_theme_options_parent_slug’, ‘theme_option_parent’,20); вылазит ошибка Warning: call_user_func_array() expects parameter 1 to be a valid callback, function ‘theme_option_parent’ not found or invalid function name in E:OpenServerdomainswp-posadka-verstkywp-includesclass-wp-hook.php on line 298 . Когда убираю код фильтра – ошибка исчезает… PHP-7 стоит.

    Ответить
    • Что не правильно делаете. Проверьте как у меня в исходнике. У меня-то все работает, значит где-то или запятую забыли или еще что, в том же роде

      Ответить
    • Это жесть в add_filter( ‘ot_theme_options_parent_slug’, ‘theme_options_parent’,20); написал add_filter( ‘ot_theme_options_parent_slug’, ‘theme_option_parent’,20); Все норм))) Спасибо))

      Ответить
    • А, так названия функций разные, потому и не пашет) Внимательнее надо

      Ответить
  12. Очень режет слух ХТМЛ) А так, все очень качественно и понятно)

    Ответить
  13. Привет.не по теме….не знаю какая партнерка ютуба…. НО реклама каждые 5 мин это перебор((( Причем одна и та же гребаный викс(
    ………………….
    поправлю…КАЖДЫЕ 2 минуты реклама викс((((((((( смотреть невозможно. только скачивать.
    на сколько я знаю,эти параметры можно настраивать…

    по теме:
    СПАСИБО за труд!!!!

    Ответить
  14. Делал первый раз все получилось, все здорово. Начал делать на втором проекте после Деактивации плагина OptionTree вылезла ошибка
    Notice: Only variables should be passed by reference in C:open_serverOpenServerdomainstest-jermes.comwp-contentthemestestthemaoption-treeot-loader.php on line 329
    Кто знает, с чем связано ? Заранее благодарен за ответ

    Ответить
    • Это не ошибка, а предупреждение. Связано с php 7.0. OptionTree некорректно с php 7 работает. В курсе есть решение в одном из видео

      Ответить
    • Нет, надо внимательно третью или четвертую (точно не помню) серию посмотреть, там есть решение. Надо будет добавить небольшие исправления в код OptionTree

      Ответить
  15. underscores так шаблон изменили – куча новых функций, и удалить ничего не дает – сразу фатал эррором ругается(((

    Ответить
    • Дак удалять надо правильно. Там все функции друг на друга завязаны

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

    Ответить
    • что плохого в групировке контента?тут просто для новичка хз вобще что такое настройщик тем на WP если он искал как создать свою первую тему.

      Ответить
    • Да ничего плохого… Только не понял причем тут настройщик?

      Ответить
  17. option tree не обновлялся уж очень давно.Разумно ли его использовать, есть ли ему альтернативы?

    Ответить
    • Ну он же работает, то что не обновлялся – это не страшно. А альтернатив вагон – Carbon Fields, Unison и тд

      Ответить
    • Ясно. Advanced Custom Fields тоже является альтернативой (часто замечаю в требованиях навыки работы с этим плагином ) или он предназначен для других целей?

      Ответить
    • Можно и ACF использовать, только там самое вкусное в платной версии

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

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

      Ответить
  19. Если у вас вылезет ошибка в ot-loader 330 строка – просто вынесите то что в скобках внутри end в переменную и вставьте саму переменную в скобки

    Ответить
  20. в конце урока уже, после подключения php файлов настроек и метабокса, консоль стала плеваться на ошибку подключения к google fonts api(внутри Option Tree), типа Daily Limit for Unauthenticated Use Exceeded. Continued use requires signup, я вставил в 5220 строку новый api ключ, просто погуглил google font api key, был сгенерирован новый.
    А это вообще надолго, или придется искать альтернативное решение, если отдавать сайт?

    Ответить
    • Хм, не знаю. Не проверял сей момент, но это может быть связано с отсутствием https. Видимо фремворк глючит, все же давно не обновлялся

      Ответить
    • Может у Вас есть мысли по поводу аналогов Option Tree?
      Или он настолько хорош, что проще на сегодняшний день чуть поправить ошибки и дальше пользоваться?
      А если хороших аналогов несколько, может даже вот и доп тема для видео, что бы сравнить плюсы и минусы)
      Спасибо!

      Ответить
    • Аналогов вагон. Платный ACF Pro, бесплатный Carbon Fields. Просто когда курс записывался, мне было удобно с Option Tree работать, сейчас да, это уже довольно устаревшая система

      Ответить
  21. Здравствуйте.. у меня при добавлении кода: require( trailingslashit( get_template_directory() ) . ‘/option-tree/ot-loader.php’ );
    НА сайте вылезла ошибка: Fatal error: require(): Failed opening required ‘0php’’ (include_path=’.;c:/ospanel/modules/php/PHP-5.6-x64;c:/ospanel/modules/php/PHP-5.6-x64/PEAR/pear’) in C:OSPaneldomainsthemstestwp-contentthemesdoitcoolslugfunctions.php on line 21 все делал по интсрукции перепроверил все три раза… Подскажите в чем может быть проблемма?

    Ответить
    • Скорее всего в версии PHP. Должна быть не ниже 5.6, а лучше 7-я

      Ответить

Добавить комментарий

%d такие блоггеры, как: