Remove Bold from Title on Thumbnails? ...

This question is answered. Helpful answers available: 1. Correct answers available: 1.

Reply to this Thread

Search Forum

Back to Thread List

Replies: 11 - Pages: 1 - Last Post: 1 Oct 24, 15:58 Last Post By: JeffTucker

Threads: [ Previous | Next ]

tizdaz

Posts: 26
Registered: 8-Oct-2023

Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 07:30

Hi, how do i remove the bold style from the text used in the "Title" of thumbnails please?

JeffTucker

Posts: 8,182
Registered: 31-Jan-2006

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 07:35

in response to: tizdaz

Helpful

Head for Photoblogger > Advanced > Custom code > CSS and enter:

.thumbnails .card .caption .title {font-weight: normal;}

tizdaz

Posts: 26
Registered: 8-Oct-2023

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 07:40

in response to: JeffTucker

worked a charm, thanks

tizdaz

Posts: 26
Registered: 8-Oct-2023

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 08:32

in response to: JeffTucker

also, how do i align the text to the left? ive tried:

text-align: left;

but doesn't work, it just stays centre?

On the edit screen when entering text, its aligned to the left, but when i preview or upload then view through browser, its staying centre even if i force refresh?

This is what the CSS looks like at the moment:

.thumbnails .card .caption .title (font-weight: normal; font-size: 18px; text-align: left;

Thanks

Edited by: tizdaz on 1 Oct 2024, 08:34

Edited by: tizdaz on 1 Oct 2024, 08:38

Laza

Posts: 1,794
Registered: 6-Sep-2005

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 13:11

in response to: tizdaz

The title and comment are inline elements, therefore the parent element determines the text alignment:

.thumbnails .card .caption { text-align: left; }

JeffTucker

Posts: 8,182
Registered: 31-Jan-2006

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 13:33

in response to: Laza

That doesn't seem to work. Have you tested this?

Laza

Posts: 1,794
Registered: 6-Sep-2005

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 14:34

in response to: JeffTucker

I used the Developer console. It might be different when the caption is below. Or with other thumbnail layouts?

Laza

Posts: 1,794
Registered: 6-Sep-2005

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 14:38

in response to: JeffTucker

Screenshot 2024-10-01 143709.png (556.8 KB)

This is how it looks when I add it to the CSS box.

JeffTucker

Posts: 8,182
Registered: 31-Jan-2006

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 14:49

in response to: Laza

Default settings, except for using label instead of fileTitle, and putting caption below the thumbnail.

(demo album removed)

JeffTucker

Posts: 8,182
Registered: 31-Jan-2006

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 15:01

in response to: JeffTucker

I believe it also needs:

.thumbnails .card {display: block;}

But I'm not sure what nasty side-effects that might have.

ETA: But with some styles, that doesn't work, either.

Laza

Posts: 1,794
Registered: 6-Sep-2005

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 15:29

in response to: JeffTucker

Width: 100% is needed.

.thumbnails .card .caption { width: 100% }

Display: block might ruin the alignment with some thumbnail grid types.

JeffTucker

Posts: 8,182
Registered: 31-Jan-2006

Re: Remove Bold from Title on Thumbnails?
Posted: 1 Oct 24, 15:48

in response to: Laza

ss012493.png (88.1 KB)

Laza wrote:
Width: 100% is needed.

.thumbnails .card .caption { width: 100% }

Yes, that's better. With some layouts, you also need:

.thumbnails .card .caption > * {margin: 0;}

Otherwise, the attached screenshot is what happens.

All together:

.thumbnails .card .caption {text-align: left; width: 100%;}
.thumbnails .card .caption > * {margin: 0;}

Display: block might ruin the alignment with some thumbnail grid types.

Indeed. Tinkering with a flex layout can be a bit of a high-wire act.

Pages: 1

Back to Thread List

Threads: [ Previous | Next ]

Legend
	Forum admins
	Helpful Answer
	Correct Answer