cancel
Showing results for 
Search instead for 
Did you mean: 
deanf
Community Member

Scale embedded slides proportionately

Jump to solution

When using embedded google slides, I can't appear to find a way to scale the size proportionately on both desktop and mobile.

If I use width = 90%, etc then the height has to be wither forced or I get massive black borders around my slide when viewing on mobile.

Is there any way of setting up embedded google slides so that it is in proportion on PC and then viewing on mobile, it scales nicely in the same proportions too.  So not have any black borders.

We are a very visual course and although this seems picky, the presentation of our materials is important.

At the moment I am forced to define a pixel width and height that works for mobile and so appears small on the desk top. But I'm relying on the fact that I can make full screen on the desk top.

Example is here

<p style="text-align: center;">

<iframe style="display: block; margin-left: auto; margin-right: auto;" src="https://docs.google.com/presentation/d/1pFzdT1dSBv9goGUFoikJpE2mGJrC9gFNqTykUOnuQTg/embed?start=fals..." width="366" height="236" allowfullscreen="allowfullscreen" webkitallowfullscreen="webkitallowfullscreen" mozallowfullscreen="mozallowfullscreen"></iframe>

</p>

1 Solution

Accepted Solutions
rseilham
Community Coach
Community Coach

 @deanf ​:

I've been doing some research on this and I'm finding out something similar. Part of the issue is the size of the mobile app, part of it is how the RCE handles code, the other part is just the way Google Slides creates their embeds. It seems that when you collapse the Google Slide that the iframe is independent from the actual presentation. I've tried a bunch of CSS and other tricks, talked to some engineers, and we don't think there is a way for you to make this look better on the mobile device and web browser together. I would suggest instead of embedding the slide, linking to the slide instead. This creates a better experience. If you still want to see the slide on the screen, maybe you can take a screenshot of the first slide and then link to the presentation from the screenshot?

I know this isn't a desired answer, but try a few workarounds and let me know if you get anything to work.

Thanks.

View solution in original post

1 Reply
rseilham
Community Coach
Community Coach

 @deanf ​:

I've been doing some research on this and I'm finding out something similar. Part of the issue is the size of the mobile app, part of it is how the RCE handles code, the other part is just the way Google Slides creates their embeds. It seems that when you collapse the Google Slide that the iframe is independent from the actual presentation. I've tried a bunch of CSS and other tricks, talked to some engineers, and we don't think there is a way for you to make this look better on the mobile device and web browser together. I would suggest instead of embedding the slide, linking to the slide instead. This creates a better experience. If you still want to see the slide on the screen, maybe you can take a screenshot of the first slide and then link to the presentation from the screenshot?

I know this isn't a desired answer, but try a few workarounds and let me know if you get anything to work.

Thanks.

View solution in original post