Make an Image Trigger a Divi Show / HIde Button


Boost Your Site and Save 20% this Weekend

Join 50,000 users and build a better site with 20% off all Divi Booster plugins.

Discount applied at checkout. Offer ends Monday!








Divi Show / Hide Button lets you reveal and/or hide Divi Builder elements at the click of a button. If you have an existing Divi Show / Hide Button module on your page, and would like to additionally have an image module on your page which triggers the same action as your show / hide button, there are several ways you can do it.

Use a Second Show / Hide Button as the Image

One way to make the image perform the same action as the button would be make a copy of your button and use this as the image by removing the button text and setting your image as the button background, as described in this post:


Make a Click on the Image Module Trigger a Click on the Show / HIde Button Module

An alternative is to use some jQuery code to pass a click on the image through to the show / hide button, e.g.:

    $('#myimage').on("click", function(){

​To use this:

  1. Add it in to your site (e.g. at "Divi > Theme Options > Integration > Add code to the head of your blog")
  2. Give your Image module an ID of "myimage" at "Image Settings > Advanced > CSS ID & Classes > CSS ID"
  3. Give your Divi Show / Hide Button module an ID of "mybutton" at "Show / Hide Button Settings > Advanced > CSS ID & Classes > CSS ID"

This post may contain referral links which may earn a commission for this site

Divi Booster

Hundreds of new features for Divi
in one easy-to-use plugin


Submit a Comment

Your email address will not be published. Required fields are marked *