Global Styles

Customizer

The Customizer is the core piece of GREYD.SUITE. It enables you to make global design settings for your entire website and spares you having to style each website element individually.

That way, a few clicks are enough to completely redesign an existing website. Our live preview shows you the effect of your changes in real-time.

Vimeo

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von Vimeo.
Mehr erfahren

Video laden

Logo, Colors, Fonts

Which basic settings can I make?

The customizer is structured in a way that enables you to make your initial settings step by step: Basics, Navigation, Elements, Extended. This video shows you the basic settings.

Covered topics
Page title, change logo, website icon / favicon, set colors, fonts, background color, font size, mobile logo

Related topics
How to start, Custom font integration

Vimeo

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von Vimeo.
Mehr erfahren

Video laden

Navigation

How do I design the website header and footer?

You won't need a developer to design and layout your navigation completely individually. This tutorial shows you how to position and style your logo, menu and other header and footer elements.

Covered topics
Header, menu, logo, navigation, burger menu, off-menu, off-canvas, dropdown menu, footer, second header, mobile responsive, vertical menu bar

Related topics
Gutenberg in GREYD.SUITE, 
Templates, Manage menus

Vimeo

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von Vimeo.
Mehr erfahren

Video laden

Text, Buttons, Fields, Links

Which Styling Options Do I Have For Website Elements?

Forget about having to style each element individually. With GREYD.SUITE, texts, headlines, buttons, links, form fields and notifications are designed centrally. That way, you can change every single button on your website with just one click.

This video shows you all setting options.

Covered topics
Text, font color, font style, lists, block quote, headline, character spacing, line height, word spacing, button, hover, link, form fields, messages

Related topics
Gutenberg in GREYD.SUITE, GREYD.Forms
, GREYD. Buttons

Vimeo

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von Vimeo.
Mehr erfahren

Video laden

Grid, CSS, announcement box and more

Which Further Settings Can I Make?

Use the extended Customizer features to individually adapt your grid, add your own CSS code and style sections such as announcement boxes and compatibility messages.

This video contains everything you need to know.

Covered topics
Compatibility message, announcement box, set-up page, preset, activate features, grid, CSS code, mobile responsive, row concept

Related topics
Gutenberg in GREYD.SUITE, GREYD.Hub, Templates, Columns

Vimeo

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von Vimeo.
Mehr erfahren

Video laden

Design Modifications

How Do I Redesign An Existing Website?

Thanks to the global design settings in the GREYD.SUITE Customizer, a few clicks is all you need to completely change the look & feel of a website.

Watch this video to see how it works.

Covered topics
Import website / design, Customizer settings, move a website, change logo, adapt colors, fonts, redesign header, style buttons

Related topics
Gutenberg in GREYD.SUITE, GREYD.Hub

Vimeo

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von Vimeo.
Mehr erfahren

Video laden

Custom Font Integration

How Can I Implement Custom Fonts On My Website?

This video provides you with a detailed instruction how to implement a custom font on your website.

Covered topics
Custom font, integrate Google font locally, CSS stylesheet, font family, font weight, font styles

Related topics
Customizer Basics

Icon Quick Links

Customizer

Frequently Asked Questions

Helpdesk

Can't find your question? No problem? Write us here:

Skip form
The email address should contain an ‘@’character and a valid domain with a period.
The phone number can only consist of numbers and the following characters: + ( ) – /
Form skipped

How can I make the parent element of a dropdown menu clickable?

By default, WordPress blocks the option to add a link when a menu item functions as a dropdown parent. In GREYD.SUITE we offer a dedicated option to prevent this default behaviour:

Create your WordPress menu as usual. In the detailed settings of each menu item you will now find the option “In Navigation: Do not remove link despite sub-items”.

How can I control the breakpoint for the header to switch to its mobile variant?

Many navigation widgets offer you the possibility to only show them on desktop or mobile screens. The breakpoint at which the header switches to its mobile variant can be controlled individually under Navigation > Header at “Mobile”.

Why should I start with the Customizer settings?

GREYD.SUITES allows you to manage your website design and content independently from each other. For example, you can make central color settings applicable for all elements on your website. By starting with making the design settings in the Customizer, you can later use those pre-set colors very easily. That way, you can also change them with just one click instead of having to adapt every single item on your website.

Learn more about the Customizer.

Why can’t I see the Customizer and GREYD.Hub?

Please check your WordPress user role. You can only use the Customizer as an administrator and need to be administrator (for single sites) or super administrator (for multi sites) to use GREYD.Hub.

Which format do I need for the logo?

We recommend to use formats such as .svg or .png for the website logo. However, .jpg is also possible. Please make sure, your logo is big enough, so it won’t blur. You can also upload a reduced logo variant for mobile devices.

Can the website title be translated?

Yes, when you are using translation plugins, e.g. WPML, you can also translate the website title. However, this needs to be done not in the Customizer but in the WordPress settings.

Why are my changes to the footer template not applied?

Please check your Customizer settings under Navigation > Footer. There, you can define whether to activate the footer and how you want it filled. Instead of the footer template you can for example also show the main menu. If you’ve selected this option or even disabled the footer, your template settings cannot be shown.

Can I deposit fall-back fonts?

Yes, in case a font cannot be loaded, you can define several alternatives as a fall-back. “Websave Fonts” for example already have pre-set fall-backs. You can also use fall-backs for your individual fonts by listing all font names, separated with a comma (e.g. myFont, Helvetica, sans-serif).

I need more variants than offered in the Customizer.

In the Customizer you can set several variants for colors, fonts, buttons, links, form fields, etc. For example you can define up to three different button styles and up to 18 different colors in the Customizer. If you want to style some elements on your website in a different way, that’s no problem at all. You can style each element on your website individually and independently from your Customizer settings. Also, you can deposit individual CSS designs.

Can I export my Customizer settings?

Yes, all settings made in the Customizer can be exported and imported onto other websites very easily via the GREYD.Hub. For multi sites you need to have the WordPress user role super administrator. Learn more about GREYD.Hub.

Why can’t I see the set-up page?

Please check your Customizer settings. Under the tab Extended > Features you can activate and disable the set-up page. It will be shown automatically by default as soon as you open a section in the Customizer.

Where can I change the color selection?

In many blocks, you can select from your individual colors as defined in the Customizer (e.g. for the row background or in the content box settings). Alternatively, you can set any other color with the colored circle on the right. If you want to change your color pre-set, open the Customizer and the tab “Colors”. Learn more under Customizer.

My color changes are not applied everywhere.

All changes in the Customizer, e.g. color changes, will automatically be applied in all website elements that use this color. This also works if you import other design settings via GREYD.Hub.

There is just one exception: If you do not use the pre-set colors in your blocks but enter individual color codes, here of course no automatic adaption is possible.