Table of Contents

Identify Blocks CSS

Abby Updated by Abby

Please note that these classes are specific to Landbot V3 and won't work in previous versions

If you'd like to target a specific block in your flow

  1. Get the block reference from the builder:

Just right click on the specific block you'd like to target and copy the reference

  1. Once you have the reference copied you'll go to "Custom CSS" and paste the following code, changing the reference to your own and adding "_0" (the number will increase for each node element):

[data-block="Nkhbrwks_0"]

In this case, you'll change "Nkhbrwks".

  1. After you have the block targeted you'll target the specific elements that you want to change with their class names (and a space after the block identifier):
[data-block="welcome_0"] .MessageMediaBubble{
position: relative; left:60px;
}

If you'd like to target specific buttons within a specific block

In this example, I wanted to change the last three buttons within a specific block.

After the block reference and the class name, I added the following code to target the 3rd, 4th, and 5th buttons:

:nth-child(1){
opacity: 0.1;
}

This is the result:

More info

How did we do?

Background Class CSS

Buttons Class CSS

Contact