Docs

[Transfac]

My home form is displaying when viewed on tablets. Any help would be greatly appreciated. The website is dev.transfac.com

[Nabeel A]

Hi there,

Thanks for writing in! It looks like you’re hiding your section via Cornerstone Hide Section option. Please un-hide your homeform section for smaller devices.

Let us know how this goes!

[Transfac]

I don’t know how I missed that. I have a mobile form that I use for tablets and phones and I must have gotten confused when selecting screens. Even with the correction, Screenfly shows that the form isn’t being displayed properly. It shows the same error with mobile, but the page looks great when tested on my phone. Unfortunately, I don’t have a tablet to test on, so if you can help me verify whether or not there is an actual viewing error it would be much appreciated.

[Rupok]

Hi there,

I have tested and seems you have enabled hide on tablet as mentioned by Nabeel above. Let’s check the section and Row and toggle the settings.

Thanks!

[Transfac]

Mine is showing that the section in which the tablet form is contained (Copy of Section 8) is only hidden for XL, LG, and XS.

[Rupok]

Hi there,

Here goes the equivalent classes and their screen range where they take effect :

<strong>x-hide-xl</strong> – Extra Large | 1200px & Up
<strong>x-hide-lg</strong> – Large | 980px – 1199px
<strong>x-hide-md</strong> – Medium | 768px – 979px
<strong>x-hide-sm</strong> – Small | 481px – 767px
<strong>x-hide-xs</strong> – Extra Small | 480px & Smaller

So if you have LG, certainly the Tablets belong to this.

You will find the proportional screen width for all standard devices – http://mydevice.io/devices/

Hope this makes sense.

[Transfac]

I understand now. Would I use the display:none code to prevent the section from appearing on laptops with smaller screens?

[Joao]

Hi am not quite sure I get your question,

You can use the helper classes provided by Rupok, or you can use a media query with display: none;

Please clarify your question,

Thanks

Joao

[Transfac]

Enabling the tablet form on LG screens will place it, as well as the desktop form, on laptop monitors within that pixel range. I want to ensure that the tablet form is not visible to screens over 900px, so what code would I use to do that?

[Joao]

Hi There,

Please add the following code to Appereance > Customizer > Custom > CSS

@media(max-width: 900px) { 
.home .gform_wrapper form {
    display: none !important;
} }

Hope it helps,

Joao

[Transfac]

That is what I was hoping for. Thank you!

[Joao]

🙂 You are welcome.

Joao

[Author]

Posts