Category view without boxes and with mansory effect

[MachDirEinBild]

Hai,
I want that the thumbnails will be shown with the mansory effect in category view.
And i want only the thumbs, without a box around them.

I think I've found the right options to change the thumbnails , but the thumbs of the portraits are to small. Perhaps it's because of the boxes.


Ciao, Alex

[Jan]

Hi, you can display the images without boxes with Masonry effect, see e.g. here:
https://www.phoca.cz/phocacartdemo/phoca-gallery

Did you try to set larger size for the thumbnails in Options and then recreate the thumbnails?

Jan

[MachDirEinBild]

That's exactly what I'm looking for. But which options I have to change.
I've changed the size for the middle thumbnails to 200 x 200 and recreated them.

Miniaturbilder:
Miniaturbilder beschneiden --> Alle
Zusätzliche Minitaurbilder --> Alle
Margin (Additional Thumbnails) --> 2
Mittleres Bild - Breite --> 200
Mittleres Bild - Höhe --> 200

Allgemeine Einstellungen:
Equal Heights --> Nein

Kategorie Ansicht:
Unterschiedliche Miniaturbildhöhe --> JA (Mauerwerkeffekt)


Alex

[Jan]

Hi, can I see the site where this occurs, the images can be resized dynamically e.g. by template, etc.

Jan

[MachDirEinBild]

Sorry, the site isn't online yet.

[Jan]

Hmmm, then hard to say, what happens, when you change the template for test?

You can add here an screenshot but I think this does not help as from the screenshot really hard to discover something

Jan

[MachDirEinBild]

Which template do you mean?

[MachDirEinBild]

I set all options as they are descript in this tutorial --> http://www.reisefotografien.eu/phoca-be ... e-anzeigen
Then I've deleted all pictures, thumbnails (and the the categories?) and load them up again. Thumbnails was created and the mansory effect looks fine now.

For hide the boxes I've searched custom code on your demo page https://www.phoca.cz/phocacartdemo/phoca-gallery with firefox inspector and build my own custom.css

Code: Select all

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

.pg-msnr-container {
    text-align: center;
}

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


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

Only when I change the size of the browser the distance between landscape and portrait pictures is not always perfect.

[Jan]

Hi, what you mean with "not always perfect", can you paste a screenshot?

Jan

[MachDirEinBild]

Hai Jan,

When I change the size of my browser to a smaller view so that there are only 2 columns of thumbs, then sometimes the distance between the thumbs is getting wider.
But it's not a great problem. For me it's okay.