# The Modal Block: Put A Pop-Up Anywhere Without Touching JavaScript

URL: https://pro.flexablock.com/the-modal-block-put-a-pop-up-anywhere-without-touching-javascript/
Published: 2026-07-16T01:35:19+00:00
Updated: 2026-07-17T01:15:15+00:00
Author: admin

# The Modal Block: Put A Pop-Up Anywhere Without Touching JavaScript

Open a dialog from a button, a link, an image or an icon — and fill it with any blocks you like. No code, no extra plugin.

## Some things don’t belong on the page until they’re asked for

A sign-up form, a short announcement, the full details behind a thumbnail — useful, but not things you want cluttering the page all the time. Left inline they push everything down; the usual fix is a pop-up plugin, or a snippet of JavaScript you copy from somewhere and hope keeps working.

The Modal block keeps that content tucked away until a visitor asks for it. Pick what opens the dialog, drop whatever blocks you want inside it, and it stays hidden behind a trigger until clicked.

Open the dialog from a button, a text link, an image or an icon — whatever fits the spot.

Fill it with any blocks you like — a heading, a form, an image, a button, all inside the pop-up.

Show a welcome or offer once per visitor, so it doesn’t reappear on every page load.

Let visitors close it their way — click the overlay, press Escape, or hit the close button.

Plus the usual width, padding, colour and responsive controls, so it fits your design instead of fighting it.

Setting one up takes a moment. Choose the trigger, build the pop-up’s contents like any other part of the page, and pick how it closes — all from the panel on the right. No CSS, no scripts, nothing to remember.

## See the Modal block in action

Each demo below is the same block with a different trigger. Click any of them — the dialog opens right over this page.

**Opened by a button.** The classic pill button opens a dialog — here a small sign-up sits inside it.

Open the sign-up

×

### Join the list

Get new tutorials and release notes in your inbox. No spam, and you can unsubscribe any time.

[Sign me up](#)

**Opened by a text link.** A plain underlined link opens the same kind of dialog, so it blends into a sentence.

Read the full announcement

×

### What’s new this release

A short changelog, a couple of notes, whatever you want to share — all tucked behind one link so the page around it stays calm and tidy.

**Opened by an image.** The trigger is a thumbnail — click it and the detail opens over the page.

![Open landscape scene](https://flexablock.com/wp-content/uploads/2026/07/pexels-steve-29022333-scaled-1-1.jpg)

×

### On location

Use any image as the trigger — a photo, a poster, a map pin. Click the thumbnail and the fuller story opens in the dialog.

**Opened by an icon, shown once per visitor.** A small icon opens a welcome note that steps aside after the first view.

×

### Welcome

This one is set to show once per visitor. Open it, reload the page, and the icon steps aside — though a click still brings it back.

## Ready to add your first pop-up?

The Modal block ships with Flexa Block. Install the free plugin and it’s waiting in your editor the next time you build a page.

[Download Flexa Block](https://wordpress.org/plugins/flexa-block/)