[Resolved] maybe a very strange question:

[diedrich]

maybe a very strange question:

if you view my site and for example view this attachment page https://www.davidbowieworld.nl/mijn-bootlegs-2-2/tour-recordings/1972-1973-the-ziggy-stardust-tour/

then I would like the photo album to look like this example page
http://gpsites.co/charge/

can I get the photo album on my site the same?

[Leo]

Hi there,

The photo album you are seeing in Charge is actually just blocks of blog posts.

It wouldn’t work for a gallery.

Does that answer your question?

[diedrich]

Thank you Leon ,
is there maybe another way to make it more beautiful? , for example like the caption flush with the left and right outside of the images and a line around it

[David]

Hi there,

try adding this CSS:

.gallery-item {
    margin-bottom: 20px;
}

.gallery-item .gallery-icon {
    overflow: hidden;
    padding: 0;
}

.gallery-item .gallery-icon img {
    width: 100%;
}

.gallery-item .gallery-caption {
    padding: 20px;
    background-color: #fff; /* caption background color */
    flex: 1;
}

@media(min-width: 769px) {
    .gallery {
        display: flex;
        flex-wrap: wrap;
        margin-left: -10px;
        margin-right: -10px;
    }

    .gallery .gallery-item {
        margin: 10px;
        width: calc(33.3% - 20px);
        display: flex;
        flex-direction: column;
        border: 1px solid #000; /* Set Border color */
    }

    .gallery .gallery-icon {
        max-height: 400px;
    }
}

[diedrich]

thank you David, this is what I meant, maybe it is still possible to get a line around it (text and image)

greeting Diedrich

[David]

Edited the CSS here:
https://generatepress.com/forums/topic/maybe-a-very-strange-question/#post-1568303

This will make all captions the same height in a row and add the border.

[diedrich]

Hi David,
if I miss something?, where can I set the lines

diedrich

[Elvin]

Hi,

David’s reply is a CSS code.

Here’s how you can add CSS – https://docs.generatepress.com/article/adding-css/

[diedrich]

Hi Elvin,
I don’t quite understand you, but do I need to install a plugin now?

[Elvin]

I don’t quite understand you, but do I need to install a plugin now?

The link I’ve provided is a brief documentation guiding you on how to apply the CSS David provided on his previous reply. It’s a good read. The information there is really helpful. 🙂

And no, you don’t necessarily have to install a plugin if you follow this part of the guide.
https://docs.generatepress.com/article/adding-css/#additional-css

[diedrich]

mmmmmm, this is a very short documentation that a normal person does not understand

[Elvin]

mmmmmm, this is a very short documentation that a normal person does not understand

Ah right. I’ll do a short step-by-step you can follow then:

1.) Copy David’s CSS code provided here: https://generatepress.com/forums/topic/maybe-a-very-strange-question/#post-1568303

2.) Go to your site’s Admin Dashboard page.

3.) On the Admin Dashboard page, Go to Appearance > Customize > Additional CSS
As shown here: https://share.getcloudapp.com/xQuYD8lL

4.) Paste it on the Code area you see on the Appearance > Customize > Additional CSS.

5.) Click “Publish”. It should apply the CSS code David provided.

[diedrich]

I wasn’t that stupid yet hahahaha, I am concerned with how I can edit David’s code to get a borderline around the image and text

[Elvin]

I wasn’t that stupid yet hahahaha, I am concerned with how I can edit David’s code to get a borderline around the image and text

Oh, my bad. lol

Are you trying to achieve something like this?
https://share.getcloudapp.com/v1u4e8gm

If yes, you can add a border: 1px solid red; on .gallery-item.

Example:

.gallery-item {
    margin-bottom: 20px;
    background-color: white;
    border: 1px solid red;
}

[diedrich]

yesaaaaaa, now a borderline above the text / below the image then it is completely ok

thanks Elvin

[Author]

Posts