Video at product gallery inside product detail page is not working
Video at product gallery inside product detail page is not working, however, it is working from admin panel but on product view it is showing only video thumbnail.
Fotorama, when checking for video data, is looking for the field “video” but Magento is providing “videoUrl”.
– Maybe it is an issue of Fotorama. When Fotorama checking for video data is looking for the field “video” but Magento is providing “videoUrl”.
– Issues can be found in these files:-
var video = findVideoId(dataFrame.video, true);
When I edited the cached file to put in some console logs, I found that dataFrame did NOT contain the field “videoUrl”.
– Please check below files:-
1) My Temporary Fix In This File:
/vendor/magento/module-product-video/view/frontend/web/js/fotorama-add-video-events.js
in function: _createVideoDatatmpVideoData.videoUrl = tmpInputData.videoUrl;tmpVideoData.video = tmpInputData.videoUrl; //My Fix2) /vendor/magento/module-configurable-product/Block/Plugin/Product/Media/Gallery.php
In function: getProductGalleryprivate function getProductGallery($product){$result = [];$images = $product->getMediaGalleryImages();foreach ($images as $image) {$result[] = [‘mediaType’ => $image->getMediaType(),‘videoUrl’ => $image->getVideoUrl(),‘video’ => $image->getVideoUrl(), //This is new‘isBase’ => $product->getImage() == $image->getFile(),];}return $result;}3) /vendor/magento/module-configurable-product/Block/Product/View/Type/Configurable.php
in function: getOptionImagesprotected function getOptionImages(){$images = [];foreach ($this->getAllowProducts() as $product) {$productImages = $this->helper->getGalleryImages($product) ?: [];foreach ($productImages as $image){$images[$product->getId()][] =[‘thumb’ => $image->getData(‘small_image_url’), ‘img’ => $image->getData(‘medium_image_url’),‘full’ => $image->getData(‘large_image_url’),‘caption’ => $image->getLabel(),‘position’ => $image->getPosition(),‘isMain’ => $image->getFile() == $product->getImage(),‘type’ => str_replace(‘external-‘, ”, $image->getMediaType()),‘videoUrl’ => $image->getVideoUrl(),‘video’ => $image->getVideoUrl(), //This is new];}}return $images;}4)/vendor/magento/module-catalog/Block/Product/View/Gallery.php
in function: getGalleryImagesJsonpublic function getGalleryImagesJson(){$imagesItems = [];foreach ($this->getGalleryImages() as $image){$imagesItems[] = [‘thumb’ => $image->getData(‘small_image_url’),‘img’ => $image->getData(‘medium_image_url’),‘full’ => $image->getData(‘large_image_url’),‘caption’ => $image->getLabel(),‘position’ => $image->getPosition(),‘isMain’ => $this->isMainImage($image),‘type’ => str_replace(‘external-‘, ”, $image->getMediaType()),‘videoUrl’ => $image->getVideoUrl(),‘video’ => $image->getVideoUrl(), //This is new];}if (empty($imagesItems)){$imagesItems[] = [‘thumb’ => $this->_imageHelper->getDefaultPlaceholderUrl(‘thumbnail’),‘img’ => $this->_imageHelper->getDefaultPlaceholderUrl(‘image’),‘full’ => $this->_imageHelper->getDefaultPlaceholderUrl(‘image’),‘caption’ => ”,‘position’ => ‘0’,‘isMain’ => true,‘type’ => ‘image’,‘videoUrl’ => null,‘video’ => null, //This is new];}return json_encode($imagesItems);}
Let’s Make Things Happen
Transforming your ideas into reality is our expertise. Share your vision without hesitation, and let our skilled team bring it to life.
“Akshar Group Technologies did such a great job at resolving the initial problem that the partnership expanded to include further development and is still ongoing. Diligent and committed, the team goes above and beyond to deliver their work promptly. They have an extensive knowledge base.”
Digital Engage, US
