phocagallery categories-view looks awful after upgrade

[f.gruber]

I just make my first attemts upgrading my sites to Joomla 4.
I successfully installed version 4.5.0 of PhocaGallery on my local server.

In the Backend the control Panel seems okay.

In the Frontend the categories-view looks rather destroyed. Please look at the screenshot.


My Joomla template is cassiopeia. I made a child template with little changes.

Here is a link to the Phoca Gallery on the production site still running on Joomla 3:
https://kirchenchor.grubit.at/index.php/fotogallery

What can I do to get it looking it similar in Joomla 4?

[christine]

Hallo,

ähnlicher Fall: https://www.phoca.cz/forum/viewtopic.php?f=1&t=62817
Schaust halt, was Dir besser gefällt, entweder: standard_theme, oder simple_theme. Im obigen Link siehst Du screenshots von Benno.

Liebe Grüße
Christine

[f.gruber]

Okay, now I could improve something.
I downloaded the Phoca Gallery Standard Theme for Joomla 4 from the Phoca Gallery Site and installed it in the Phocagallery ControlPanel.

Now the Layout of the categories-view looks reasonably good.

There was only one problem. Above the category thumbnails there appeared a white space (about 150 px high). This gap was caused by a div element:

Code: Select all

<svg aria-hidden="true" class="ph-sr-only" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

I am not able to understand the purpose of this line.

I added the following line into the standard.css:

Code: Select all

.ph-sr-only {display:none;}

I don't know if that has any other consequencess

[christine]

Hi,

Did you migrate according to this guide or how did you upgrade?
https://www.phoca.cz/documents/50-jooml ... o-joomla-4

In the backend under styles you can see which styles are activated. See 2nd screenshot in the previous link.
Which template do you use?

Because of the white space, it would be good to see this live.

Kind regards
Christine

[f.gruber]

Hi,
now on another Joomla project I performed the upgrade to PhocaGallery 4.5 according to the manual.

Some more questions arise:

Styles:
I downloaded com_phocagallery_theme_standard_v451 and installed it. Now the view looks reasonable good after some CSS changes-
Will my changes in media/com_phocagallery/css/custom/theme_standard.css be overwritten after an update of Phocagallery?
Does it make sennse to make an override only for changing CSS styles? I suppose, this does not make sense.

What's about the other Phocagallery-styles: Phocagallery, Theme simple, Rating, Bootstrap, Default?
They all are looking awful and seem to be unusable.
Can I delete them?

Detail Window:
The only Detail-box window, that looks rather good is Photoswipe.
Bootstrap Modal Popup Window looks awful and also the other DetailWindow options.

Switching to the next or previous image is not possible using the keyboard (arraw keys). I have to use the mouse for scrolling through the images. Only in Photoswipe I can use the arrow keys ...

Where are the the other beautiful DetailBox views from previous versions of PhocaGallery under Joomla 3 gone (Shadow-box, Higsslide-JS, ...)?

Thank you for comments and hints.
Ferdinand

[Jan]

Hi,

ph-sr-only is an hidden container for all SVGs on the page (so they are not repeated in code). Usually it is hidden by main "phocagallery.css" file. Is "phocagallery.css" active on your frontend?

Custom style will be only overwritten, when you install the same style. Not with core, because core does not include it.

Mostly is is recommended to make own CSS edit in custom.css or user.css of the template, because there all customization will be in one place.

phocagallery.css - main style for Phoca Gallery (will be overwritten by update)
theme_simple.css - main theme style (will be overwritten by update)
rating.css - specific CSS for rating (stars) (will be overwritten by update)

bootstrap and default are not more used.

The only Detail-box window, that looks rather good is Photoswipe.
Bootstrap Modal Popup Window looks awful and also the other DetailWindow options.

This is much more a question on developers of the detail window features.

Switching to the next or previous image is not possible using the keyboard (arraw keys)

The same as above, a question on developers of the detail windows features. If the detail window is an iframe, I will take a look at it, if there is some option that the buttons can be associated to keys. Thank you for this feedback.

All other detail window methods were removed, because:

- they were not maintained anymore
- they were not responsive
- they were not ready for mobile use, etc. etc.

Jan