Forum Discussion
Image control
I would like to create a divider using an image that I have created. I have made something that is 1920x150 for this purpose.
I tried it as a centered image and it seems to be downsized. It does not go the full width. I want the image to go the full width of the lesson page. Is this doable? I see that other Rise images will do this.
If I do image centered, it is sized down so that it will not span the page. If I do Image Full Width it upscales it and cuts off the left side of the image. Is there any way to get the image to display as it was created?
Maybe the width is wrong. What should be the dimensions of a graphic that will go full width without being upscaled?
Thanks.
Hi Martin!
Try using an interactive labeled graphic block, and remove all markers from the block so that only the image is displayed.
Try various image widths in the block settings -- I think you'll have the most success using Full Width, as shown below. Let me know how that goes!
This option works, however your course / the lessons never get marked as complete because the labeled graphic block is an interaction with completion and with it having no markers it never completes.
Alyssa, thank you for this workaround. I was having the same problem as Martin and could not figure out what to do. For anyone else who stumbles on this thread, here is a summary of the issue I had:
- I wanted to display a full-width image which would scale with the screen size without getting cropped.
- I learned that when using the "Image Full Width" block type, Rise automatically crops the image rather than just scaling it. This is problematic if you want the learner to be able to see the entire image. Using this block type, there is no way to predict how much of the image the learner will actually see.
- I learned (in this thread) that using the interactive "Labeled Graphic" block type -- then changing the setting to "full width" -- forces Rise to display the entire image. Using this block type, Rise will scale the full-width image with the screen size rather than cropping the image to fit the screen.
This is a really helpful tip (which may be subject to change in the future if Rise updates the "Image Full Width" block type to allow scaling rather than auto-cropping).
I wish Rise woul fix that and give options, especially for Text on Image
Agreed!
Hello,
I am wondering if there is further resolve to this?
I am having the same issue, creating dividers which are of high quality, being pixelated when used as a full width image, it is slightly better as an unlabeled labelled graphic.Hi Kate,
Here is how I do this.
Create a Block Type: Divider --> Spacer
This will create a white spacer.
Click on the Style button for the spacer block.
Scroll to the bottom and change the style to Image.
Choose your image.
Change the Overlay value to 0%.
Change the padding to increase or decrease the height of the spacer block.
