Обновление woocommerce пропал lightbox – галерея – решаем проблему

в обновлении woocommerce пропала галерея lightbox

Новое обновление WooCommerce 3.0 принесло много сюрпризов владельцам магазинов на woocommerce, и особенно тем, которые используют кастомные темы (впрочем, не только). Это обновление wooc является глобальным – крупным ! и имя этой новой обнове присвоили экстравагантное – “Бионические бабочки” “Bionic Butterfly”. В статье рассмотрим такой (как его называют – баг) хотя это вовсе и не…

Читать меня полностью...

Михаил ATs - владелец блога запросто с Вордпресс - в сети нтернет давным-давно...

...веб разработчик студии ATs media: помогу в создании, раскрутке, развитии и целенаправленном сопровождении твоего ресурса в сети... - заказы, вопросы... разработка...

вопросы в Skype

вопросы в Телеге

Нажатия на кнопочки определяют Ваше высокое гражданское сознание

Разметка списка товаров на главной странице - как в woocommerce изменить теги h3- h2

Как увеличить лимит потребляемой памяти php - wp memory limit

Как перенести в свой шаблон стили css плагина woocommerce

Открываем магазин с плагином woocommerce на собственной теме

смотреть ещё статьи в теме: WooCommerce и WordPress

Поделитесь соображениями: Ваши мысли очень важны! Отменить ответ

Alex:
2017-04-15

Уффф, спасибо братишка!!! Только по поводу “Тем админам, которые переносили стили css плагина в свой шаблон, теперь нужно добавить обновлённые CSS из нового” у меня не работали превьюхи – я не переносил css! Но скопировав их в css шаблона – все заработало!

Ответить - Alex
- Михаил ATs:
  2017-04-15
  
  Здравствуйте, Alex!
  
  Но скопировав их в css шаблона — все заработало!
  
  Ну и как говорится – славно!! что заработало!
  Тебе спасибо, дорогой товарищ !! за комментарий и за то, что не прошёл с великим молчанием мимо, но поделился мнением.
  Вместе мы многое сможем: берегите себя… и заходите впредь))
  
  Ответить - Михаил
  - Alex:
    2018-02-11
    
    Вот и еще один магаз поправил)))
    
    Ответить - Alex
    - Михаил ATs:
      2018-02-11
      
      …с Вас процент, Alex! …в виде небольшого бочёнка сладкого спирта!
      ))
      
      Ответить - Михаил
Андрей:
2017-04-23

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

Ответить - Андрей
- Михаил ATs:
  2017-04-24
  
  Здравствуйте Андрей!
  Насколько я понял по Вашим пояснениям проблему, то, как Вы говорите (никакой реакции css) – а нужно чтоб реакция css была! В стилях, вероятно, казус )
  Вы попробуйте ещё раз пояснить мне суть Вашей “нестыковки”.
  Понимаете, когда, например – “изображение прячет описание” – то как правило закавыка в css: стили организуют положения элементов.
  p|s – это если я правильно понял.
  
  Ответить - Михаил
Андрей:
2017-04-24

Добрый день, вы можете свой эл. адрес прислать, я ссылку скину на мой сайт.

Ответить - Андрей
- Михаил ATs:
  2017-04-24
  
  День добрый!
  У Вас мой адрес есть в письме, которое приходит к Вам в оповещении о комментариях…
  
  Ответить - Михаил
Олег:
2017-04-25

Добрый день!
После обновления и подключения галереи, как вы описываете, все начинает работать, но….
Почему то пропадает Title на всех страницах сайта и вместо него просто адрес страницы.
А, соответственно, как только отключаю галерея – Title возвращается.
С чем это может быть связано?

Ответить - Олег
- Михаил ATs:
  2017-04-25
  
  Здравствуйте Олег!
  Связок может быть множество… У Вас какая тема: wooc или адаптированная под..?
  
  Почему то пропадает Title на всех страницах сайта
  
  “на всех страницах” – это странно!
  В статье описан принцип обновы касаемо преимущественно сторонних тем, в которых многие (скажем так, важные для владельца структурные и стилистические) файлы W перенесены в шаблон.
  …и с темой может быть связано!
  
  Ответить - Михаил
  - Олег:
    2017-04-25
    
    Тема Woocommerce – Alpha store.
    Вот и мне крайне не понятно почему так себя ведет title.
    Его, вроде как, никаким краем не задеваем, а по факту какая-то необъяснимая для меня, пока, вещь получается.
    Может есть еще какой ни будь способ добавить галерею?
    
    Ответить - Олег
    - Михаил ATs:
      2017-04-25
      
      Нужно тему смотреть…
      Или попробуйте банально отключать компоненты обновления по очереди… zoom, slider и т.п. если Ваша тема обновлена (это сделать просто в файле функц) ! и такой метод исключения поможет выявить причину (по крайней мере узнать точно: вина ли в “самой галереи” или в связках компонент обновы, каких-нить js) То, что пропадает title (имя) на всех страницах – это странно.
      Конфликт где-то или ошибка! У Вас дочерняя тема используется?
      Попробуйте переустановить чистый WOOC.
      
      Может есть еще какой ни будь способ добавить галерею?
      
      способы-то есть: например плагин. Но..! лучше бы сначала выявить причину настоящего конфликта, иначе закавык в будущем не избежать.
      
      Ответить - Михаил
      - Олег:
        2017-04-25
        
        Дописал к Вашим строкам еще
        
        // Add Title Tag Support add_theme_support( 'title-tag' ); //В итоге получилось: add_action( 'after_setup_theme', 'alpha_store_setup' ); function alpha_store_setup() { add_theme_support( 'wc-product-gallery-zoom' ); add_theme_support( 'wc-product-gallery-lightbox' ); add_theme_support( 'wc-product-gallery-slider' ); // Add Title Tag Support add_theme_support( 'title-tag' ); }
        
        И все Title восстановились!)
        
        Ответить - Олег
        
        Михаил ATs:
        2017-04-25
        
        Интересно!
        Однако в этом случае получается то, что, возможно, на сайте (в теме) есть и ещё какие-то нестыковки – проверьте!
        
        p|s
        Я удалил несколько ссылок на Ваш сайт – оставил одну!
        Я планирую сделать свой блог dofollow, а посему допускаются только авторские блоги – описано в правилах комментирования: мне кажется, это не должно Вас (и пр. коллег) обидеть…
        
        Ответить - Михаил
Владимир:
2017-04-27

Спасибо.
Очень помогла статья.

Ответить - Владимир
- Михаил ATs:
  2017-04-27
  
  Не за что, Владимир!
  Заходите и впредь)
  Город веб мастеров – Михалика.ru ©
  
  Ответить - Михаил
Роман Шибер:
2017-05-16

Пытаюсь вернуть лайтбокс. В функшн вставляю указанную функцию с изменением имени темы и без… сайт вылетает… не пойму что не так делаю

Ответить - Роман
- Михаил ATs:
  2017-05-16
  
  Здравствуйте Роман!
  Что сказать: где-то допускаете (или допустили) ошибку…
  Для начала, после изменения кода статьи (на имя Вашей темы) и прописки его в файл функций, пробуйте комментировать по одной строке кода (подключаемые модули). …чтобы выявить конфликтный параметр.
  Далее посмотрим…
  
  Ответить - Михаил
Владимир:
2017-05-18

Добрый день. Подскажи как убрать нумерацию миниатюр?

Ответить - Владимир
- Михаил ATs:
  2017-05-18
  
  И Вам доброго дня! Владимир, я не понял о какой конкретно нумерации миниатюр речь…
  
  Ответить - Михаил
Владимир:
2017-05-18

тут ссылка

Ответить - Владимир
- Михаил ATs:
  2017-05-18
  Посмотрел по Вашей ссылке…
  Элемент ol (касаемо миниатюр) править… Как-нить обозначить так можно:
  
  .woocommerce-product-gallery .flex-control-nav { width: 500px; display: flex; flex-direction: row; justify-content: space-around; /* с этим значением и свойством поработать */ text-decoration: none; color: #ccc; /* или так - заштриховать нумер... */ list-style-type: none; /* или так - уборка нумерации */ }
  
  …
  ЛИБО типа:
  
  ol .flex-control-nav .flex-control-thumbs { list-style-type: none; }
  
  А вообще нужно файлы переносить в шаблон и HTML поправить на свой вкус.
  Ответить - Михаил
  - Владимир:
    2017-05-18
    
    Спасибо вам огромное:)
    Немного не додумался до такого:)))
    
    Ответить - Владимир
    - Михаил ATs:
      2017-05-18
      
      Не за что… Владимир!
      
      Ответить - Михаил
Sahar:
2017-05-19

Добрый день! Делаю всё по вашей инструкции, но в итоге изображения вместо галереи выстраиваются друг под другом. Сверху большое, снизу несколько маленьких.

Ответить - Sahar
- Михаил ATs:
  2017-05-19
  
  И это логично в некоторых случаях… Читайте ответ к комментарию чуть выше…
  Обратите, например, внимание на
  display: flex;
  В стилях вся закавыка обычно подобных случаев)
  ps| пасиб за ссыль на Ваш сайт
  
  Ответить - Михаил
  - Sahar:
    2017-05-19
    
    Михаил, спасибо что подсказали! Проблема в том, что я не очень умею применять этот параметр и вообще новичёк в этом всём)) То есть его нужно просто добавить в стили?
    В url ссылка на сайт в котором эта проблема (стили исходные стоят).
    
    Ответить - Sahar
    - Михаил ATs:
      2017-05-19
      
      Вы сначала перенесите обновлённые стили галереи WOCC (если не переносили) в свою тему – и затем размеры миниатюр и пр. организуйте…
      ol:last-child
      например: width: 200px;
      Получится типа такого https://prnt.sc/f9qa6c и уж потом… дальше-дальше… править.
      Нужно стили шаблона видеть онлайн… чтобы реально помочь…
      
      Ответить - Михаил
Артем:
2017-05-29

Здравствуйте я не понял а куда это вставлять: Далее…

Если пройтись по ядру плагина, то — обнаружим несколько добавочек в папке assets…

wp-content/plugins/woocommerce/assets/css/photoswipe/default-skin/default-skin.css

и…

wp-content/plugins/woocommerce/assets/css/photoswipe/photoswipe.css

Вот всю эту прелесть и нужно подключить посредством вышепоказанного кода!

Ответить - Артем
- Михаил ATs:
  2017-05-29
  
  Здравствуйте Артём!
  …я для примера показал пути, файлы, которые добавлены в ядро wooc для обработки обновлённых модулей галереи, которые и нужно подключить КОДОМ, добавив в свой файл функций.
  А чтобы галерея (например) правильно заработала в соответствии с обновой – нужно добавить свежие стили css в свой файл стилей, – примеры которых я тоже привёл в статье…
  
  Ответить - Михаил
  - Артем:
    2017-05-29
    
    Все понял. Спасибо большое)
    
    Ответить - Артем
Андрей:
2017-06-03

Михаил, здравствуйте!
Я внес данные, которые Вы указали в файл functions.php с названием своей темы. Сохранил, обновил страницу и теперь мой сайт стал недоступен(HTTP ERROR 500). Подскажите, как вернуть обратно сайт?

Ответить - Андрей
- Михаил ATs:
  2017-06-03
  
  Здравствуйте! Андрей!
  Всё банально и просто: сотрите внесённые правки в файле функций (в админке), или – зайдите на хостинг (где физически “лежит” сайт), откройте functions.php и “откатите его” – как было у Вас до правок.
  Сайт откроется.
  Вы, вероятно, где-то совершили “опечатку” – ошибку в коде…
  
  Ответить - Михаил
  - Андрей:
    2017-06-04
    
    Спасибо большое, все получилось!
    
    Ответить - Андрей
    - Михаил ATs:
      2017-06-04
      
      Ну и замечательно, Андрей!
      Обращайтесь, коли что…
      p|s
      …а вот ссылки всяких магазинов у меня в блоге запрещены, уж пардоньте великодушно, дорогой товарищ.
      …не заинтересовав сей сайт – ну никак нельзя! хыть тресни прям))
      
      Ответить - Михаил
Елена:
2017-07-02

Большое спасибо. Галереи заработали :)

Ответить - Елена
- Михаил ATs:
  2017-07-02
  
  Здравствуйте Елена! …и пожалуйста..!
  …однако ссылочку я Вашу убираю: не положено здесь магазинам.
  Скоро блог открою дофф – а значит…
  Прошу простить великодушно))
  
  Ответить - Михаил
Руслан:
2017-07-07

Здравствуйте Михаил, подскажите почему у меня установилось как то через зад, сначала сделал все как у вас написано, магазин слетел, решил попробовать на оборот, не удаляя ни чего из css файла, удалил код из functions.php, магазин заработал, решил опять поставить код в functions.php, неожиданный результат ВСЕ ЗАРАБОТАЛО!!! ПОЧЕМУ???

Ответить - Руслан
- Михаил ATs:
  2017-07-07
  
  Здравствуйте Руслан!
  
  ВСЕ ЗАРАБОТАЛО!!! ПОЧЕМУ???
  
  …это Вы у себя или у меня спрашиваете…)
  
  Ответить - Михаил
Руслан:
2017-07-07

у вас, я не понимаю почему

Ответить - Руслан
- Михаил ATs:
  2017-07-07
  
  Элементарно! где-то совершили ошибку.
  Попробуйте вновь повторить как делали изначально, и узнаете… методично)
  А у меня нигде не написано, будто б стили нужно убирать…
  
  Ответить - Михаил
Руслан:
2017-07-07

я нашел проблему в файле functions.php, прописываю свою тему НЕ РАБОТАЕТ, оставляю ваша тема РАБОТАЕТ, не могу понять почему так происходит, может подскажите

Ответить - Руслан
- Михаил ATs:
  2017-07-07
  
  О которой теме идёт речь ?? Какая моя тема работает, и какоя Ваша – не работает?
  Я правда затрудняюсь Вас понять…
  Какая проблеммма в функциях у Вас?
  
  Ответить - Михаил

Руслан:

2017-07-07

вот так не работает:

/** подключаем после обновления woocommerce 3.0 ЛАЙТБОКС-lightbox - галерею **/
function Responsive Mobile_setup() {
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
}
add_action( 'after_setup_theme', 'вашатема_setup' );
/** подключаем после обновления woocommerce 3.0 ЛАЙТБОКС-lightbox - галерею **/

вот так работает:

/** подключаем после обновления woocommerce 3.0 ЛАЙТБОКС-lightbox - галерею **/
function вашатема_setup() {
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
}
add_action( 'after_setup_theme', 'вашатема_setup' );
/** подключаем после обновления woocommerce 3.0 ЛАЙТБОКС-lightbox - галерею **/

Ответить - Руслан

Михаил ATs:
2017-07-07

У Вас: Responsive !! Mobile_setup() – ПРОБЕЛ ! ТАКОГО БЫТЬ НЕ ДОЛЖНО!
add_action( 'after_setup_theme', 'вашатема_setup' ); – и здесь укажите вашу тему…

В Вашем случае имя темы нужно писать как-нибудь так: function responsive-mobile_setup() { только нужно НИЖНЕЕ подчёркивание… тире – иначе ошибка !

Ответить - Михаил

Руслан:
2017-07-07

ясно, спасибо, попробую найти точное название темы

Ответить - Руслан
- Михаил ATs:
  2017-07-07
  
  Так я имя Вашей темы у Вас же на сайте и посмотрел… (в коде, имеется в виду))
  Попробуйте так смело и написать: как я показал… вот имя Вашей темы: responsive-mobile …или уберите имя.т вообще пока…
  
  Ответить - Михаил
Руслан:
2017-07-07

ага я тоже нашел, вставил responsive-mobile НЕ РАБОТАЕТ, поставил обратно вашатема РАБОТАЕТ, ни чего ни понимаю

Ответить - Руслан
- Михаил ATs:
  2017-07-07
  значит у Вас есть какие-то добавочные файлы темы и ф.ф…
  Либо ошибку где-то всё-таки делаете…
  Должно работать так…
  
  /** подключаем после обновления woocommerce 3.0 ЛАЙТБОКС-lightbox - галерею **/ function responsive-mobile_setup() { /** у Вас дефис, нужен нижний дефис **/ add_theme_support( 'wc-product-gallery-zoom' ); add_theme_support( 'wc-product-gallery-lightbox' ); add_theme_support( 'wc-product-gallery-slider' ); } add_action( 'after_setup_theme', 'responsive-mobile_setup' ); /** подключаем после обновления woocommerce 3.0 ЛАЙТБОКС-lightbox - галерею **/
  Ответить - Михаил
  - Михаил ATs:
    2017-07-07
    
    А вообще в функциях не допускается имя функций и пр. и пр. с ТИРЕ - нужно бы НИЖНЕЕ разделительное/соединительное _ тире
    responsive_mobile_setup
    …или пока уберите имя темы вообще…
    
    Ответить - Михаил
Руслан:
2017-07-07

сейчас попробую

Ответить - Руслан
- Михаил ATs:
  2017-07-07
  
  Вы шутите, что ли))
  Тему переименовывайте… и делоф.
  
  Ответить - Михаил
Руслан:
2017-07-07

с подчеркиванием пишет
Страница www.veyp.ru не работает

Сайт www.veyp.ru пока не может обработать этот запрос.

Ответить - Руслан
Руслан:
2017-07-07

у меня на сайте одна тема может из-за этого

Ответить - Руслан
Руслан:
2017-07-07

убрал название темы вообще заработало

Ответить - Руслан
Влад:
2017-08-16

Михаил, скопировал ваши стили как указано, но ничего совсем не изменилось. Миниатюр нет, а все фото выстраиваются как и раньше друг под другом. Тема от Woo, Argentum. Возможно ли вообще привести в нормальный вид на этой теме?

Ответить - Влад
- Михаил ATs:
  2017-08-16
  
  Не важно какая тема ! важно – каким образом приводить в нормальный вид!
  Понимаете, Влад, в статье даны принципиальные общие стили… подгонять под свой шаблон имена селекторов ПРИХОДИТСЯ в большинстве случаев. А также описаны определённые условия файловой конструкции (структуры) магазина – взаимодействие шаблона с WOOC, скажем так)
  Да ! привести в нормальный вид вашу тему Argentum, конечно же, можно! – я попробовал у вас там (на сайте, в Онлайн) что-то поправить – получилось на скорую руку скомпоновать фотки.!.
  
  Ответить - Михаил
Влад:
2017-08-16

А можно кодик у вас попросить, и адрес вставки? Это тестовый сайт.

Ответить - Влад
- Михаил ATs:
  2017-08-16
  
  Какой “кодик”? …коды в статье все рабочие… Но как я и говорил – нужно поправлять в соответствии со своим шаблоном.
  Я у вас предварительно потестировал средствами разработчика – всё “ОК”: остальное править только в самом шаблоне и пр.
  
  Ответить - Михаил
Рамис:
2017-08-22
С НАЗВАНИЕМ ТЕМЫ НЕ РАБОТАЕТ!!! Нужно просто написать setup!
```
function setup() {
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
}
add_action( 'after_setup_theme', 'setup' );
```
Ответить - Рамис
- Михаил ATs:
  2017-08-22
  
  Об этом Вашем варианте уже говорилось в комментариях…
  С названием темы ВСЁ РАБОТАЕТ!! только дело в том, что названия тем у всех разные… чаще имена шаблонов не соответствуют стандарту _ так-то вот…
  Можно, конечно, и так… однако – необходимо кое-что понимать, используя подобный вариант.
  …Скоро, возможно, статейку по этому поводу с setop напишу.
  
  Ответить - Михаил
роман:
2017-10-19

а у меня в теме этот код уже есть. а галерея не работает. WC еще второй версии. что сделать чтобы заработала галерея фото в товаре?

Ответить - роман
- Михаил ATs:
  2017-10-20
  
  Здравствуйте Роман!
  WC обновляйте.!.
  …
  
  Ответить - Михаил
  - роман:
    2017-11-11
    
    Спасибо. Ответ видел давно, но не чего было написать. После обновления на следующую версию перестали показываться параметры товара. Пришлось восстановить копию.
    
    Ответить - роман
    - Михаил ATs:
      2017-11-11
      
      перестали показываться параметры товара
      
      – и такое может быть.
      Нужно искать ответы в прежних и обновлённых файлах WC.
      Разберитесь отчего пропали “параметры” – это может быть банально из-за свойств CSS, ибо и цсс в новом wooc здорово обновлены: “стили” могли сдвинуться… но это, как понимаете, предположение.
      Посему целесообразно обновляться – вовремя! и, соответственно, отлавливать текущие ошибки…
      Но, не отчаивайтесь: Ваш вариант ошибки вполне себе решаем…
      
      Ответить - Михаил
Григорий:
2017-11-11

Ваше решение отлично помогло, спасибо! Хотел бы отметить, что информация на сайте подана с душой, и это подкупает… Но дизайн сайта 2000-х годов отталкивает – лично мне кажется хорошей идеей сделать редизайн, ресурс получился бы крутой!

Ответить - Григорий
- Михаил ATs:
  2017-11-11
  
  Спасибо, Григорий, за отзыв с душой))
  Насчёт дизайна, я с Вами, пожалуй, соглашусь… Лично я никак не могу оторваться от своих прежних взглядов на визуализацию… а, соответственно, и убеждений…
  Однако не совсем понятно (мне во всяком случае) что Вы имеете в виду конкретно: если всякие js свистелки и пузырялки, то это – моя душа не очень-то и принимает… А всё остальное, как подтверждает мировая статистика, – есть только личные предпочтения юзера и вряд ли как-то существенно сказываются на продажах… (если считать целями сайтостроения, например, эффект продаж))
  Не так давно с коллегами запустили, так сказать, кампанию редизайна этого блога – возможно, что нибудь исправим.
  Спасибо…
  
  Ответить - Михаил
Андрей:
2017-11-30

Здравствуйте! Спасибо большое за помощь! Все получилось! Однако… Как выяснилось пропало главное меню((( Подскажите что я сделал не так..

Ответить - Андрей
Евгений:
2018-04-25

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

Сделал стиль css wooc по вашему примеру. Потыкал параметры нашел как двигать миниатюры от главной картинки, а какой параметр будет развозить миниатюры между собой (они у меня сейчас в плотную)

Ответить - Евгений
- Михаил ATs:
  2018-04-25
  Здравствуйте Евгений!
  Это вам придётся поработать немного…
  Например с селектором:
  
  .woocommerce div.product div.images .flex-control-thumbs li {width: 25%; float: left; margin: 3px 2px 0 0; /* здесь управляйте всеми ЧЕТЫРЬМЯ значениями параметров */ list-style: none; opacity: 9; }
  
  В общем, после разводки нужно ещё и размер основной картинки подогнать под новую стилистику миниатюр… (чтоб всё симметрично было)
  Ответить - Михаил
Александр:
2019-03-30

Дружище, спасибо! Сделал свою тему, помог только твой вариант. Успехов!

Ответить - Александр
- Михаил ATs:
  2019-03-30
  
  Пожалуйста, Александр! ну и здорово, что помог…
  И вам удачи…
  
  Ответить - Михаил

запросто с WordPress создание сайтов ATs media - блог Михаила Суворина и К

Обновление woocommerce пропал lightbox – галерея – решаем проблему