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


Permlink Replies: 14 - Pages: 1 - Last Post: 13 Mar 24, 20:21 Last Post By: gerbrandy6
gerbrandy6

Posts: 10
Registered: 28-Sep-2013
Comment always looks "Bold"
Posted: 20 Jul 23, 21:56
 
  Click to reply to this thread Reply
Hi,

Using the last versioin of JAlbum and Java in win 11.
https://www.lex-brigitte.nl/Lex%20Photo%27s/index.html.

The comment under web locations in the caption template like below
 <h9>  <div class="comment">${commentShort} </div>  </h9> 

......always looks more bold than It should be in regular format. The Title field looks more bold except when you change the class from title to comment.

Same with caption under images.

I also made the font size under web locations as small as possible h9 but the font size under images (without H9) is even smaller.

Why can't I set the font size and type not just like I want it to look?
How do I change the font from looking too bold to the regular format and how can I make the font under web locations smaller? H8 or H9 looks the smallest I can get.

Thank you,
Lex

Edited by: RobM on 20 Jul 2023, 21:32
Moved to Tiger, I think it is the skin in question

Edited by: JeffTucker on 20 Jul 2023, 16:43, to make link clickable
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 20 Jul 23, 23:46   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
Attachment normal.png (166.0 KB)
Attachment bold.png (166.0 KB)
One thing at a time....

First, the thumbnail captions and image captions in your album are already showing with normal font weight. See the two screenshots, attached - what I see in your album is shown in the normal.png image. If I force the caption to show as bold, it looks like bold.png.

Now, let's talk about HTML header tags. The <h1> - <h6> tags have default definitions in the browser, and they're all bold. They're for headers, so that makes sense. The sizes are also predefined. The skin could override those sizes, but in Tiger, only the <h1> tag has a specific font size different from what the browser would do on its own. There is no such thing as an <h8> or <h9> tag.

In short, you should not be trying to use header tags to change the displayed sizes of text - those tags do much more than just change the size. Instead, just tell Tiger to use the size you want. Go to Tiger > Advanced > Custom code > CSS and enter, for example:
.comment {font-size: 12px;}
But 12px is awfully small. Depending upon the font family, that can be tough to read on a large monitor. The default of 14px should probably be left alone.
gerbrandy6

Posts: 10
Registered: 28-Sep-2013
Re: Comment always looks "Bold"
Posted: 23 Jul 23, 15:03   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
Thx for your explanation Jeff.

However, I don't see the difference in font weight in both attachments you sent. They are equal.
And I still find the font weight too bold. When I open my website it's just below my Edge favourites which font shows much lighter in weight. Why can't I get that weight?

Another question:
Can I get color in my fonts? I used, years ago, to use the Turtle skin and there I once got the advice to add some lines in the Custom CSS styles box. They don't work in the Tiger skin. Different code?

Remember, I'm a laymen and know nothing about developping and programming.

Thx, Lex
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 23 Jul 23, 15:13   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
Attachment both.png (8.7 KB)
Do you really not see the difference between these? See attachment.
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 23 Jul 23, 15:40   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
The real problem is your choice of font family. You're using Comic Sans, which is a fairly heavy font. It's very difficult to make it any lighter. Try switching to Segoe, for example, under Tiger > Site > Typography > Font family.

To change the color, you can force it by going to Tiger > Advanced > Custom code > CSS and entering this, for example (switching from white to a light gray):
.comment {color: #dddddd !important;}
ETA: I've found that when dealing with light text on a dark background, taking the font color down, even just one major notch below pure white, like to #eeeeee, can make the font appear quite a bit less "weighty."
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 23 Jul 23, 16:03   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
BTW, Comic Sans is so hated by typographers, there's a movement to ban it. Google ban comic sans, and visit some of the results. Some good stuff.

(Laza, shame on you for including it in the preset list. ;) )
Laza

Posts: 1,767
Registered: 6-Sep-2005
Re: Comment always looks "Bold"
Posted: 24 Jul 23, 08:19   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
I felt so ashamed, I had to check. Fortunately, it's not on the "suggestions" list at least. :)
gerbrandy6

Posts: 10
Registered: 28-Sep-2013
Re: Comment always looks "Bold"
Posted: 27 Jul 23, 15:10   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
Jeff,
Sorry, very busy at the moment...

I did that, added .comment {color: #eeeeee !important;} in the Settings-Advanced-CSS box.
BTW on my Homepage I used Calibri, but I changed it to Segoe now.

Adding the colour line resulted the very first time in changing the colour of the Album description on the Home page to dark grey (!?!?). Colour of the Comment didn't change.
When I removed that line, nothing happened. I deleted the published and the local album, created a new album....it's still dark grey. The only way to change that is to format it in Settings, General, Album description, with the formatting button.

I find it strange but I can live with that as long as I can change the format.

But actually I didn't want to change the color of the Comment of the pictures, but the Album Title. I don't see a formatting button there. I managed that once when I used Turtle. You told me to add the lines below in the Settings-Advanced-CSS box:
.hero .hero-image header > div h1 {color:yellow;}
.hero .hero-image header > div .description {color:yellow;}

That doesn't work either now in Tiger. I tried several things in the CSS box, based on what you told me before but I'm not a devolopper, I don't "speak the language".

What do I have to do to change the colour of the Album tilte?

BTW I can't change the font of the first album from Comic Sans to Segoe. I did, but nothing happened. Also deleted all albums and created a new one.

Edited by: gerbrandy6 on 27 Jul 2023, 15:13

Edited by: gerbrandy6 on 27 Jul 2023, 15:15
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 27 Jul 23, 15:34   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
gerbrandy6 wrote:
Adding the colour line resulted the very first time in changing the colour of the Album description on the Home page to dark grey (!?!?). Colour of the Comment didn't change.

This is simply not possible. The added CSS targets the .comment class. The album description is not controlled by the .comment class.

The only way to change that is to format it in Settings, General, Album description, with the formatting button.

I would not advise using the formatting button to do things like changing colors. This can be done much more cleanly by adding custom CSS.

But actually I didn't want to change the color of the Comment of the pictures, but the Album Title. I don't see a formatting button there. I managed that once when I used Turtle. You told me to add the lines below in the Settings-Advanced-CSS box:
.hero .hero-image header > div h1 {color:yellow;}
.hero .hero-image header > div .description {color:yellow;}

That doesn't work either now in Tiger. I tried several things in the CSS box, based on what you told me before but I'm not a devolopper, I don't "speak the language".


Forget about any advice for using Turtle. Tiger is a completely different skin. The CSS selectors are not the same, so old CSS customizations just aren't going to work, ever.

I "get" that you're not a developer, but if you want to start customizing what the skin provides, you simply must learn how to use the tools that are at your fingertips. Your browser includes a "developer's console" that lets you examine the elements on a page, and discover what CSS selectors are referring to them

What do I have to do to change the colour of the Album tilte?

Enter custom CSS:
.hero header .title h1 {color: #ff0000;}
Choose your own color, of course.

But remember, I don't "know" these CSS selectors. Tiger is not my skin. I just look at a page with the browser developer tools, and examine the album title. The tools show me what the CSS selectors are.

BTW I can't change the font of the first album from Comic Sans to Segoe. I did, but nothing happened. Also deleted all albums and created a new one.

Refresh your browser cache when viewing the album. You're just looking at a stale, cached version of the page.
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 27 Jul 23, 15:44   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
JeffTucker wrote:
Forget about any advice for using Turtle.

In fact, those old customizations should be deleted. They will either do nothing (best case), or they will produce unexpected, unwanted results (worst case).
gerbrandy6

Posts: 10
Registered: 28-Sep-2013
Re: Comment always looks "Bold"
Posted: 30 Jul 23, 21:17   in response to: JeffTucker in response to: JeffTucker
 
  Click to reply to this thread Reply
Hi Jeff,
Thx for all the support so far. But.....

I "get" that you're not a developer, but if you want to start customizing what the skin provides, you simply must learn how to use the tools that are at your fingertips.

I'm, indeed, not a developper and that's why I bought this application ==> to make a web site in an easy way. You also could make it more enduser friendly. With buttons or including somewhere in the settings a possibility to change colours, font weights, font sizes of everything and more.
Endusers like me don't want to be bothered with CSS styles and what should or could be in there.
You're also telling me now NOT to use features wich are built in (font, formatting buttons and maybe more?).

Come on, let's keep it simple for endusers please. I'm busy enough with my own work and problems.

Besides that...IT WOULD SAVE YOU TIME instead of answering all these questions
That's what people call: a WIN-WIN situation :-)

Idea?

Nevertheless, thx again for your support.
JeffTucker

Posts: 8,134
Registered: 31-Jan-2006
Re: Comment always looks "Bold"
Posted: 30 Jul 23, 22:45   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
gerbrandy6 wrote:
You also could make it more enduser friendly. With buttons or including somewhere in the settings a possibility to change colours, font weights, font sizes of everything and more.

Use one of my skins, and you can do all of those things from the UI, without custom coding. Install Neptune, for example, and look at the Neptune > Fonts tab in the skin settings (and its sub-tabs). Then choose the Custom style, and look at the Neptune > Custom tab in the settings. Tiger has more built-in features, but fewer customization options. It's a trade-off.

Laza also has an extensive background in graphics design, so most often, users would be better off accepting his choices. The tinkerers usually make things worse, not better. ;)

You're also telling me now NOT to use features wich are built in (font, formatting buttons and maybe more?).

There are some features that David has introduced, and loves, but that not all skin developers are happy with. The HTML formatting stuff, in my opinion, is a bit of a mess, and it often collides with the coding in a skin. So, I advise people to steer clear of it.

Remember, only David, Anders, and Laza work for jAlbum. The rest of us are independent, unpaid, third-party volunteers. Sorry to interfere with your precious work and problem-solving time.
Laza

Posts: 1,767
Registered: 6-Sep-2005
Re: Comment always looks "Bold"
Posted: 31 Jul 23, 09:17   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
jAlbum skins are already overcomplicated. Most other competitors offer one look per style. I try to offer a middle-ground between full customization and the one-fits-all approach. If you look into common.css you'll see it contains all the guesswork to compute all the colors based on those few user inputs.
Laza

Posts: 1,767
Registered: 6-Sep-2005
Re: Comment always looks "Bold"
Posted: 31 Jul 23, 09:24   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
The custom CSS styles are not universal. They work for a specific skin (and can break things in other skins, or even in older versions of the same skin.) - because they are referring to a point in the HTML structure that is specific to a skin.

If you change the font and the changes won't appear, make sure you pressed Make album, and refreshed the preview with Ctrl-F5. (Always check the result on the local preview first to exclude Upload errors.)
gerbrandy6

Posts: 10
Registered: 28-Sep-2013
Re: Comment always looks "Bold"
Posted: 13 Mar 24, 20:21   in response to: gerbrandy6 in response to: gerbrandy6
 
  Click to reply to this thread Reply
Thx everybody for your help.
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums