Hidden input fields?

[Thomas D]

Is there any built in way to have input fields hidden on the front-end but shown in the admin site editor?

[Daniel Mulroy]

Hi Thomas,

I've had to do something similar.

One option is a HTML Source Code block for your input field. Just drag in a block and just put in <input class="hidden"> etc.

Another option is to drag in a normal form, but add a class like "hide-on-load" and add a javascript snipped to hide that element on load. It'll show in PageBuilder but not when actually loaded.

@Wassim-Samad something I haven't found a workaround for is exactly this question - how do you show something on PageBuilder but hide in 'real life'? Would be nice if there was a way.

[Wassim]

@ThomasD said in Hidden input fields?:

s there any built in way to have input fields hidden on the front-end but shown in the admin site editor?

Hello,

There's a non builtin way but very easy to do.

Add a class throught the identification brush named "hidden-live"

Then drop a CSS embed code and inside do this

body:not(.pagebuilder-edition) .hidden-live {
  display:none;
}

As in the pagebuilder, the body has the class "pagebuilder-edition" you can differentiate it with this simple css.

[Dick Honing]

@Wassim nice trim! Is there class with which you can show the elements in Page Builder and hide them in Preview?

[Wassim]

Hey Dick, you mean by default ?
If not you can use my example .hidden-live above

[Dick Honing]

@Wassim I already do. Great trip. Thanks!