Font size audio

Isleander
Isleander
@isleander
one month ago
558 posts
Hello, is it possible to reduced the side the the font in the Audio as presented in the image below?
If so, could you point me to the correct file? It's the larger font that I would like to reduce.
Thank you.
updated by @isleander: 11/13/24 07:02:48AM
michael
@michael
one month ago
7,746 posts
It certainly is, but to do it I'd need to see the page that its on.

Browsers have tools built into them to allow you to fiddle with how things look. Generally you hit F12 and a panel opens then you use the arrow pointer from there to click on the thing you want to fiddle with then mess around with the CSS panel to get it how you want.

Once you know how you want it you copy those values into a .css file thats part of your site and upload it to make it permanent.
adjust.jpg
adjust.jpg  •  831KB

Isleander
Isleander
@isleander
one month ago
558 posts
OK - Is this what I should be looking for (see image)?
I only want the font size to be relevant to that particular module (jrAudio), but I'm not sufficiently adept to know where exactly to paste the CSS code so that it doesn't affect other parts of the site.
Thanks again - Alex.
updated by @isleander: 11/14/24 06:22:07AM
michael
@michael
one month ago
7,746 posts
You can paste it into the CUSTOM EDITOR tab on the STYLE section of the skin.

What you need there though is an adjustment to the H1 tag to be able to target it better. That means a template adjustment.
here.jpg
here.jpg  •  260KB

need.jpg
need.jpg  •  632KB

end.jpg
end.jpg  •  627KB

Isleander
Isleander
@isleander
one month ago
558 posts
Thank you Michael. I think that is above my pay grade.
michael
@michael
one month ago
7,746 posts
send me some admin level logins for the site to support at jamroom dot net ATTN: michael. I'll login and get it done for you.

Its not so hard. Once you see what I've done you can do the next one.
Isleander
Isleander
@isleander
4 weeks ago
558 posts
I've sent you login details
michael
@michael
4 weeks ago
7,746 posts
Ok you should be good now. There are 2 locations for H1 tags on the detail page.

I've given them 2 classes, the first class is .wol-audio-detail-h1 and if you use that it will effect BOTH locations. If you just want to effect the top location use .wol-audio-detail-top and if you want to just target the bottom location use .wol-audio-detail-bottom

you can call those classes whatever you like, they're very flexible. you could call it .orange then make the color in CSS orange and whatever you added .orange to would use those rules.

See how you go with that.
here.jpg
here.jpg  •  186KB

loc.jpg
loc.jpg  •  233KB

locat.jpg
locat.jpg  •  826KB

Isleander
Isleander
@isleander
4 weeks ago
558 posts
Thank you Michael,
Whilst I’m seeing the change on the Audio module on my own page, the change isn’t replicated on the Index page; no matter how many times I refresh the page, or view in different browsers. I’m assuming that has something to do with the code on the Index page?
If that is the case, it may be best to leave it rather than dig deeper.
IMG_3207.jpeg
IMG_3207.jpeg  •  574KB

IMG_3206.jpeg
IMG_3206.jpeg  •  573KB

michael
@michael
4 weeks ago
7,746 posts
I've added that same class to the title of the audio files that show up on the front page. It needed the class to have those class rules apply.

Take a look now.
front.jpg
front.jpg  •  364KB

cont.jpg
cont.jpg  •  432KB

Isleander
Isleander
@isleander
4 weeks ago
558 posts
Thank you again, Michael. Your help is very much appreciated.
michael
@michael
4 weeks ago
7,746 posts
You're welcome.

If you've got any CSS questions you can ask them here.