Block Tools

What it does

Gym Builder already shows your classes, trainers and timetable with shortcodes. Block Tools gives you the same information as blocks you place and style by eye in the WordPress block editor, plus the design blocks a studio home page needs. Everything that comes from Gym Builder stays live: change a class time, a trainer or a class's capacity and every page that shows it is up to date.

• Class Routine — your weekly timetable in five designs, with a details popup and a booking button on every class time.
• Classes and Trainers — cards for your classes and your trainers, in several designs, with a Load More button.
• Design blocks — Slider, Countdown, Info Box, Call to Action, Advanced Heading and Wrapper for the rest of the page.
• Coupon Showcase — your public offers, when the Promotions & Trials add-on is on.
• GB Templates — six complete page designs (yoga, fitness, gym, boxing, karate, swimming) you import as a draft page and then edit.
• Your look — every block has a Styles tab for colors, fonts, spacing, corners and shadows, with separate values for desktop, tablet and phone where it matters.

Before you start

• Gym Builder switched on. Without it, Block Tools adds no blocks and shows a notice with an Activate Gym Builder (or Install Gym Builder) link.
• WordPress 6.7 or newer, and pages edited in the block editor. If you build pages with Elementor, use the Elementor Widgets and Pre-built Templates add-ons instead.
• Classes and trainers with their details filled in. The Classes, Class Routine and Trainers blocks show what you entered in Gym Builder: class times, colors, trainer photos and so on (see the Gym Builder guide).
• Promotions & Trials (another add-on) only if you want the Coupon Showcase block.

Install and switch on

1. Go to Plugins → Add Plugin and click Upload Plugin.
2. Choose the add-on's zip file, click Install Now, then Activate Plugin.
3. Enter your license key when asked.

Once it is on, the block editor has a Gym Builder Blocks group, and the WordPress menu on the left has Gym Builder → GB Templates. Block Tools has no settings page of its own: each block keeps its settings.

Add a block to a page

1. Open the page in the block editor (Pages → Add Page, or edit an existing page).
2. Click the + button at the top left to open the list of blocks. Gym Builder Blocks is the first group. You can also type a block's name, such as "Class Routine", in the search box.
3. Click a block to add it. It shows your real classes or trainers straight away.
4. With the block selected, use the settings panel on the right. Every Gym Builder block has two tabs: General (what to show) and Styles (how it looks).
5. Click Save draft or Publish as for any page.

The Styles tab

The Styles tab is split into boxes, one per part of the block (for example Frame, Title, Category Chip, Booking Button). Inside you find the same kinds of controls on every block:

• Color and Background — text and background colors, some with a separate hover color.
• Typography — font, size, weight and line height.
• Margin, Padding and Border Radius — spacing and rounded corners, in px, em or %. The screen icon next to a label lets you set a different value for desktop, tablet and phone.
• Border and Box Shadow — a border style and a ready-made shadow (Subtle, Medium, Strong) or your own.

The blocks at a glance

Class Routine

The Class Routine block draws your week from the class times you set on each class: every class time appears on its day, in the class's own color, with its trainer. It is the block most studios put on their "Timetable" or "Schedule" page.

The five layouts

Choose one under General → Layout → Layout.

The class-time popup and the booking button

When Day Popup on Click is on, a visitor who clicks a class time gets a small card with the day, time and length, places left, the trainer and the booking button.

The booking button is the one your site already uses for that class, so the block never needs its own setup:

• A class sold through Class Booking & Payment shows that add-on's own button.
• With Stripe Payments or Offline Payments, the class shows the buttons to buy a plan that includes it. When several plans include it, the visitor picks one.
• Otherwise the Registration Popup form, if that add-on is on, or Gym Builder's own Register button.

Class Routine settings

On a phone

Every layout fits a phone screen. The wide ones (Timetable and Pro Timeline) scroll sideways, with a Scroll sideways to see every day hint; Daily Spotlight's day strip scrolls the same way.

Classes

The Classes block shows a card for each class: its picture, category, the days and times it runs, its trainers and the places left. Visitors click a card's picture or title to open the class page.

Layouts

Classes settings

The booking button on a class card follows the same rule as on Class Routine: a payment add-on's buy button when the class can be bought there. Otherwise it is the class's own button, with the Button Text and Button URL you set on the class. A class with no Button Text still gets a button: Register when people can register on the class page (or the class has a Button URL), otherwise View Class. Without a Button URL it opens the class page. To hide it, switch off Booking Button under Display.

Trainers

The Trainers block shows your trainers with their photo, category, role (Designation), a short bio and social links, and links each card to the trainer's page.

Design blocks

These blocks do not read Gym Builder data. You type the words, pick pictures and links, and style them.

Slider

Large banners that change by themselves, each with its own picture, small line, title, text and button.

• Layout — Layout Type: Hero Overlay (text over a full picture; place it with Content Horizontal and Content Vertical) or Split Card (picture on one side; Image Side and Split Ratio 50/50, 60/40 or 40/60).
• Slides — click Add slide; for each slide set Slide Image, Subtitle, Title, Description, Button Text and Button URL (with Open in New Tab and Add Nofollow).
• Display Toggles — show or hide the subtitle, title, description and button on all slides.
• Slider Options — Transition Effect (Slide or Fade), Transition Speed (ms), Loop, Autoplay and Autoplay Delay (ms), Pause on Hover, Show Navigation Arrows, Show Pagination with its Pagination Type (Bullets, Progress Bar or Fraction), Keyboard Control, Mousewheel Control, Slides per View and Space Between Slides (px).

Countdown

A timer to a date: an offer that ends, a challenge that starts, an event. When the time is up, the timer is replaced by your message.

• Layout — Default (Stacked) or Split (Text · Segments) (text on the left, timer on the right), Content Alignment.
• End Date — Countdown Ends At: pick the date and time. It is read in your site's time zone (Settings → General). Clear date removes it.
• Title and Description — the words above the timer (the title starts as "Limited time offer").
• Segments — show or hide Days, Hours, Minutes, Seconds, and change each label.
• Expired State — Expired Message, shown instead of the timer once it reaches zero (starts as "This offer has ended.").

Info Box

A box with an icon or a picture, a title, a short text and a button. Studios use a row of three for "why train with us" points.

• Layout — Icon Position (Top or Left) and Content Alignment.
• Icon — Icon Source: an Icon from the built-in set (star, heart, dumbbell, calendar, clock and more) or your own Image.
• Title, Description — your words; each can be hidden.
• Button — Button Text, Button URL, Open in New Tab, Add Nofollow.

Advanced Heading

A ready-styled section heading: a small line above (Subtitle), the Title, a paragraph (Content) and a button. Each part has its own box (Title Settings, Subtitle Settings, Content Settings, Button Settings) where you type it or hide it, and its own colors and spacing on the Styles tab.

• Button Settings — Display Button, Button Text, Button URL (where the button goes), Open in New Tab and Add Nofollow, as on the Info Box and Call to Action blocks. Without a Button URL the button does not take visitors anywhere.

Call to Action

A banner that asks visitors to act: a small line above the title (Eyebrow), the title, a description and one or two buttons.

• Eyebrow, Title, Description — your words; each can be hidden. Title HTML Tag sets the heading level.
• Primary Button and Secondary Button — Button Text, Button URL, Open in New Tab, Add Nofollow. The second button is off until you switch on Display Secondary Button.
• Styles — Wrapper (background, spacing, corners) and a box for each part and each button.

Wrapper

A section that holds other blocks. Put a heading, a row of Info Boxes or a Classes block inside it to give that part of the page its own background and spacing.

• Wrapper Settings — Content Width: Full Width, or Custom with a Max Width for the content inside.
• Wrapper Styles — Background (color, gradient or picture), Margin and Padding.
• Click the + inside the Wrapper to add the first block into it.

Coupon Showcase

Shows your public coupons so visitors can copy a code or use it straight away. The block only appears when the Promotions & Trials add-on is on, and it lists the coupons you set to Show it on the site there. With none, it shows "No public offers right now."

• Heading (Optional) — a title above the coupons.
• Layout — Grid, List or Single (Featured).
• Columns (2 to 4, Grid only) and Max Coupons (1 to 24).
• Show Expiry Date — adds each coupon's end date.

Page templates (GB Templates)

Block Tools comes with six complete home-page designs, one for each kind of studio. Importing one creates a draft page built from these blocks. Its Classes, Class Routine and Trainers sections show your own classes and trainers; the other sections come with sample words and pictures for you to replace.

See the templates

1. In the WordPress menu on the left, go to Gym Builder → GB Templates.
2. Each card shows the design, its kind of studio, a short description and its colors.
3. Click Live preview to open the finished demo of that design on the WpDreamers demo site, in a new tab.

Import a template

1. On the template's card, click Import template.
2. In the window that opens, decide on Download hero & info-box images into the media library (slower). Off, the page uses the template's pictures where they are; on, they are copied into your Media Library first.
3. Click Start import (or Cancel). Keep the tab open while the five steps run: Validating template, Loading block markup, Processing images, Creating draft page, Finalising.
4. When you see Template imported, click Edit in block editor to change the words and pictures, or Preview page to look at it first.

The new page is a draft named after the studio in the design (for example "Bloom Yoga"), so nothing changes on your live site until you publish it. Each import makes a new page. On Astra, GeneratePress, Kadence and OceanWP the page is set to full width with no sidebar and no theme title; for some themes the success window adds a Tip, such as which page template to pick for a full-width top section.

Questions

If something goes wrong