Edit the header and footer in the page builder, and give each post an address in every language

What this batch of updates covers

From 29 September to 3 October five updates reached the admin, all about the frame of your site: the header, the footer, the addresses and what the visitor's browser does when a page loads. You can now edit the header and footer from the page builder. Each page can choose what the header does on scroll. A blog post can have its own address in every language. You can pick an animation for the switch between light and dark mode. Fonts come from Husly's own server, and every site sends the browser a security header.

None of this changes your site until you choose something yourself. Existing pages, posts and settings stay as they were, and the fonts look exactly as before.

Edit the header and footer right in the page builder

The page builder now shows the site header above the page and the footer below it. The header shows your real logo and menu, the footer its links, the tagline and the copyright line. When you point at them, a small badge says that this part is on every page.

A click on the header or the footer opens the Whole site panel. The Header and Footer rows under the page settings open it too. In the header you can change the logo height, the scroll behaviour, the size, the width, the menu style, the search and the language switcher. In the footer you can change the tagline and the copyright line in the language the canvas shows, and the social icons and the language switcher. A click on a menu label in the header opens the panel at that entry.

The panel has its own Apply to the whole site button. The page's Save and its automatic save never send these settings, so saving a draft cannot change the header on every published page by accident. The number of changes not yet applied shows next to the Header and Footer rows, and leaving the builder asks first.

On the Customize page, the footer card now also has a Logo choice: the footer shows the same logo as the header, at a height from 20 to 120 pixels, or the site's name as text.

Choose for each page what the header does on scroll

Until now a site had one answer to what the header does while the page scrolls, and every page got it. Now a page can choose for itself. In the builder, with no block selected, open Page settings, the General tab, and find the Header on this page field:

• Same as the site: the page follows the site's own setting. This is the default, and every existing page keeps it.
• Stays on top: the header stays at the top of the window all the way down.
• Scrolls away: the header leaves with the content.
• Returns when scrolling up: the header hides on the way down and comes back when the visitor scrolls up.

The line under the field says in a sentence what the header does on this page. The choice works on pages and blog posts, also in the editor opened on the page itself, where the real header follows the choice at once. A landing page can now let the header scroll away without changing the rest of the site.

Give a blog post its own address in every language

A post used to have one address in every language, so an English article lived under an Estonian word. Now the post editor's General tab has a URL in other languages box under the URL slug field, with one field for each extra language. An empty field uses the main address, and the hint under the field shows the post's real address in that language.

Every link to a post comes out in the reader's language: the blog front page, categories and tags, post lists, the previous and next links, and menu links. The addresses meant for search engines, the sitemap and the language switcher use each language's own address as well. If another post already has the same address, the editor says so under that language's field.

In the editor opened on the page itself, a post now has the same Address in this language field a page has. A site with one language shows no box, and nothing changes there.

Choose how light and dark mode switch

When a visitor pressed the light and dark switch on a site, the page used to change in one way: a circle grew out of the switch and revealed the other mode. Now you can choose. On the Customize page, under General, the Color mode card has a Switch animation row with four choices:

• Circle: the circle grows out of the switch as before. It stays the default.
• Curtain: a soft edge sweeps over the page, from the top when it goes dark and from the bottom when it goes light.
• Blinds: eight slats open like window blinds turning.
• Fade: the new mode appears over the whole page at once.

Each choice is also a preview: a press plays the effect on a small sample page, and a second press shows the way back. A visitor who has asked their device for less motion gets the switch at once, with no effect.

Fonts come from Husly's own server, and the site sends a security header

Husly sites now load their Google fonts from Husly's own storage. Before, the visitor's browser asked Google's servers for the fonts on every page view, and Google got every visitor's address and browser details before any cookie choice. Now the visitor's browser does not contact Google for the fonts at all. The page also loads a little faster, because the browser needs one connection less. The fonts look the same.

Every Husly site now also sends a security header that tells the browser what the page may do. Its three rules stop known attacks: a tag slipped into a page cannot send its links and scripts to another server, the page runs no old plugin content, and another website cannot put your site in an invisible frame to trick a visitor, or you, into a click. Pages, videos, maps, forms and pasted code work as before.