Answered

How to get SIDE BY SIDE view (video on one side, answers on the other)

  • 19 December 2022
  • 6 replies
  • 83 views

Userlevel 1

Hi, for some reason when I embed my VideoAsk into my website, it loses the “side by side” functionality that i see in the builder.
Instead of keeping the video on the left and the answers on the right, it takes up the whole iframe with the video and the answers are overlayed ON TOP OF the video, which makes it impossible to watch the video or to see all the text in the answers.

How do I get it so the layout that we see in the builder is maintained once embedded? It doesnt make sense that the layout changes but i can’t figure out how to fix it

 

Thank you

icon

Best answer by Grace 20 December 2022, 10:22

View original

6 replies

Userlevel 7
Badge +5

Hey @Nathania welcome to the community!

This will be to do with the page width of your website, it should be possible to change the layout of the embed by adjusting the width in the embed code, you might need to play around with it a bit to get it looking how you want but we have some more information on this over on our Help Center here which hopefully helps.

You can also delay the answer type from appearing to allow people to watch the video more clearly before answering the question. 

Hope that helps, let us know if you have more questions!

Userlevel 1

This was helpful, thank you! I got it to work on desktop.

But now on mobile version, the text is ON TOP OF the video, so you cannot see the video and you cannot read the text.

Do we have any control over the mobile layout? It doesnt make sense that this is how it looks…. it’s not usable.



 

Userlevel 7
Badge +5

Hi @Nathania, thanks for sharing your feedback and screenshot!

You should be able to use HTML/CSS to apply certain formatting rules to the embed code on mobile. If someone loads the page from a mobile device (small screen), it looks like you’d want to extend the height of the embed. That way you can see the speaker at the top of the embed and the answer choices near the bottom.

Userlevel 1

Thank you. i don’t speak CSS. Do you guys have any code we can copy/paste or do I need to hire a developer to get this embedded into my site?

Userlevel 7
Badge +5

@Nathania This code snippet uses the widget embed instead of the iframe embed, but it should be a useful template for you to customize behavior based on device/screen size.

Hey @Nathania I would like to learn if you could find a way out for smaller screen sizes.

Reply