Ubercart Option Image

Ubercart Option Image

Многие при установке модуля Ubercart на Drupal сталкиваются с корректной работой дополнительного модуля Ubercart Option Image, который позволяет загружать каждому атрибуту определенное изображение.

На данный момент я столкнулся с 2 проблемами:

  1. Изображения для атрибутов загружаются, выводятся в коде страницы, но не отображаются
  2. При открытии страницы с товаром изображение атрибута не отображается, пока вы не активируете один из атрибутов

В данном случае я установил модуль Ubercart Option Image (http://drupal.org/project/uc_option_image) на сайт Сумки интернет-магазин handbag.com.ua. Атрибутами у меня выступают разные цвета сумок.

1. Изображения для атрибутов загружаются, выводятся в коде страницы, но не отображаются

При исправлении данного бага было замечено, что модуль успешно работает на стандартной теме Garland, но стоит переключить сайт на любую кастомную тему как он тут же переставал работать. Ошибка была в самом JavaScript модуля а именно в файле uc_option_image.js.

Для решения проблемы необходимо в файле uc_option_image.js заменить строчки:

var pid = $(input).parents('.node').attr('id');
var nid = pid.replace('node-', '');

на строчки:

var pid = $("div.add-to-cart > form").attr('id');
var nid = pid.replace('uc-product-add-to-cart-form-', '');

После этого заработало во всех темах.

2. Как активировать первую radio button в Ubercart Option Image на странице товара

 После того, как была решена первая проблема возникла необходимость немного доработать модуль. При выборе отображения атрибутов в виде "Радиокнопок" изображения начинали переключаться лишь после выбора одного из цвета. Мне же нужно было, чтобы при открытии страницы с товаром автоматически активировался первый в списке цвет и соответственно отображалось по умолчанию его изображение. Достичь этого удалось добавлением нескольких строчек в все тот же uc_option_image.js.

Так после куска кода:

// Radios                                     
  $('.add-to-cart .form-radios input').click(function(){
    if (aid = UCOI.getAID(this)){
      UCOI.switchImage(aid, this, size); 
    }
  });

необходимо вставить следующее:

$(document).onload(function(){
$('.form-radios :radio:first').click();
});

Сейчас ищу решение как сделать то же самое, но при типе отображения "Блок выбора". Хочу чтобы при таком типе тоже автоматически активировался первый цвет из списка и выводилось его изображение. Пока решение не нашел. Если кто-то найдет просьба отписаться

Оказывается решить это тоже можно с помощью JavaScript. В все-тот же в функцию UCOI.init = function() { необходимо добавить следующий код:

$('.add-to-cart select.form-select').ready(function() {
$("select[id='edit-attributes-2'] option:selected").remove();
$("#edit-attributes-2 :nth-child(1)").attr("selected", "selected");
$('.add-to-cart select.form-select').change();
});  

Этот код уберет элемент списка "Выбрать" и активирует первый атрибут из списка. При изменении цвета изображение будет менятся. Вот, что получилось:

Используемые мной файлы модуля вы можете скачать из прикрепленных файлов к данной публикации.

Прикрепленный файлРазмер
uc_option_image.js_.txt4.22 кб
uc_option_image.module31.48 кб

День добрый,

при попытке скачать файл uc_option_image.module
получаю сообщение

You don't have permission to access /sites/default/files/uc_option_image.module on this server.

Так а где скачать можно правленые файлы? Чета прикрепления не нашёл. Спасибо.

Спасибо за ваш комментарий. Только что поправил. Теперь уже точно можно скачать

Отправить комментарий