Change font for entire website

Hello, is there a way to change the font for the entire website without having to go through page by page and element by element. Size, boldness, italicize, etc can stay, but the font would change.

certainly is that possible, that calls text styles. Have a look here:

1 Like

Yes, but I understand that i would need to go to each individual text box and change the style. Can I do this for the entire website (to be globally changed rather than change one by one)?

technically if you didn’t changed or created new text styles, everything is on a unique text style - so if you change that, you’ll probably change everything.

Ideally is to create the text styles specifically for each type of text (titles are one, paragraph is another) then you can change everything globally in an easy and controlled way

1 Like

It’s probably too late for you to set things globally on your site. But, the issue you raise does highlight the importance of organising your workflow when setting up a website project. As others have mentioned, if you had established text styles at the start of your project, changing fonts and sizes globally would be a simple question of changing your styles. Those changes would then be applied to every element using those styles. The same is true for colours. If you establish a custom colour swatch at the start of your project, you can apply global colour changes in the same way.

I’ve created a style template that makes this quite simple. If you download it and open in Sparkle, you can follow the simple instructions to create a whole set of custom styles and colours for any new project you may embark upon in the future. I’m sorry it may be a bit late in the day for your current project, but just remember it for the future - it could save you a lot of time and effort.

Sparkle Style Template

1 Like

That is correct. But caution is still advised.

For example, if you increase the basic font size from 12pt to 16pt, the size of the text box may no longer be sufficient and text may be cut off.

Conversely, reducing the font size of a style may result in gaps in the layout.

As far as I know, the text boxes do not react dynamically to the amount of text. You should therefore check every page after such an action.

If I am wrong, please correct me.

Mr. F.


You’re not wrong at all. Any changes to a website should be checked after the event - particularly fonts.

I can’t get the template to open beyond an initial splash screen that is almost too small to read the text.

I’m reading @francbrowne’s 1st book, but thought the template might be an easier starting place for building a new website.

please advise

Joseph O’Laughlin

I haven’t seen a problem with the template posted online. I’ve downloaded it again to check its integrity, and it opens just fine. My guess is that if you’re seeing a splash screen - presumably when previewing, you may be looking at it it on a mobile. Because you can’t actually edit a Sparkle website on a mobile, there isn’t a mobile version of the template. It open in desktop view only. If you switch to a mobile view, the page will simply scale down to the mobile viewport - making the text very small.

Lying down for a nap did not make it workable.
I am viewing on a laptop macbook Pro.
If I’m stuck in Preview mode , how do I get out of it?

Joseph O’Laughlin

Losing the uninstalled custom fonts seemed to work enough to give me another, full screen.
With text and colors.