Nuubia – Initial Styling

Nuubia – Initial Styling

I’ve chosen the Pomme Theme. I took it from WordPress.com.

It supports a new feature: Full Site Editor. This means you can modify the whole site in a new easier web user-interface way.

In particular, it supports this from the wp-admin page, in the white-text on black menu on the side, you should see, in the English language version, “Appearance” (“Design” in the German version), and the menu Items are “Themes” and “Editor”.

You have to decide on a Theme early on. All you posts and pages and banners and menus on your web-site will be built around your Theme.

I have chosen one for you, this one Pomme. I have already modified it to support the Nunito font. And this variant of the Theme is called “Pomme One”.

When you see it in the Themes page, it is highlighted as “Aktiv”, you can click on the “Customizer” and that will take you to a page that will allow you to customize the Theme.

The fonts are in “Stile” -> Typografie. You can change these very as you would in a Word-Processing program.

For the time being, I would not recommend that you start styling the site. Because

  • You don’t have much content
  • You need to know how to backup your Theme, just in case, you don’t like your changes

You need content to see what styling your Posts and Pages will need. I would suggest you make some Posts and Pages using the “Pomme One” Theme.

  • Start with some picture posts with the “Pomme One Theme” active. Not the Logo or anything important. Just the photographs you’ve collected. You can see the ones I’ve uploaded so far in the Media Library “Medien”.
  • Try and get used to the Block Editor. It can support links and fetching content from the Web. There is a lot to it, so ask me for an hour or so to show you around it.
  • Get more interesting content, try and get maps, tables and graphs into the Posts

I useful thing you should know is that ChatGPT and many other programs use the same text layout codes now. So a good simple starter post is to just paste a ChatGPT question and response in.

Then once you have some Posts, try to move on to writing a Page you can see Pages in “Seiten”. Have a look at a couple of mine. They are

  • Very short and contain only headings for “shortcodes”
  • Or are very long descriptive pages

The long, descriptive pages are used for, as an example, describing how to play Skat. You would probably want to put some interesting text in a page about coffee. The story Thierry tells about North African shepherds.

The Short pages are used for the summary banner. That’s the menu: “Games, What’s On, Events, Venues, “.
Each of those menu items takes you to a Page dedicated to that menu item. On each of those pages is a simple page-list short code and a heading that is just a repeat of the Title (Games, What’s On” and so on.)

That’s Lesson 1 on Posting and the Editor. You should try and cover placing images with the Block editor. It’s all you need to know to get a site up and running.

Lesson 2 will be using Links and making references across pages. Using Categories and Tags. Using the Page List shortcodes.

Theme Editing

Usually, you only need to work on the Theme once, when you first set-up the site.

This is Full Site Editor (FSE) / block theme

“How can an end-user safely experiment with design changes in the Site Editor and revert if they mess it up?”

There is a proper workflow for this.


🔎 Important Concept (Block Themes)

With block themes (FSE), when a user changes:

  • Fonts
  • Line heights
  • Colors
  • Template layouts
  • Header / Footer structure

WordPress does NOT modify your theme files.

Instead, it stores the changes in the database as:

Theme modifications (theme.json overrides & template parts)

That means:

  • Your child theme stays clean
  • The parent theme stays clean
  • Changes are reversible

✅ Built-In Revert Options (No Plugins Needed)

1️⃣ Per-Template Revert

Go to:

Appearance → Editor

Open a template (e.g., Single Post, Page, Header, etc.)

Click the three dots (⋮) in the top-right.

You’ll see:

“Reset template”

This restores it to the original theme version.


2️⃣ Clear Global Styles

If they changed fonts, spacing, etc.:

Go to:

Appearance → Editor → Styles (half-circle icon)

Click the three dots (⋮)

Choose:

“Reset styles”

That removes user customizations and restores theme defaults.


3️⃣ Delete Customized Templates Manually

If things get messy:

Go to:

Appearance → Editor → Templates

Customized templates will show as modified.

You can:

  • Delete the modified version
  • WordPress falls back to the theme’s original file

🛡 The Professional Workflow (For Clients)

If this is for end-users on a business site, here’s the clean workflow:

✔ Step 1: Create a “Base” Design

You finalize:

  • Fonts
  • Colors
  • Layout rules
  • theme.json defaults

This becomes your stable baseline.


✔ Step 2: Educate the Client

Tell them:

“You can experiment in the Site Editor. If anything breaks, we can reset templates or global styles.”

This gives them freedom without fear.


✔ Step 3 (Optional but Smart): Install a Rollback Plugin

This so often happens wih WordPress plugins, the free version is useless! And when you’ve paid for the Pro version, you find out it doesn’t do much either. So both of these, you can do without, but let me know if you want a backup. I can do it underneath WordPress.

  • WP Rollback (for theme version rollback)
  • Or full backup via UpdraftPlus

That gives an emergency undo button.


💡 Advanced (Very Clean Approach)

If you really want controlled design changes:

Use theme.json properly in your child theme and:

  • Lock font sizes
  • Lock spacing presets
  • Restrict color palettes
  • Disable custom font sizes

This prevents clients from breaking typography.


🎯 The Key Realization

With block themes:

You don’t need to revert the whole theme.

You only revert:

  • Global styles
  • Individual templates
  • Template parts

It’s modular.


Self-Service – How to Help Yourself

If you know some Buzzwords, you can find out things for yourself.
So I chose the Pomme theme from the ones on WordPress.com. It is “Fully Block-Based”

🧱 What “Fully Block-Based” Means

There are two kinds of modern themes:

1️⃣ Classic (Customizer-based)

  • Uses Appearance → Customize
  • Layout controlled by PHP templates
  • Limited visual editing

2️⃣ Block Theme (Full Site Editing / FSE)

  • Uses Appearance → Editor
  • Header, footer, templates all editable visually
  • Global Styles control fonts, spacing, etc.
  • Layout stored in the database

Pomme is type #2 — fully block-based.

So you are working in the new system.


🧠 Important: Your Child Theme Is NOT Where Most Changes Go

So I made it a Child Theme. That’s just an easy way of changing a few simple things. I think I made a global change of Font in the Child Them (Pomme One). But you, the end-user, change:

  • Fonts
  • Line heights
  • Spacing
  • Header layout
  • Page template layout

Those changes are stored in the database, not your child theme files.

Your custom CSS is just an override layer.


That’s all for now!

Colouring

Over at the Canva.com site. Finca La Luz. Light green is dedfb6, darker green is 4b553d and white is fffffb

How To Change Logo (Block Theme)

Go to:

Appearance → Editor

Then:

  1. Click Patterns
  2. Click Header
  3. Select the Header template part

You’ll see your header layout visually.

Look for the Site Logo block.

If there isn’t one:

  • Click the + button
  • Add a Site Logo block

Click it → Upload or replace the logo image.

Click Save.

Done.


✅ How To Change Site Title & Tagline

In the Header (or Footer):

Look for:

  • Site Title block
  • Site Tagline block

Click directly on the text and edit it inline.

These blocks pull from:
Settings → General
(But you can also edit directly in the block editor.)


✅ Editing the Footer

Still inside:

Appearance → Editor → Patterns → Footer

Select your Footer template part.

You can:

  • Add/remove Site Title
  • Add a logo
  • Add columns
  • Add navigation
  • Change alignment

Save.


🧠 Why It Feels Different

Classic themes:

  • Header controlled by PHP
  • Edited in Customizer

Block themes:

  • Header is just a template part made of blocks
  • Fully visual
  • Stored in database

It’s more powerful — just less obvious at first.


💡 Pro Tip For Your Workflow

Since you’re managing this for an end-user:

You can:

  • Lock header blocks (so they can’t accidentally delete the logo)
  • Lock footer layout
  • Leave content blocks editable

That gives clients freedom without structural damage.

Text on Each page is
“Kontakt” Xarrovv 18.8 pt
“Nuubia.cooperativa@gmail.com” in Nunito 11,3 pt

Two irregular shapes on white background.

Leave a Reply

Your email address will not be published. Required fields are marked *