Some code to change default arrows to custom icon. Add code to Custom CSS box
Product Arrows
button.ProductItem-gallery-next:after, button.ProductItem-gallery-prev:after { display: none !important; } button.ProductItem-gallery-next { background-image: url(https://cdn.pixabay.com/photo/2023/06/02/14/10/woman-8035746_1280.jpg); } button.ProductItem-gallery-prev { background-image: url(https://cdn.pixabay.com/photo/2023/10/19/21/08/sunset-8327637_1280.jpg); }
Summary Block (Carousel)
div.summary-v2-block .sqs-gallery-controls .next, div.summary-v2-block .sqs-gallery-controls .previous { background-image: url(https://content.invisioncic.com/p289038/monthly_2023_04/heart-arrow-left.png.dc3b32b710c169a07350cba2c41abf04.png); background-size: contain; background-repeat: no-repeat; background-position: center; background-color: transparent !important; } div.summary-v2-block .sqs-gallery-controls .previous { background-image: url(https://content.invisioncic.com/p289038/monthly_2023_04/heart-icon-right.png.b1403153d4b4a22c29b1cc99f821210a.png) !important; } div.summary-v2-block .sqs-gallery-controls .next:before, div.summary-v2-block .sqs-gallery-controls .previous:before { visibility: hidden; }
Gallery Block (Carousel & Slideshow)
div.gallery-block .sqs-gallery-controls .next, div.gallery-block .sqs-gallery-controls .previous { background-image: url(https://content.invisioncic.com/p289038/monthly_2023_04/heart-arrow-left.png.dc3b32b710c169a07350cba2c41abf04.png); background-size: contain; background-repeat: no-repeat; background-position: center; background-color: transparent !important; } div.gallery-block .sqs-gallery-controls .previous { background-image: url(https://content.invisioncic.com/p289038/monthly_2023_04/heart-icon-right.png.b1403153d4b4a22c29b1cc99f821210a.png) !important; } div.gallery-block .sqs-gallery-controls .next:before, div.gallery-block .sqs-gallery-controls .previous:before { visibility: hidden; }
List Section (Banner Slideshow + Carousel)
button[class*="arrow-button"] svg { display: none !important; } [class*="arrow-icon-background"] { background-size: contain; background-repeat:no-repeat; background-position: center center; background-color: transparent !important; } button[class*="arrow-button--left"] [class*="arrow-icon-background"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } button[class*="arrow-button--right"] [class*="arrow-icon-background"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }
Gallery Section (Slideshow Simple)
button.gallery-slideshow-control-btn svg { display: none !important; } button.gallery-slideshow-control-btn { background-size: contain; background-repeat:no-repeat; background-position: center center; background-color: transparent !important; opacity: 1 !important; padding: 30px !important; } div.gallery-slideshow-control-prev button { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } div.gallery-slideshow-control-next button { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }
Gallery Section (Slideshow Full)
button.gallery-fullscreen-slideshow-control-btn svg { display: none !important; } button.gallery-fullscreen-slideshow-control-btn { background-size: contain; background-repeat:no-repeat; background-position: center center; opacity: 1 !important; padding: 30px !important; } .gallery-fullscreen-slideshow-control-btn::before, .gallery-slideshow-control-btn::before { background-color: transparent !important; } button[aria-label="Previous Slide"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } button[aria-label="Next Slide"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }
Gallery Section (Reel)
button.gallery-reel-control-btn svg { display: none !important; } button.gallery-reel-control-btn { background-size: contain; background-repeat:no-repeat; background-position: center center; opacity: 1 !important; padding: 30px !important; } .gallery-reel-control-btn::before { background-color: transparent !important; } button.gallery-reel-control-btn[aria-label="Previous Slide"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } button.gallery-reel-control-btn[aria-label="Next Slide"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }
Gallery Section (Lightbox Arrow)
button.gallery-lightbox-control-btn svg { display: none !important; } button.gallery-lightbox-control-btn { background-size: contain; background-repeat:no-repeat; background-position: center center; background-color: transparent !important; opacity: 1 !important; padding: 30px !important; } button.gallery-lightbox-control-btn[aria-label="Next Slide"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } button.gallery-lightbox-control-btn[aria-label="Previous Slide"] { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }
Pagination Arrows
/* Pagination arrows */ .item-pagination-icon svg { display: none !important; } .item-pagination-link--prev .item-pagination-icon { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } .item-pagination-link--next .item-pagination-icon { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }
Blog: Older – Newer Entries Arrows
/* Blog Page - Oder - Newer Entries - Arrows */ .blog-list-pagination-icon.icon.icon--stroke svg { display: none !important; } .blog-list-pagination-icon.icon.icon--stroke { background-size: contain; background-repeat:no-repeat; background-position: center center; background-color: transparent !important; } .newer .blog-list-pagination-icon.icon.icon--stroke { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); } .older .blog-list-pagination-icon.icon.icon--stroke { background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/[email protected]); }