I am trying to create a form that allows a user to upload an option image, a headline and body copy.
If an image, headline, and body copy is uploaded, I’d like to display the following
( Header )
( IMG )
( H1 )
( BODY )
( Footer )
But sometimes, images aren’t necessary, and when an image is NOT uploaded, I’d like to collapse the space where the image would have gone, so the ( H1 ) rises to the top of the screen. I haven’t found a way to make this work.
This is what I’d like the output to be
( Header )
( H1 )
( BODY )
( Footer )
I’d like to avoid two types of post methods if possible. Any pointers?
I would suggest changing the visibility options for each of your items.
In this example I am using an input field in a users list. In the options for the input field, click the 3 dots and select ‘change visibility’
Then make the settings as below…
Basically what this is saying is, IF the current item (whatever it is, in my case it is a users username, for you it could be a header or image or H1, BODY, whatever you want really) is NOT EMPTY then it will be VISIBLE and if it IS EMPTY then it will be hidden.
I hope this helps, please let me know how you get on
But the result is wonky. The image placeholder no longer renders, and the Header & Body below do rise up, but way too far. Any suggestions in terms of defining a “ceiling” for the Header and Body?
FWIW, if I disable the app bar at the top, you can see the Headline and Body to collapse vertically, but instead of anchoring just below the app bar, it’s being lost just behind it.
