Condensed Facebook Chat Overlay

Zethro

Elite Gamer
Nov 4, 2018
196
1
16
18
Visit site
For those needing a more condensed facebook chat overlay than the one I posted earlier for your stream. This CSS will show only 1 comment (the newest comment) you choose/move/size how much of that comment you want shown or remove their profile pic.

You can change the view and wrap settings inside this line:

._32cm {
width: 530px; <this will tell when to wrap your lines.
overflow: hidden;
position: relative;
height: 3.5em; <this will tell how much of the area to view before cutting off.
}

You can change/move/size profile pic inside this line:

._8r {
position: relative;
width: 60px;
height: 60px;
}

You can simple remove the profile pic just add this line to the very bottom:

._8r {
display: none;
}

OBS:
Source - Add Browser - URL: https://www.facebook.com/gaming/streamer/chat/
(side note, if you have issues, put your page number on the end like this:: https://www.facebook.com/gaming/streamer/chat/?page=################ (# = your page number))

Width: 600 < important needs to be bigger than your wrap
Height: 185 < if you add more to your view height then increase this.

Custom CSS:

Code:
body {
background-color: rgba(255, 0, 0, 0);
margin: 0px auto;
overflow: hidden;
}
a {
color: #FFFFFF;
}

._6n4l {
font-size: 20px;
font-weight: 800;
font-family: sans-serif;
}

._42ef {
position: relative;
}


._32cm {
width: 530px;
overflow: hidden;
position: relative;
height: 3.5em;
}

._4gy4 ._2fr0 {
color: #FFFFFF;
font-size: 21px;
}


._6a44 {
visibility: hidden
}
._6a44 > span > a {
visibility: hidden !important
}
._6a44 > span > a:nth-child(1) {
visibility: initial !important
}


._uql {
visibility: hidden
}
._uql > span > a {
visibility: hidden !important
}
._uql > span > a:nth-child(1) {
visibility: initial !important
}
._uq1 {
overflow-y: hidden;
}

._25zr,
._3-8j {
display: none;
}
._4-u2 ._4-u3 {
border: 0;
}
._4-u2 {
border: 0
}
._4-u8 {
background: none
}
._2l6k {
display: none
}
._2l6i {
padding-top: 8px
}

._4y56 {
color: #FFFFFF;
}
._8r {
position: relative;
width: 60px;
height: 60px;
}

._6a43 {
position: relative;

}
 

Similar threads


Reply