Our native carousel is quick and easy to use, but the arrows that come with it can be hard to see against some backgrounds. This article shows you how to change the opacity and background color of the native arrows.
Add an embed element anywhere on your page that has the carousel. Paste in this code:
<style>
.bc-carousel-btn {
opacity: 1 !important;
background-color: #000000;
border-radius: 50%;
}
</style>
Somethings to know about the code:
Opacity 1 is a 100% opacity. If you want a lower value then change the value to .8 or .5, whatever you want.
Background-color is optional. Delete it if you don't want it, or change the hex value if you want a different color than black behind the white arrow image.
Border-radius rounds the corner of the background color. Can be in px or %. Delete if you don't need it.
Once the code is in the embed, uncheck iFrame, save changes, and set the height of the embed element to 0px to hide it.