Update gifting icons in modal

The easiest way to update the icons that Givy uses on the first page of the gifting modal is to:

Create new square icons for the images you'd like to replace
Upload the images to your store's "Files" section
Copy the URL for each of these images
Update CSS in Givy under "Storefront Assets > Custom CSS > Gifting Modal

Use the following CSS as a template, adjusting the image URLs to your image's location.

.g-gifting_form__add-to-cart-button svg {
  display: none;
}

.g-send-method__email-option .g-svg,
.g-send-method__link-option .g-svg,
.g-send-method__print-option .g-svg {
  display: none;
}


.g-send-method__option div:first-of-type::before {
  content: "";
  width: 60px;
  height: 60px;
}

.g-send-method__email-option div:first-of-type::before {
  background: url("https://cdn.shopify.com/s/files/1/0860/1234/1234/files/E-mail.svg?v=1790908847") center / contain no-repeat;
}

.g-send-method__link-option div:first-of-type::before {
  background: url("https://cdn.shopify.com/s/files/1/0860/1234/1234/files/URL.svg?v=1790908847") center / contain no-repeat;
}

.g-send-method__print-option div:first-of-type::before {
  background: url("https://cdn.shopify.com/s/files/1/0860/1234/1234/files/Print.svg?v=1790908848") center / contain no-repeat;
}

Related Articles