Здравствуй, уважаемый друг!

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

Спасибо за понимание.

Теперь мы команда!

Добавление 3D облака тегов в E-commerce

Автор: в категории Создание сайтов, Статьи о JavaScript, Статьи о php 11 комментариев

Пост навеян желанием прикрутить трехмерное облако тегов на интернет-магазин wp e-commerce. Поиском плагинов я не стал себя утруждать, ибо это во-первых достаточно просто, а во-вторых — плагинов таких на скорую руку я не нашел и мне стало лень их дальше искать.

Итак, собственно как добавить 3D облако тегов в интернет магазин на wp-e-commrece?

Для начала откроем файл tagging_functions.php, который находится в директории: wp-content/plugins/wp-e-commerce/wpsc-widgets/
Найдем там строчки:

default :

$return = "<div id='product_tag_wrap'>".join( "\n", $a )."</div>";

break;

Добавляем теги div, следующим образом (Flash облако тегов):

default :

$return = "<div id='product_tag_wrap'><div id='tags'>".join( "\n", $a )."</div></div>";

break;

После этого, открываем файл header.php, находящийся по адресу: wp-content/themes/ваша-тема/
И туда добавляем код, подключающий все файлы:

<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
 function  myTags(mytags){
 mytags=mytags.replace(/<A/g, '<a')
 .replace(/\/A>/g, "/a>")
 .replace(/(\starget=_)(\w*)/g, ' target="_$2"')
 .replace(/(\sclass=)(?!")(\w*)/g, '')
 .replace(/(\sname=)(?!")(\w*)/g, ' name="$2"')
 .replace(/(\sid=)(?!")(\w*)/g, ' id="$2"')
 .replace(/(\srel=)(?!")(\w*)/g, ' rel="$2"');
 mytags=encodeURIComponent(mytags).replace(/!/g, '%21')
 .replace(/'/g, '%27').replace(/\(/g, '%28')
 .replace(/\)/g, '%29').replace(/\*/g, '%2A');
 var rnumber = Math.floor(Math.random()*9999999);
 var flashvars = {
 tcolor:"0x2A62C8",
 tcolor2:"0x000000",
 hicolor:"0xB12AC8",
 tspeed:"110",
 distr:"true",
 mode:"tags",
 tagcloud:mytags
 };
 var params = {
 allowScriptAccess:"always",
 wmode:'transparent'
 };
 var attributes = {
 id:"flash_cloud"
 };
 swfobject.embedSWF("tagcloud.swf?r="+rnumber,
 "tags", "100%", "300", "9.0.0",
 "expressInstall.swf", flashvars,
 params, attributes);
 }

 window.onload=function(){
 var mytags="<tags>"
 +document.getElementById('tags').innerHTML
 +"</tags>";
 myTags(mytags);
 };
</script>

Все файлы качаем из предыдущего поста или по ссылке ниже и загружаем в корень сайта.
Flash облако тегов
Скачать исходники + Демо

После того, как мы успешно добавили облако тегов к нам в интернет-магазин, мы можем им полюбоваться…Стоп, куда делись пробелы между словами? — спросите вы. Эту проблемы решаем всего лишь комментирование единственной строки в файле tagging_functions.php:

$tag = str_replace( ' ', ' ', esc_html( $tag ) );

Все, на этом наши труды заканчиваются. Если статья помогла — напиши коммент, если у тебя есть решение лучше — пиши коммент!
Всем спасибо за внимание! =)

comments powered by HyperComments

roslic
2011-08-03 14:47:49
Заработало, но на половину. Я так понимаю в виджете Метки товаров должно было появиться 3D облако. Однако этот виджет остается без изменений. Я добавил виджет типа текст-html и вставил туда скрипт из index.html демо-версии. Демо-облако нормально работает. А как сделать чтоб крутились метки товаров?
Nikita_Sp
2011-08-03 14:56:22
А вы внесли изменения в файл tagging_functions.php, который находится в директории: wp-content/plugins/wp-e-commerce/wpsc-widgets/ ? Делайте все согласно инструкции. Пример рабочего облака http://наперники.com
roslic
2011-08-04 14:42:05
Заработало. Большое спасибо! Оказывается не правильно вставил скрипт в header, после . Возникла новая проблема, не связанная с 3D. Может подскажете где копать. Если метки создаю один товар - одна метка, все нормально по нажатию на метку выходит товар с этой меткой. Если на одну метку есть два товара, то выводятся 2 раза по 2 товара и все куда-то сбивается, footer сбоку и тп. Если 3, то выводит 3 раза по 3.
Nikita_Sp
2011-08-04 23:52:16
Уважаемый, у вас все верно работает, килограммы то разные! Там 10 а там 16! =) Будьте внимательны, и спасибо что зашли =)
Артем
2011-10-10 23:01:51
Приветсвую! Дорогой друг, подскажи пожалуйста, в чем может быть проблема. Я вывожу виджетом метки товаров. Но есть один подвох... при нажатии на метку товара все вроде бы правильно, но если эту метку содержит много товаров и их скажем на 2-3 страницы, то при нажатии на 2 или 3 страницу, меня перебрасывает на 2 страницу products-page. Чем можно вылечить данный недуг?
Nikita_Sp
2011-10-11 02:17:57
Посмотрите функцию, которая формирует и выводит ссылки. Нужно копаться, сейчас сразу не отвечу.
iCherya
2011-11-29 22:37:52
А как можно реализовать вывод тегов товаров не через 3d-облако, а через выпадающий список?
Nikita_Sp
2011-11-30 00:20:08
В этом файле Вы можете отформатировать любое представление облака тегов. Т.е. в цикле формируются ссылки на теги (.join( "\n", $a ).). Их можете взять в тег select, и найти где реализуется непосредственно формирование ссылки, на данный момент пока не знаю где, некогда искать, извините.
Кирилл
2012-11-22 14:27:02
Добрый день, очень полезная и интересная тема, все сделал, все работает, но есть один ньюанс когда переходишь на страницу 3 уровня сайт/товары/сумка тэги почемуто не показываются? что сделать не подскажите? отоброжается просто окно без тэгов
Nikita_Sp
2012-11-22 17:52:12
Всегда рад помочь читателям, но к сожалению, такой вопрос нужно рассматривать непосредственно "на месте", т.е. так я вряд ли чем могу помочь, извините.
Кирилл
2012-11-23 11:59:43
Проблемму решил, пришлось помучаться немного)), а как оказалось все просто, надо прописать полный путь к файлам (http://site/tagcloud.swf, http://site/expressInstall.swf, http://site/swfobject.js) и все заработает)). Кому интересно посмотреть результат мой сайт http://veloman.by Спасибо еще раз за тему)
Вверх!

Меню блога

Категории блога

Облако тегов