Small plugin to enable linkable columns in Elementor (SEO friendly and "natively")

elementor-linkable-columns.php

<?php
/**
 * Plugin Name: Elementor Linkable Columns
 * Description: Elementor extension that enables linkable columns.
 * Version:     1.0.1
 * Author:      Rayken
 * Text Domain: elementor-linkable-columns
 */

/*
    NOTES
    - Make sure you do not have any <a>-tags within the column you want to make linkable, as it will break layout
    - Heavily depends on the Elementor constant 'ALLOWED_HTML_WRAPPER_TAGS' (https://github.com/elementor/elementor/blob/master/includes/utils.php#L25) including the <a>-tag (or until Elementor adds a filter for it)
    - Works as of this change: https://github.com/elementor/elementor/commit/20c86435a22f0faa33548dd01840756455875c41#diff-a4c20b6d7391a224faf11e6161c80b408e2a0f5a71a92dc11b7eafe3cad83f94R26
    - Can be expanded to work on sections too
    - Grab lines 29-72 if you don't want a plugin
    
    TODO
    - Figure out if we can find all <a>-children and disable them
*/

if( !defined( 'ABSPATH' ) )
    exit;

add_action( 'plugins_loaded', function() {
    if( !did_action( 'elementor/loaded' ) )
        return;

    // add a URL control to the column layout tab, if <a> is selected as html_tag
    add_action( 'elementor/element/column/layout/before_section_end', function( $section, $args ) {
        $section->add_control(
            'column_link',
            [
                'label'         => __( 'Link', 'elementor' ) . ' (' . strtolower( __( 'Column', 'elementor' ) ) . ')',
                'description'   => 'NOTE: Using anchors within this column will break it! Anchors within anchors is not valid HTML.',
                'type'          => \Elementor\Controls_Manager::URL,
                'placeholder'   => __( 'https://your-link.com', 'elementor' ),
                'show_external' => true,
                'label_block'   => true,
                'default'       => [
                    'url'           => '',
                    'is_external'   => false,
                    'nofollow'      => false
                ],
		        'dynamic'       => [
		            'active'        => true,
				],
                'condition'     => [
                    'html_tag'      => [ 'a' ]
                ]
            ]
        );
    }, 11, 2 );

    // add <a> to the html_tag control
    add_action( 'elementor/element/column/layout/before_section_end', function( $control_stack, $args ) {
        $control = \Elementor\Plugin::instance()->controls_manager->get_control_from_stack( $control_stack->get_unique_name(), 'html_tag' );
        $control['options']['a'] = __( 'a' );
        $control_stack->update_control( 'html_tag', $control );
    }, 10, 2 );

    // modify output of column to handle <a>
    add_action( 'elementor/frontend/column/before_render', function( $widget ) {
        $settings = $widget->get_settings_for_display();
        if( $settings['html_tag'] !== 'a' )
            return;
    
        if( empty( $settings['column_link']['url'] ) )
           return;
    
        $widget->add_link_attributes( '_wrapper', $settings['column_link'] );
    }, 10 );
});

Great plugin! Is there a way to add dynamic tag to the link field?

I believe so, I found this. So I added it to the control above. If you try the updated code, is that what you were after?

@Rayken! Great, adding :
'dynamic' => [ 'active' => true, ],
Allows me to set a dynamic tag. Thanks.

How could I expand the function to work on sections, too?