cancel
Showing results for 
Search instead for 
Did you mean: 
Surveyor

How do you change the size of an embedded Google Doc?

You used to be able to drag and make Google Docs larger, but in the past 4-6 months it changed and you are no longer able to do that in the rich content editor. Now you have to use HTML and guess what size you want the document. Why is it not working any longer?

24 Replies

Hi rmerrill@graniteschools.org

Click the Help menu item in account navigation, the choose "Report a Problem".

I hope this helps,

Kelley

I've been reading this thread and I have used Stefanie Sanders' very helpful tip on embedding dynamic content from Google Docs in Canvas, but now I just want to embed my course calendar-  something I don't want students to be able to edit.  When I use the embed code (and not the share link), the table comes out with narrower columns and in a frame that does not support its size without side scrolling and up/down scrolling.

If I insert width="100%" height="1000px" between (...)/pub?embedded=true"> and </iframe></p>, as suggested elsewhere, the sizing does not change.

Any idea what the best way to just have the document appear, without the Google Doc editing tools showing, and more crucially, such that the document is un-editable by students?

Surveyor

I don't know if this helps, but I embed a few google docs in my Canvas pages and the only way I know how to do it is by embedding an iframe.   You get the code from the "share" function in Google Docs.   But the way I frames work is that you HAVE to specify the width and height as it can't be calculated in real-time.  That's the one big drawback to any iframe. 

Once you have pasted that code (in the HTML editor always), you should be able to see a blanked-out box the exact size that your iframe will take, though the content will not load until you save the edit.

Because the Canvas page is reloading the iframe every time you refresh that page, you should see any changes made to the google doc.

I'm not sure I understood your question, but I hope that helps.

Learner II

There was an update recently (summer 2017) that caused this change in behavior. As far as I know, the only way to resize iframes now is to change the HTML code for height and width. 

Surveyor

I think you might be referring to changing the size of text-boxes on the fly.   This is possible in Canvas (probably via jQuery), but I don't think it's every been possible with an iframe.  I don't think it's every been done in any scripting environment on a webpage simply because of the basic way iframes work in HTML.  Could you possibly be confusing input or viewing text-boxes with iframes?

No. You used to be able to adjust iframes in the rich content side. Canvas changed this at some point around June. Changing back would be great.

Taylor Hall

6th grade Humanities and Writing

Taylor, I'm sorry--I misunderstood your question.  I thought you were referring to viewing an iframe, but you were referring to editing an iframe.   Sorry for the mixup.

Community Coach
Community Coach

taylor_hall@beaverton.k12.or.us,

Were you able to find an answer to your question? I am going to go ahead and mark this question as answered because there hasn't been any more activity in a while so I assume that you have the information that you need. If you still have a question about this or if you have information that you would like to share with the community, by all means, please do come back and leave a comment.  Also, if this question has been answered by one of the previous replies, please feel free to mark that answer as correct.

 

Robbie

I don't see this issue as being solved. There is no width height to adjust.

Community Member

After playing around with this for awhile, this is what I have found. Adding the height and width code does work, but it takes a LONG time for changes to show up. To make changes show up automatically, I had to go about it in an entirely different way.

Instead of publishing, I embedded it as if it were a video (and then changed the html code). It takes more steps, but I ended up liking the result a lot more (and for more reasons than just the automatic updates). See below for the steps. 

1. Get the share link from the google doc

2. On Canvas Page, click to insert media

3. Paste the share link, but change the last part of the link 
CHANGE /edit?usp=sharing TO  /preview?pli=1
*Note = this is what puts the document into preview mode and show up on the page correctly

4. Change the dimensions
*Note = I recommend width = 100% Height = 600

5. Click Okay

6. Click HTML Editor

7. Adjust code 
change video to iframe, delete controls, extra bracket, and source
*Note = The document will not show up without these changes

Example:

CHANGE 

<p><video width="100%" height="600" controls="controls">
<source src="https://yourgoogledocshareaddress/preview?pli=1" /></video></p>

TO

<p><iframe width="100%" height="600" src="https://yourgoogledocshareaddress/preview?pli=1" /></iframe></p>

8. Save