Support Center Visit Demo License manager Buy @ envato

make whole column or textblock a link

teublteubl
in Visual Composer
Hi there,

I have the following:
1/2 column + textblock (with image + text)   |   1/2 column + textblock (with image + text)

Now i'd like the whole column to link to a certain page. I tried to put the image + text between <a> tags, but the closing <a> tag jumps back to after the image. So the image is linked, yet the text remains plain text.

Is there a global way to change this - apart from linking the text seperately to the same page..

Cheers!

Comments

  • AlbertAlbert
    Hi,

    we are sorry but such thing is not possible unfortunately.

    Thanks!
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • lubke2005lubke2005
    Hi, there is a simple trick you could apply:

    add the followig JS-Snippet to the betheme JS section:

     jQuery(function($){
    $(".entire-div-link").click(function() {
      window.location = $(this).find("a").attr("href"); 
      return false;
    });
    });


    This snippet will search for any link inside the column and use it for the entire column-DIV.

    Now you just need to add "entire-div-link" to the custom CSS-Class field of the column. This will render the entire column clickable.

    To make it look nice, you could add the following CSS-snippet to the custom CSS code section of the betheme options:

    .entire-div-link:hover{
     cursor:pointer;
    }

    This will make the mouse cursor act like it is hovering a real a-element.

    Hope this helps!
  • BordegoniBordegoni
    lubke2005, you have solved my problem!! Thanks a lot :)
  • coltruckercoltrucker
    lubke2005, thanks for the great code. One question: Is there a way to build the JS code so it will automatically open in a new tab?  I've tried to build it out, but can't figure it out. 

    Thanks.
Sign In or Register to comment.