Title: canticum's Replies | WordPress.org

---

# canticum

  [  ](https://wordpress.org/support/users/canticum/)

 *   [Profile](https://wordpress.org/support/users/canticum/)
 *   [Topics Started](https://wordpress.org/support/users/canticum/topics/)
 *   [Replies Created](https://wordpress.org/support/users/canticum/replies/)
 *   [Reviews Written](https://wordpress.org/support/users/canticum/reviews/)
 *   [Topics Replied To](https://wordpress.org/support/users/canticum/replied-to/)
 *   [Engagements](https://wordpress.org/support/users/canticum/engagements/)
 *   [Favorites](https://wordpress.org/support/users/canticum/favorites/)

 Search replies:

## Forum Replies Created

Viewing 1 replies (of 1 total)

 *   Forum: [Plugins](https://wordpress.org/support/forum/plugins-and-hacks/)
    In
   reply to: [[WooCommerce] how to trigger the woocommerce product gallery lightbox to open using JS](https://wordpress.org/support/topic/how-to-trigger-the-woocommerce-product-gallery-lightbox-to-open-using-js/)
 *  [canticum](https://wordpress.org/support/users/canticum/)
 * (@canticum)
 * [7 years ago](https://wordpress.org/support/topic/how-to-trigger-the-woocommerce-product-gallery-lightbox-to-open-using-js/#post-11683561)
 * Hi,
    I found how to cut corners here with CSS.
 * 1. Edit this file: /public_html/stork/wp-content/plugins/woocommerce/assets/css/
   woocommerce.css
 * 2. Find this class .woocommerce-product-gallery__trigger
 * 3. Change this default code:
 * `.woocommerce-product-gallery__trigger {position:absolute;top:.5em;right:.5em;
   font-size:2em;z-index:9;width:36px;height:36px;background:#fff;text-indent:-9999px;
   border-radius:100%;box-sizing:content-box}`
 * into that:
 * `.woocommerce-product-gallery__trigger {position:absolute;z-index:9;width:100%;
   height:100%;text-indent:-9999px;box-sizing:content-box}`
 * 4. Now lightobx will be triggered after clicking on any element of the gallery
   or on the main picture.
 * 5. If you wish to additionally get rid ofthis magnifying glass icon you can find
   and delete this css code:
 * `.woocommerce div.product div.images .woocommerce-product-gallery__trigger::before{
   content:"";display:block;width:10px;height:10px;border:2px solid #000;border-
   radius:100%;position:absolute;top:9px;left:9px;box-sizing:content-box}.woocommerce
   div.product div.images .woocommerce-product-gallery__trigger::after{content:"";
   display:block;width:2px;height:8px;background:#000;border-radius:6px;position:
   absolute;top:19px;left:22px;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-
   45deg);transform:rotate(-45deg);box-sizing:content-box}`
    -  This reply was modified 7 years ago by [canticum](https://wordpress.org/support/users/canticum/).

Viewing 1 replies (of 1 total)