How do I animate elements on my website?

With GREYD.SUITE you can animate almost any website element, choosing from a wide variety of effects and triggers.

Greyd.Blocks

More tutorials in Greyd.Blocks

How does the burger / dropdown / popover block work?

You`ll find the popover block in three different variants. Depending on where and how you use it, you can build inline popups, dropdowns or burger menus with it. This video shows you how it works.

Greyd.Blocks, Templates & Post Types


How can I insert dynamic content and trigger actions?

The trigger picker is available in several blocks to link elements or trigger an action (e.g. open an email window or popup). With Dynamic Tags you can insert dynamic content like your website title, a copyright symbol or today's date. Learn more in this video.

Greyd.Blocks


How do I display posts as a table?

The Post Table block is a variant of the Post Overview and allows you to display post content in table form.

Greyd.Blocks, Templates & Post Types


How does the columns block work?

The columns block offers you lots of possibilities in GREYD.SUITE. It can be used to define the overall layout of a page and can also provides advanced responsive options. Plus, in GREYD.SUITE there are lots of effects like fancy backgrounds available in the columns block.

Greyd.Blocks


How does the accordion block work?

The accordion block is a great option if you have a lot of information like FAQs to be displayed. In this video we like to show you how to create an accordion block with collapsible sections and integrate it into your website.

Greyd.Blocks


How can I use buttons to trigger events?

Watch this video to see how easy you can turn a button into a trigger that triggers events like hiding or showing elements on your website.

Greyd.Blocks


How can I personalize my website content?

Our conditional content block makes it possible to display different content depending on different parameters such as URL parameters, cookies, time, post type or user roles. This way, you can display different contents for example for users that come from a newsletter and users that come from Google. And you won't even need code to do that! Learn here how it works.

Greyd.Blocks


How do I create a post archive?

Show posts of a certain time, category or with certain tags with the post archives module. This video shows you how to design your individual post archive.

Greyd.Blocks, Templates & Post Types


Which features do Greyd buttons offer?

Additionally to the native button block of Gutenberg, you'll find the Greyd Buttons block in Greyd.Suite. This video shows you what you can do with it.

Greyd.Blocks


How can I integrate interactive graphics / animations on my website?

Highlight important elements or individual points in an image or animation with our HotSpot Block in Greyd.Suite. How this works and which refinements the HotSpot Block has in store for you, we like to show you in this video.

Greyd.Blocks


How can I add a list to my website?

Lists are a good way to offer your user key information at a glance. Greyd.Suite therefore offers you its own enhanced list block. In this video, we'll show you how to use it.

Greyd.Blocks


How do I create frontend searches?

In this video we will show you how to create individual frontend searches with filtering and sorting options for the user. We also explain the extensive Advanced Search functions in Greyd.Suite.

Greyd.Blocks, Templates & Post Types


When do I use a content box?

Content boxes are perfect to highlight content sections on your website with backgrounds, hover effects, drop shadows or links.

Learn here, how easy it is to create appealing content boxes.

Greyd.Blocks


How to create post overviews and sliders

To display news, a blog, a portfolio or also employees or branches, the post overview block is ideal. This video shows you how exactly it works and which option it offers, also when being used for building a slider.

Greyd.Blocks, Templates & Post Types


How do I design tabs?

Easily create tabs with our tabs block and design and fill them individually. This video shows you how the block works and which options it offers.

Greyd.Blocks


Articles about Greyd.Blocks

Why do anchor links not jump exactly to the right position?

If you use anchor links to navigate your site, you may find that the page sometimes scrolls too far or not far enough. This is a common problem in WordPress.But GREYD.SUITE offers a solution: You can set anchors with our block "anchor target" and define the offset individually and even set different values for different […]


Design, Greyd.Blocks

How can I have several layouts / designs in one post overview?

With the Post Overview or Query Loop block, you can flexibly display posts – as a table, grid or list. In combination with Conditional Content, you can also visually highlight individual posts and/or work with different layouts within one post overview. To do this, simply add the Conditional Content block twice in your query loop. […]


Design, Greyd.Blocks, Templates & Post Types

How can I stretch elements to the same height?

When having several content boxes or texts in columns next to each other, often the layout is tricky when these elements do not have the same height (e.g. because of different text lengths). However, we offer several ways to make sure, your content looks good:Headline & Paragraph BlockIn the headline & paragraph block we have […]


Design, Greyd.Blocks

How can I have two fonts in one headline?

To have two different fonts in one headline or other text-based blocks, just make the text "italic" (cmd+i / strg+i) and insert the following global CSS (in the Customizer or Site Editor): /* Change Font Family on Italic */em {font-family: var(–fontFamily1);} Step 1: Make text “italic” Have two different fonts in one headline


Design, Greyd.Blocks

The link viewport is outside my browser window.

Sometimes when trying to set a link, e.g. on a paragraph or headline, the link viewport appears outside of your browser window and is not editable. There are two very easy workarounds to solve that:Either click the element you want to link again.Or scroll down before clicking the trigger picker and then scroll up again.Both […]


General Questions, Greyd.Blocks, How to Start

How do I create srcoll-to-top buttons?

To create a scroll-to-top button, place the block "Greyd Buttons" on your website, then click on the trigger picker and select "scroll to". You can now select "page top".Tip: A common use case for scroll-to-top buttons is to leave the button empty (no text) and add an arrow icon. Learn more about GREYD buttons:Learn more […]


Design, Greyd.Blocks