Спешу поделиться классным способом работы со всплывающими окнами :-) Очевидно, что всплывающие окна (с увеличенными картинками и другой информацией) - это хорошо и гораздо лучше открытия в новом окне, особенно когда там не много информации, которую лучше показать посетителю сразу на той странице, где он находится. Многие из вас наверное заметили, что каждая статья в Opencart, помимо своего основного адреса, может быть открыта по такому адресу:
/index.php?route=information/information/info&information_id=1
При этом открывается именно содержимое статьи, т.е. без шапки сайта, без футера и т.п., чистый html из статьи. Очень удобно открывать такие вещи через colorbox, допустим информацию про доставку, чтобы посетитель, зайдя на страничку товара, не открывал лишних вкладок, а просто клацал левой кнопкой по ссылке, ведущей на статью, которая появляется во всплывающем окошке. Но при этом у такого способа есть серьезный недостаток, как и вообще у самого colorbox - если посетитель клацает средней кнопкой (или правой - открыть новую вкладку), то вместо красивого всплывающего окошка появится голая новая вкладка с тем контентом, который должен был загружаться в colorbox (но который туда не попадает, ибо colorbox в таком случае вообще не инициируется). Попробуйте сами открыть так фотку товара у себя на странице товара. И если с картинками еще ситуация терпимая, то при открытии статьи по вышеуказанному способу, откроется голая страница, ничем не напоминающая сайт магазина, с одним лишь текстом статьи. Решается эта проблема через изящный костыль способ, хотя не валидно (не по спецификации html). Что нужно сделать для этого? В параметрах инициализации ссылок на colorbox дописать: href:function(){ return $(this).attr('to'); },
А в коде страницы в том месте, где идет ссылка на то, что мы хотим показать во всплывающем окне, сделать вот так (любители валидного html, не бросайте в меня помидорами): <a to="index.php?route=information/information/info&information_id=1" href="Статья_1" class="" title="">Текст ссылки</a>
Что это все значит: как видите, у элемента a появился новый параметр to, которого нет в спецификации хтмл и который по сути будет адресом того содержимого, которое мы хотим открыть во всплывающем окне. При этом у ссылки все так же остается правильный адрес href, по которому пойдут поисковики и те пользователи, которые захотят открыть содержимое через среднюю кнопку или через контекстное меню, короче через создание новой вкладки. В результате хорошо и пользователям, и поисковикам - первые не теряются, попадая на страницы без шапки и футера сайта, а вторые индексируют именно то, что нам нужно.
UPD: А чтобы проходить валидацию, можно использовать data-to вместо to