Photoswipe - Category View thumbnails too small

[jb80]

Recently I upgraded to Phoca Gallery to v4.3.4 to try out the new Photoswipe view. The Detailed View seems to work OK, Photoswipe does indeed "swipe" however I have an issue with my icons on the Category View. When I changed the Detail Window setting to "Photoswipe" the thumbnails are now very small/tiny. If I revert back to the Magnific option the icons are restored to normal size.

I checked the source URL between "Photoswipe" and "Magnific" and they are the same - both using the same medium size thumbnail "phoca_thumb_m_xxxx"

Code: Select all

<img src="/xxxx/images/phocagallery/yyyy/zzzz/thumbs/phoca_thumb_m_img_5361.jpg" alt="" class="pg-image img img-responsive" itemprop="thumbnail">

Any suggestions to resolve the problem, conflict with responsive design style?

[Jan]

Hi, maybe it can be somehow related to the CSS. Can I see the site where this occurs?
Jan

[jb80]

Details sent via PM.

[Jan]

Hi, if I disable this style:

.../templates/protostar/css/template.css?5b52ca3f9528ea4c97e99146ea471a99"

then the images (medium thumbnails) get the right size, so seems like in this CSS there is something which somehow resize the size of the images

Jan

[jb80]

But if I switch back from "Photoswipe" to "Magnific" the images are loaded correctly. The template hasn't changed from Protostar (Joomla default) why would the behavior be different between Detail Window options. If the template is faulty surely I would see the same behaviour whether it's configured for "Photoswipe" or "Magnific"? ...

[jb80]

OK update. I have tried various other templates with mixed results, some work, some do not. I have migrated across to "Zenith II" https://www.themexpert.com/joomla-templates/zenithii however this template has the same behaviour as the "Protostar" (Joomla default) template. Thumbnails displayed are too small.

The issue is only found with "Photoswipe" option. It would seem there is an incompatibility between Category View/Photoswipe and the template.

[Jan]

Hi, yes, it can be possible that Photoswipe can be somehow in conflict with another library

So the only idea is to add some custom CSS to the Phoca Gallery styles or template CSS which correct this resize (some padding: 0 or margin: 0 or similar for the boxes )


Try to add e.g.:

Code: Select all

.pg-cv-box {
	padding: 0px;
	margin: 3px;
	background: transparent;
	border: 0px;
	box-shadow: none;
}

#phocagallery,
.pg-category-view .pg-cv {
	text-align: center;
	margin: 0 auto;
}

.pg-msnr-container {
	margin: 0 auto !important;
	text-align: center ;
	
}

to your CSS, what happen?

[jb80]

Hello Jan,

I tried adding the CSS using two methods without success;
1) inserted css using "Zenith II" custom css option, and
2) created a phoca "style" with the custom css

Both attempts had no change. The Box size is still incorrectly resized too small reducing the size of the thumbnails.

[Jan]

Hi, it can happen, that your style is loaded first and then it is again overwritten by template CSS back

Jan

[kjones]

Hi, have you managed to sort this? I have the same issue when i select photoswipe the thumbnails are sized at 20 x 20?

Cheers