A card with an image, a heading and a short line of text usually wants to behave as one thing. Making only the heading clickable gives the visitor a small target and an odd experience.
The Container block can carry the link itself, so the whole card is the click target.
Before You Start
- Edition: Free — works in Nexter Blocks (free) and with Nexter Blocks Pro.
- Block to enable: Container, switched on under Nexter > Blocks in your WordPress dashboard.
- A Container block with your card content inside — see the Container block guide.
Steps
- Select the Container you want to make clickable and switch on its wrapper link.
- Enter the URL the container should lead to.
- Choose whether it opens in a new tab, and set nofollow if you need it.
- Publish and click anywhere in the section on the real page.
How It Behaves
The link is applied to the container wrapper, so the whole area responds rather than one element inside it.
- Measured on a published page: switching the wrapper link on added
tpgb-row-linkto the container, carrying the URL, the target and the nofollow setting as given. - This one is free. Measured with Nexter Blocks Pro deactivated,
tpgb-row-linkstill rendered — unlike the container background effects, which all disappear. - The whole container is the target, including its padding, which is what makes a card feel like a card.
- A real link inside still wins. A button or text link within the container is clicked instead of the wrapper, so a card can have one main destination and one secondary link.
Limitations
- Nothing on screen says it is clickable. Add a hover state — a shadow, a border, a colour change — or visitors will not know to try.
- Text inside cannot be selected comfortably, because dragging across it starts a click. Avoid it for content people copy, such as an address or a code.
- Nested clickable containers fight each other. Keep one wrapper link per card.
- Consider the screen reader experience. A whole section announced as one link is only helpful if its text makes sense read end to end.
Troubleshooting
Clicking does nothing
Check the URL is filled in as well as the toggle being on, and that you are on the published page rather than the editor.
Only part of the section is clickable
The link is probably on an inner container rather than the outer one. Put it on the container that holds the whole card.
My button inside goes to the wrong place
It does not — a link inside takes priority over the wrapper. If the button is unstyled it may just look like plain text; check which element you actually clicked.
I cannot select the text any more
That is the trade-off. If the text needs selecting, link the heading instead of the whole container.
