Объемное облако тегов на флеше для 1c-bitrix

Такой способ вывода тегов все больше набирает популярность. В WordPress это давно реализовано в виде плагина, пришло время сотворить нечто подобное под битрикс. Самый простой и быстрый путь — кастомизировать шаблон компонента «Облако тегов».

За основу возьмем плагин «WP-Cumulus» для вордпресса.

Изменения в файлах шаблона компонента:

  • .parameters.php — сюда добавлены описания дополнительных опций для формы редактирования настроек компонента.

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

  • result_modifier.php — убрано все ненужное из стандартного компонента, добавлены проверки на корректность введенных пользователем данных. Тут же находятся настройки по умолчанию.
  • template.php — скрипт для вызова флеш-ролика с нужными параметрами.
  • /lang/ru/.parameters.php и /lang/en/.parameters.php — текстовые константы в UTF8.

Замечание: для корректной работы необходим включенный javascript.

Обновление

Список изменений:
- градиентное изменение цвета тегов в зависимости от популярности
- возможность выбора цвета выделения
- выбор режима вывода: с javascript и без
- альтернативное текстовое облако тегов при отсутствии Flash

Новая версия flash-ролика требует абсолютные ссылки. Для получения имени домена использовалась константа $_SERVER["HTTP_HOST"], что потенциально небезопасно (смотреть тут http://shiflett.org/blog/2006/mar/server-name-versus-http-host).

Если вам понравилась статья, подписывайтесь на обновления блога по rss или присоединяйтесь в twitter

Поделиться ссылкой с друзьями:

Метки: ,

Категории: Bitrix

Комментарии (49)

  1. Wolf11:

    Хотелось бы сказать огромное спасибо автору) Мне тут как раз к Битриксу надо прикрутить вышеописанный плагин.
    Но я установила шаблон, сменила кодировку языковых файлов на ANSI (у меня сайт в windows-1251), облако показывается (что уже неплохо), крутится. Только вот надписи руских тэгов — корявые. И ссылки не работают, даже если тег написан по английски, не говоря уже про русский.
    Может быть Вы знаете, в чём может быть проблема?

  2. Wolf11:

    О, про работу ссылок забудьте. Этот вопрос решён. А вот проблема с кодировкой остаётся:(

  3. Честно говоря не тестировал облако на битриксе в ANSI кодировке
    Можете попробовать сменить кодировку у всех файлов в шаблоне

  4. Wolf11:

    Да, пробовала, не помогает( Пробовала перевести всё в utf-8, включая сайт… разве что бд не трогала. Всё-равно не показывает русские буквы. А Вы брали уже руссифицированный wp-cumulus?

  5. Проверил. Действительно, похоже это флеш привязан к кодировке.
    Вывод: или искать этот плагин под ANSI или в шаблоне «на лету» конвертировать текст. Второй вариант реализовал и отправил Вам на почту.

  6. Centurius:

    Здравствуйте!
    Можно ли и мне направить модификацию шаблона, позволяющую корректно отобращать текст под windows-1251

  7. Centurius:

    2 Алексей Валеев: — спасибо! Все замечательно заработало….! еще вопрос, возможно «дилетантский»
    На скриншоте — визуальное редактирование параметров компонента Облако тегов. Я все правлю в редакторе… Где в Панели управления Битрикса найти визуальный редактор параметров для данного компонента?

  8. Режим разработки — тыкаем иконку компонента — Настройки компонента
    или
    Режим разработки — вверху на панели нажать Компоненты — Облако тегов
    У Вас кодировка ANSI, поэтому сначала надо конвертировать эти файлы:
    /lang/ru/.parameters.php и /lang/en/.parameters.php

  9. Wolf11:

    Алексей, спасибо, что не бросили и помогли.
    Но я просто добавила mb_convert_encoding.
    было:
    $cloud.=’‘.$res["NAME"].’‘;
    стало:
    $cloud.=’‘.mb_convert_encoding($res["NAME"],»UTF-8″,»WINDOWS-1251″).’‘;
    Пока работает. Но м.б. в таком решении есть «подводные камни»? и Ваш вариант более правильный.

  10. Wolf11:

    чёрт, html съелся. Но надеюсь и так понятно.

  11. Тут по ситуации надо смотреть — заработала функция mb_convert_encoding, значит все хорошо и удалось обойтись более простым решением.
    В практике были случаи, когда ни mb_convert_encoding() ни iconv() не хотели корректно перекодировать текст.

  12. Wolf11:

    а отчего это зависит?

  13. Не отвечу, потому что не углублялся в этот вопрос.
    Стояла задача конвертировать текст и писать его в БД, вышеуказанные функции в половине случаев возвращали не то что надо, почему так получилось неизвестно

  14. Centurius:

    Спасибо за ответы, модуль настроен и благополучно работает в кодировке Windows-1251.
    Еще момент, возможно ли (как в оригинальном модуле) окрашивание тегов в разные цвета в зависимости от их «веса», «актуальности»?

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

  16. Centurius:

    На одной из страничек по Wp-cumulus (с вашего позволения приведу ссылку http://www.razor-blog.ru/wordpress/53) есть 3d облако, где теги окрашены в различные цвета. Может быть это поможет…

  17. Спасибо. Обновление выйдет как только появится свободное время

  18. Centurius:

    И еще следом… )
    Если флеш-плеер не установлен, можно ли, чтобы показывались теги в обычном режиме?

  19. Centurius:

    Подскажите, есть ли какие то изменения в проекте касательно ранее озвученных новшеств?

  20. @Centurius: да, шаблон готов, вечером будет обновление

  21. Новая версия доступна для скачивания

  22. Centurius:

    Прежде всего хочу поблагодарить Автора за замечательный шаблон и доработки к нему!
    Далее, вновь хотел бы высказать несколько пожеланий, если их реализация будет возможной :) (тестировал на версии win-1251).
    1. Новая версия шаблона при первой загрузке или обновлдении страницы требует клика на облаке (Click to activate and use this control), чтобы облако начало трансформироваться от передвижений мышки. Предыдущая версия трансформировалась сразу. Можно ли подправить ?
    2. ПРи отсутствии флеш-плеера показываются теги в текстовом виде, однако они склеены (можно ли разделить их пробелами?) и все одного цвета (можно ли также сделать ранжирование по цвету как во флеш версии или оригинальном шаблоне и тд).
    Еще раз благодарю за отличные разработки и кастомизации!

  23. Алексей Валеев:

    1. Не могу повторить проблему дома, все крутится-вертится сразу. Какие браузеры не показывают?
    2. Чтобы разделить теги надо в template.php найти строку $altcloud.="<a… и заменить ее на $altcloud.=" <a…, т.е. добавить пробел (справедливо для win1251 версии)
    Стандартную подсветку текстовых тегов выдернул еще в самом начале разработки, видимо зря:) Добавлю, но когда не знаю, сильно занят.

  24. Centurius:

    1. Не могу повторить проблему дома, все крутится-вертится сразу. Какие браузеры не показывают? — Opera 10.0. В эксплорере действительно все работает сразу
    2. — Спасибо, будем терпеливо ждать )

  25. Игорь:

    Здравствуйте.
    Огромная просьба к специалистам в Битриксе.
    Помогите вставить это облако тэгов.
    Точнее как это сделать пошагово.
    или дайте пожалуйста ссылку на такую информацию.

    За ранее спасибо.

  26. Здравствуйте, Игорь!
    Чтобы установить шаблон компонента нужно:
    1. открыть в файловой структуре /bitrix/templates/[имя шаблона]/components/bitrix/search.tags.cloud/ Последних 1-2-3 каталогов может не быть, нужно в этом случае их создать
    2. скачать и распаковать туда нужную версию с сайта (обновленную)
    3. в визуальном редакторе разместить на необходимой странице компонент «Облако тегов», открыть настройки. Если на 1м шаге все сделано правильно, в выпадающем списке «Шаблон компонента» будет строчка, отличная от «системный». Выбираем ее, настраиваем параметры. Все.

  27. Спасибо большое.
    Все сделал. Работает…Вращается.
    Хотелось бы видеть в облаке только те названия, которые нужны мне.
    А оно само выбирает совсем не то.
    Что можно сделать в током случае?

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

  29. У меня в настройках облака в меню «источник данных» есть «статистические файлы»
    и далее я могу прописывать «путь к этим файлам».
    Может я не там смотрю?
    Просветите пожалуйста..

  30. Все правильно, указывайте каталог, страницы в котором будут участвовать в формировании облака тегов. Затем в свойствах страниц (Панель сверху — Изменить — Заголовок и свойства страницы) нужные теги укажите.

  31. А какого форматы или вида должен быть путь к каталогу (странице).
    Я указал так например
    http://{сайт}/catalog/index.php?SECTION_ID=137
    И Теги для этой страницы.
    Тэги в облаке появились. Но вот если нажать на тэг не происходит поиск этой информации. Выходит пустая страница. Получается не происходит поиск….
    Что делать?

  32. Пробуйте указать в качестве пути http://{сайт}/catalog/
    Что значит пустая страница? Совсем пустая или в результатах поиска ничего не найдено?
    Не очень удобно общаться в комментариях, пишите на alexeyvaleev[собака]gmail.com

  33. Имантс:

    Спасибо огромное, все заработало так как надо.

  34. Елена:

    Спасибо автору. Оказалось все достаточно прозрачно. Вот просто большое человеческое спасибо!

  35. Вячеслав:

    Огромное спасибо! Сделать такую штуку на сайте за 2 минуты — залог хорошего настроения на всю неделю!!! Спасибо!

  36. Александра:

    Огромное спасибо!Крутая вещь!
    Только такой вопрос-иногда при обновлении страницы,слова в облаке подгружаются не полностью,только первые три буквы,или вообще только первая буква слова.Скажите,в чем может быть причина?
    Установлена версия облака для кодировки win-1251

  37. ALreD:

    А у меня была такая проблема…
    Видимо мой компонент страый — битрикс 7-ка лицензия. В настройках нету галочки включить прозрачность. Потому — все работает — но на фоне белый квадрат.
    Я решил проблему в лоб… Принудительно в шаблоне убрал условие в коде и прописал строку напрямую — $flashtag .= »;
    После этого все заработало как надо. Возможно метод и туповатый — но меня устраивает) Вдруг кому поможет…
    А автору — респект!

  38. ALreD:

    Упс… Чать кода съелась куда-то! Ну кто посмотрит код — тот поймет о чем я написал… Почему то данная форма съедает часть кода… Поправить не могу…

  39. Роман:

    Алексей, спасибо! Очень пригодилось! Было бы круто плагин ILWP Colored Tag Cloud в битриксе реализовать!

  40. Я так понял это обычное облако тегов, раскрашенное в разные цвета. Дефолтное облако от битрикса так умеет вроде

  41. Александра:

    Алексей,скажите пожалуйста,а что нужно поменять в коде компонента,чтобы теги вращались в виде овала?а не по сфере?

  42. Надежда:

    Александра, А вы решили проблему вывода не полного названия тега? У меня та же проблема, и тоже облако win-1251.

  43. Здравствуйте!
    У меня почему при нажатии на тег в облаке открывается страница поиска… а нельзя ни как сделать облако что бы при нажатии открывалась определенная ссылка.
    Не сочтите за рекламу но хотелось бы что бы работало что то вроде облака не следующем сайте sumirea.ru

  44. Алексей Валеев:

    Облако тегов в битриксе работает именно так.

  45. Александр:

    Огромное спасибо

  46. o1eg:

    Здравствуйте!

    Что нужно подправить и в каком файле, что бы теги вращали постоянно? При фокусе мышки естественно останавливалось вращение.

    Спасибо.

  47. Алексей, просто хочется сказать большое спасибо. Скольким помогли, скольких порадовали =Р

  48. Александр:

    Здравствуйте! Можно ли и мне направить модификацию шаблона, где «на лету» конвертируется текст.