Автоматический вывод списка радиостанций (плагин)

Akimu

Akimu

Web Designer
Сообщения
175
Реакции
29
Автоматическое формирование добавленных вами в базу радиостанций на отдельной страницы

Заходим в админпанель/Главное меню и добавляем новую страницу с названием "Радиостанции" и url "/page/radiolist".

В templates/Ваш шаблон/pages/ создаем radiolist.tpl с содержимым:
Код: 
{include
   file="header.tpl"
   page_meta_title='Радиостанции слушать онлайн'
   page_meta_description='Список популярных радиостанций.'
   page_meta_keywords=''
 }
<div class="radiolist">
{getRadiolist}
{foreach $radiolist as $radio}
<a href="/pages/{$radio.url}/" class="pajax-link radiolist__item" >
<img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
<h3 class="radiolist__title">{$radio.name}</h3>
</a>
{/foreach}
</div>

{include file="footer.tpl"}
Доступно использование:

$radio.rid - ID радиостанции
$radio.name - название радиостанции
$radio.poster - постер радиостанции
$radio.url - url радиостанции (/europa-plus к примеру)
$radio.text - описание радиостанции

В файл с вашим css добавляем (правим под себя):
Код: 
.radiolist{display: block;position: relative;padding: 20px 0;}
.radiolist__item{width: 49%;position: relative;float: left;margin-right: 1%;}
.radiolist__item:nth-child(2n) {margin-right: 0;}
.radiolist__item img{max-width: 100%;min-height: 280px;}
Далее скачиваем и заливаем файл с архива.
 

Вложения

H

Hell1g

Активист
Клиент
Сообщения
13
Реакции
3
Может кто сможет помочь, постеры радио идут столбиком, а хотелось бы на всю страницу. Есть варианты как это можно исправить?
 

Вложения

MSE-Script

MSE-Script

Developer
Команда форума
Сообщения
867
Реакции
309
@Hell1g, Универсальный код, для выстраивания элементов в строку (не проверялся).
HTML: 
<div class="radio-box">
    <div class="radio-box__item">
      <!-- Элемент списка радио -->
    </div>
</div>
CSS: 
.radio-box{
    display: flex;
    flex-wrap: wrap;
}

.radio-box {
    max-width: 100px;
}
 
H

Hell1g

Активист
Клиент
Сообщения
13
Реакции
3
MSE-Script написал(а):
@Hell1g, Универсальный код, для выстраивания элементов в строку (не проверялся).
HTML: 
<div class="radio-box">
    <div class="radio-box__item">
      <!-- Элемент списка радио -->
    </div>
</div>
CSS: 
.radio-box{
    display: flex;
    flex-wrap: wrap;
}

.radio-box {
    max-width: 100px;
}
Нажмите для раскрытия...
А что с html делать? Обернуть им этот скрипт?

Код: 
<div class="radiolist">
{getRadiolist}
{foreach $radiolist as $radio}
<a href="/pages/{$radio.url}/" class="pajax-link radiolist__item" >
<img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
<h3 class="radiolist__title">{$radio.name}</h3>
</a>
{/foreach}
</div>
 
MSE-Script

MSE-Script

Developer
Команда форума
Сообщения
867
Реакции
309
@Hell1g, Замените ваш код на этот:
PHP: 
<div class="radiolist radio-box">
    {getRadiolist}
    {foreach $radiolist as $radio}
        <a href="/radio/{$radio.url}/" class="pajax-link radiolist__item radio-box__item">
            <img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
            <h3 class="radiolist__title">{$radio.name}</h3>
        </a>
    {/foreach}
</div>
 
H

Hell1g

Активист
Клиент
Сообщения
13
Реакции
3
MSE-Script написал(а):
@Hell1g, Замените ваш код на этот:
PHP: 
<div class="radiolist radio-box">
    {getRadiolist}
    {foreach $radiolist as $radio}
        <a href="/radio/{$radio.url}/" class="pajax-link radiolist__item radio-box__item">
            <img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
            <h3 class="radiolist__title">{$radio.name}</h3>
        </a>
    {/foreach}
</div>
Нажмите для раскрытия...
Заменил и радио как было по вертикали так и осталось, но весь текст на сайте стал жирный:D Откатил, но ответа не последовало, хз что делаю не так....
 
MSE-Script

MSE-Script

Developer
Команда форума
Сообщения
867
Реакции
309
@Hell1g, Скорее всего случайно дропнули лишний тэг. Выложите сюда код файла шаблона целиком, чтобы видеть куда именно вставляете код.
 
H

Hell1g

Активист
Клиент
Сообщения
13
Реакции
3
MSE-Script написал(а):
@Hell1g, Скорее всего случайно дропнули лишний тэг. Выложите сюда код файла шаблона целиком, чтобы видеть куда именно вставляете код.
Нажмите для раскрытия...
Код: 
{strip}
{include
   file="modules/header.tpl"
   page_meta_title='Слушать радио онлайн бесплатно'
   page_meta_description='Здесь Вы сможете слушать радио онлайн бесплатно.'
   page_meta_keywords='radio, радио онлайн'
 }

<div class="cols fx-row">

      {* Sidebar *}
      {include file="modules/sidebar.tpl"}

      {* Колонка с контентом *}
      <div class="col-main fx-1">

         {* Topline *}
         {include file="modules/topline.tpl"}

         {* Основной контент *}
         <main class="content pajax-content">


<div class="radiolist radio-box">
    {getRadiolist}
    {foreach $radiolist as $radio}
        <a href="/radio/{$radio.url}/" class="pajax-link radiolist__item radio-box__item">
            <img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
            <h3 class="radiolist__title">{$radio.name}</h3>
        </a>
    {/foreach}
</div>


      </div>

</div>

{include file="modules/footer.tpl"}
{strip}
 
MSE-Script

MSE-Script

Developer
Команда форума
Сообщения
867
Реакции
309
@Hell1g, Как минимум, не вижу у вас закрывающего тега </main>.
 
MSE-Script

MSE-Script

Developer
Команда форума
Сообщения
867
Реакции
309
@Hell1g, Значит у вас какие-то стили шаблона перебивают нужные.

Попробуйте еще так:
HTML: 
<div class="radio-box">
    {getRadiolist}
    {foreach $radiolist as $radio}
        <a href="/radio/{$radio.url}/" class="pajax-link radio-box__item">
            <img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
            <h3 class="radiolist__title">{$radio.name}</h3>
        </a>
    {/foreach}
</div>
Не забудте добавить стили в ваш CSS файл:
CSS: 
.radio-box {
    display: flex;
    flex-wrap: wrap;
}

.radio-box__item {
   max-width: 97px;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
   margin: 5px;
}
 
H

Hell1g

Активист
Клиент
Сообщения
13
Реакции
3
@MSE-Script, Еще раз огромное спасибо за помощь.

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

HTML: 
<div class="radio-box">
    {getRadiolist}
    {foreach $radiolist as $radio}
        <a href="/radio/{$radio.url}/" class="pajax-link radio-box__item">
            <img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
            <h3 class="radiolist__title"></h3>
        </a>
    {/foreach}
</div>
CSS: 
.radio-box {
         display: flex;
         flex-wrap: wrap;
        }

        .radio-box__item {
         max-width: 97px;
         box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
         margin: 5px;
        }
 

Вложения

Coilfenix

Coilfenix

Ветеран
Сообщения
84
Реакции
30
Hell1g написал(а):
@MSE-Script, Еще раз огромное спасибо за помощь.

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

HTML: 
<div class="radio-box">
    {getRadiolist}
    {foreach $radiolist as $radio}
        <a href="/radio/{$radio.url}/" class="pajax-link radio-box__item">
            <img src="{$radio.poster}" alt="{$radio.name} слушать онлайн">
            <h3 class="radiolist__title"></h3>
        </a>
    {/foreach}
</div>
CSS: 
.radio-box {
         display: flex;
         flex-wrap: wrap;
        }

        .radio-box__item {
         max-width: 97px;
         box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
         margin: 5px;
        }
Нажмите для раскрытия...
Парочку правок:
<h3 class="radiolist__title"></h3> Лишнее, если ты не выводишь название радио под картинками, а если выводишь, то правильнее: <h3 class="radiolist__title">{$radio.name}</h3>

<img src="{$radio.poster}" alt="{$radio.name} слушать онлайн"> вместо alt нужно писать title, чтобы при на ведении на постер с радио выводилось его название возле мышки: <img src="{$radio.poster}" title="{$radio.name} слушать онлайн">

А так забрал себе;)
 
H

Hell1g

Активист
Клиент
Сообщения
13
Реакции
3
Coilfenix написал(а):
Парочку правок:
<h3 class="radiolist__title"></h3> Лишнее, если ты не выводишь название радио под картинками, а если выводишь, то правильнее: <h3 class="radiolist__title">{$radio.name}</h3>

<img src="{$radio.poster}" alt="{$radio.name} слушать онлайн"> вместо alt нужно писать title, чтобы при на ведении на постер с радио выводилось его название возле мышки: <img src="{$radio.poster}" title="{$radio.name} слушать онлайн">

А так забрал себе;)
Нажмите для раскрытия...
Про наведение на постер это ты четко дополнил, а я думал зачем написано "слушать онлайн" если оно нигде не фигурируется :)
 
V

veenrok

Активист
Клиент
Сообщения
19
Реакции
7
Fatal error: Uncaught --> Smarty: Unable to load template 'file:header.tpl' in 'pages/radiolist.tpl' <-- thrown in /var/www/www-root/data/www/site.org/vendor/smarty/smarty/libs/sysplugins/smarty_internal_template.php on line 195
Такая ошибка на странице списка радио
 
V

veenrok

Активист
Клиент
Сообщения
19
Реакции
7
Плагин устарел, кто не то переделывал ?
 
Rus

Rus

Эксперт
Клиент
Сообщения
161
Реакции
14
Да тут уже все устарело, а разраб по ходу забил на форум, очень много информации не актуальной под версию 3.5
 
U

ushkom

Ветеран
Клиент
Сообщения
122
Реакции
10
Кто силен, оптимизируйте пожалуйста плагин под 3.5
Спасибо
 
U

ushkom

Ветеран
Клиент
Сообщения
122
Реакции
10
Никто не может подправить модуль, или желания нет?
 
Войдите или зарегистрируйтесь для ответа.

Похожие темы

Dr.Zlo
ClickTimes - плагин интергации кода ПП clicktimes
Ответы
0
Просмотры
1K
Dr.Zlo
Dr.Zlo
MSE-Script
LastSets v1.0 - плагин для вывода подборок
Ответы
4
Просмотры
2K
Winst
W
MSE-Script
LastTracks v1 - Плагин вывода треков
Ответы
11
Просмотры
3K
bobokhon1998
B
U
Вывод постера в rss ленте
Ответы
5
Просмотры
2K
ushkom
U
Сверху