To add a link to a whole column in a Beaver Builder layout you need to use some jQuery to add the link tag markup to make the whole column clickable.
It is preferable to probably just redo the layout as html from scratch in a html module, but if you need to present the layout in a Beaver Builder way so its content is easy to change for someone else then use jQuery.
So in the above layout, there are 3 columns, each column has a heading module with a link and a column background image, the user wants the whole background of the column to be a link – which is the same as the heading link. The column initially has no padding and equal heights are disabled.
The column’s contents are wrapped rather than the column itself – with the column set to have zero padding, that’s set in the CSS.
Give each column a generic and unique class – ie link-col and link-col-1, link-col and link-col-2 etc
In the above-commented jQuery code, each column is targetted, its first link is set to a variable which is then used in the link mark up a tag to surround the fl-module content.
We also have to give the element some height and center things so a big of flexbox is needed – for the height, you can either set a fixed height or use padding – really depends on the content.