CMS Development

Jlawal
Top Contributor

Hide iFrame on one page

SOLVE

Hello all,

 

I'm currently working on this page. There is an iFrame at the bottom for live chat (please see photo1) and i would like to hide it as we don't want it on this page.

 

Photo1Photo1

Any advice on how to do this would be greatly appreciated.

 

Best,

Jamila 🙂

0 Upvotes
1 Accepted solution
AntonB
Solution
Participant

Hide iFrame on one page

SOLVE

Hi @Jlawal,

you can hide the iFrame by adding 

#liveAgent{
display:none;}

to your main CSS.

This will hide the live chat iFrames from all of your page.

 

If it is really the one page you can add the page class to it. You find it by opening the browser inspector and look for the class which your body has and add it to the code above. 

 

browser inspector shortcut:

Chrome: STRG+ALT+i(WIN) or CMD+ALT+i(macOS)

(other browsers should be very similar)

or 

right-click and inspect/explore

 

You'll find the body class here: 

Bildschirmfoto 2018-12-10 um 21.44.14.png

by adding the body class to the code it should look like this:

 

body.hs-content-id-6178002901 #liveAgent{
display:none;}

(there is a difference where you put it and if it has a space or doesn't - just a tipp)

 

You can also try this:

.hs-content-id-6178002901 #liveAgent{
display:none;}

 

Tipp:

add this code at the very bottom of your main css.

 

Tipp 2: 

If it should still not work try the "sledgehammer"-method by adding an !important after "none". 

Your code should look like this

.hs-content-id-6178002901 #liveAgent{
display:none !important;}

 

 

 

Hope this helps

 

 

regards, 

Anton

 

 

Did my post help answer your query? Help the Community by marking it as a solution

 

View solution in original post

3 Replies 3
AntonB
Solution
Participant

Hide iFrame on one page

SOLVE

Hi @Jlawal,

you can hide the iFrame by adding 

#liveAgent{
display:none;}

to your main CSS.

This will hide the live chat iFrames from all of your page.

 

If it is really the one page you can add the page class to it. You find it by opening the browser inspector and look for the class which your body has and add it to the code above. 

 

browser inspector shortcut:

Chrome: STRG+ALT+i(WIN) or CMD+ALT+i(macOS)

(other browsers should be very similar)

or 

right-click and inspect/explore

 

You'll find the body class here: 

Bildschirmfoto 2018-12-10 um 21.44.14.png

by adding the body class to the code it should look like this:

 

body.hs-content-id-6178002901 #liveAgent{
display:none;}

(there is a difference where you put it and if it has a space or doesn't - just a tipp)

 

You can also try this:

.hs-content-id-6178002901 #liveAgent{
display:none;}

 

Tipp:

add this code at the very bottom of your main css.

 

Tipp 2: 

If it should still not work try the "sledgehammer"-method by adding an !important after "none". 

Your code should look like this

.hs-content-id-6178002901 #liveAgent{
display:none !important;}

 

 

 

Hope this helps

 

 

regards, 

Anton

 

 

Did my post help answer your query? Help the Community by marking it as a solution

 

AHyslop
Member

Hide iFrame on one page

SOLVE

Hi Anton,

 

Im having a similar issue with my website, the chat is showing on the page but also in a Typeform iFrame, how can we hide it from the iFrame?

 

https://boom-site-new.flywheelsites.com/website-quote/

 

Many thanks,

 

Alex

0 Upvotes
Jlawal
Top Contributor

Hide iFrame on one page

SOLVE

Thank you @AntonB, that's worked perfectly!

0 Upvotes