21st Nov '24
/
0 comments

Changing Bricks Lightbox Arrow Icons

This Pro tutorial provides the CSS code for changing the left and right arrow svg icons with custom ones in Bricks lightbox which can be seen in elements like Image Gallery.

Before:

After:

CSS

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 633 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Width and Height of Mobile Hamburger Toggle in Bricks

Width and Height of Mobile Hamburger Toggle in Bricks

Looking to change the size of Bricks hamburger toggle in the mobile menu? The default width value of 20px can be changed by selecting the…
Categories:
Auto Responsive Grids in Bricks

Auto Responsive Grids in Bricks

This tutorial provides the CSS that can be pasted for automatic responsive grids in Bricks Builder. Posts element Each post will get a right padding…
Floats in Bricks for Wrapping Text Around Images

Floats in Bricks for Wrapping Text Around Images

In the Bricks Facebook group a user asks: Float, left or right? Just a quick question. Am I going crazy or can't I specify a…
Categories:
Tags:
How to Add a Dot Separator Between Nav Menu Items in Bricks

How to Add a Dot Separator Between Nav Menu Items in Bricks

Looking to add a circular dot separator between the nav menu items in your Bricks site? Add the following at Bricks → Settings → Custom…
Categories:
Tags:
How to create a dynamic infinite logo slider with ACF and Bricks

How to create a dynamic infinite logo slider with ACF and Bricks

This tutorial provides the builder settings, PHP & CSS codes that can be pasted in order to create an infinite logo slider in pure CSS…
How to add SVG icon as list item bullets

How to add SVG icon as list item bullets

Add this sample CSS: Replace brxe-list with the class of your ul element. Here's how you can generate the value of background-image property: Copy your…
Categories:
Tags:
Animated Border Hover Effect Buttons

Animated Border Hover Effect Buttons

Here's how can be implemented in HTML/WordPress/Bricks. Step 1 Add this CSS in your child theme's style.css or another appropriate location: Step 2 Add a…
Categories:
Using Automatic.css in Bricks

Using Automatic.css in Bricks

Update on 18 Aug 2022: The info below is not up to date. Follow documentation/videos provided by Automatic.css. Automatic.css is an excellent CSS framework that…
Categories:
Pro
Slow Zoom Effect for Slides in Bricks

Slow Zoom Effect for Slides in Bricks

This Pro tutorial provides the steps to set up a slow zoom effect for slides of nestable slider element in Bricks. Step 1 Add a…
Categories:
Tags: