Табы на страницах объявлений в Classipress

Модернизация DMaster

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

И так, приступим.

1. Для начала необходимо сделать разметку в файле single-ad_listing.php. Откройте его на редактирование и вставьте после строки:

cледующий код:

2. Добавьте в конец файла footer.php Java скрипт:

3. Дополните style.css вашей темы кодом:

Если все сделано правильно, то должно получится так:

Панель вкладок в Classipress

Теперь внутрь, вместо текста «Содержание … вкладки» вам только остается поместить коды, которые будут выводить контент соответствующий наименованиям табов.

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

1. Зайдите на сайт Fontello.com. На вкладке Select Icons найдете коллекцию иконок.

2. Выберите те иконки, которые хотите использовать у себя и скачайте (Download webfont) архив на компьютер.

Шрифтовые иконки fontello

3. Распакуйте архив, и закачайте на хостинг посредством FTP папки css и font со всем содержимым в папку — ../classipress/.

4. Откройте на редактирование файл wrapper.php вашей темы и между тегами head — добавьте строку:

5. Добавлять иконки следует так:

Здесь название класса тега i соответствует названию конкретной выбранной вами иконки, а сами названия иконок можно посмотреть в файле demo.html из вышеупомянутого архива.

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

D.Master

DMaster

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

E-mail

10 комментариев

  1. 3.5.1 Появляются табы, но описание в них не выходит. И между собой не переключаются(((

    • DMaster

      Проверьте в настройках Classipress на предмет включения опцию «Использовать Google jQuery»

      • К сожалению не меняет проблемы. Если отключить «Использование сервис ускорения сайта Google», то показывает карта справа в стандартном баре. Если включен сервис — то карта не загружается в правом баре. В этом разница. Больше ничего к сожалению не поменялось…( Жаль… Будем ждать других фишек)))

        • DMaster

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

  2. Очень качественно и красиво сделал DMaster на моей доске, рекомендую!!!

  3. Классная фишка! Спасибо! У меня лично всё перещелкивает. Только вот не пойму откуда могу взять коды контента. Подскажите пожалуйста где их посмотреть можно! ( код: Описания, карта, похожих объявлений и комментариев)

    • DMaster

      Посмотреть коды вывода Описания и Комментариев можно непосредственно на странице объявления, т.е. в файле single-ad_listing.php. Карты — в sidebar-ad.php. Код Похожих объявлений можете взять этот https://procp.ru/poxozhie-obyavleniya-s-miniatyurami-v-classipress/ или какой-нибудь аналогичный.

  4. Спасибо! Буду разбираться! А за скриптом похожих объявлений думаю скоро к вам обращусь.

  5. Не могу добиться переключения табов( «Использование сервис ускорения сайта Google» и включал и выключал, что только не делал. В чем может быть проблема?

    • PROCP

      Проверьте на предмет конфликта с другими скриптами.

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

  Отправляя комментарий я принимаю Политику кофиденциальности сайта *