I have a long text object. Maybe 4-5 paragraphs with about 10 lines each para. Some images are supposed to come interspersed between the paras. So i created some image frames, loaded them with images and pasted them INTO the text box. It works well and as expected.
However when the text box is set to reponsive sizing, the images dont respond along with the text box as one would expect. So only the text starts autowrapping as the text box width narrows, but the images stay the same.
Any pointers how this should be handled ?
Place an image of your choice (CMD+D or STRG-D) onto the canvas (anywhere), copy it (or cut it out - faster - you spare the delete command), delete it, paste it in the spot, you want to have the image appear in your text(box). You do this by doubleclicking in your textbox and search for the cursor - place that cursor in the right spot/place, where you want the image to appear - paste - resize the image - done. Unfortunately, the image itself does not react responsive if you use fluid responsiveness but if you use fixed size of the textbox and use breakpoints and change the size of the textbox, the image stays in place and can be setup with a new size for each breakpoint.
Guenter from our forum is much more specialized in image and text stuff - if we are lucky he chimes in here and may have some better hints for you. Let´s see.
Using text I always recommend(ed) to use fixed width breakpoints, like this I always did not need to put images inside a textbox. For me it was too unpredictable but I almost never used long-large textboxes anyway, so, …
It is also easier for IBE to have seperated text boxes (in all of my cases) as clients always find ways to make changes in textboxes, images (sizes), that IBE cannot handle for some reason, and finally I have to do it - you´ll have a very unlucky client and an unlucky designer. Nobody wants that.
Hi Uwe !
Thanks for your idea. I shall also try the method given below and see.
As Uwe said, you can paste images into a text box and the image will flow together with the text.
It is true, that these "inline images" unfortunately don’t scale, when the browser window is scaled. The developers worked on this feature, but it couldn’t be finished, because Muse’s "End of Life" was faster. 😞
Nevertheless, there is an elegant workaroud:
Instead of an image, use a slideshow widget with just one image. Configure it without any text components. This construction will work as expected. The image scales together with the text box:
Hello Gunter !
Thanks for this method i will try it immediately. By adding the widget will it make the file size heavier or slower page due to this combination because i need to put 5 images one below the other in the para.
Just try! The code certainly is a little "heavier" than using simply images, but I don’t think, there will be a noticeable load time issue for your site’s visitors.
I just tried the method, but it didnt work. I tried with basic slideshow, then blank slideshow also. The text para is set to scale width and the breakpoint is also fluid. But the image doesnt scale and it moves out of the para box and off screen while the para text is correctly scaling.
Unfortunately you are right!.
Evidently this behaviour war changed during the last development periods: I am working with Muse 2018.0. and my workaround works without issues.
In Muse 2018.1.x the behaviour is just as you described it.
So you have to follow the "old school" workflow:
Place text frames and image frame one beneath the other and make sure, that they don’t overlap.
This definitely works.
Ok so just place individual text boxes and images below them in a column but as individual objects.. So as the text boxes expand towards the bottom they PUSH the images also down in a flow ?
Yes, they do. Just make sure, that your text boxes and images don't overlap. If they do, Muse can't know, that you want the element to push down/lift up each other.
Tried the old school method. Works well. Except its creating a huge empty space at the bottom of the page when we contract the browser width in a test preview. So i hit preview. Everything is ok. The moment you contract the width of the browser, the text starts squeezing and the images also start shrinking (which is correct), but as a side effect there is now a huge blank space in the bottom, so the bottom of the para scrolls off into the top and then huge blank space (basically the void created by the shrinking of the images on the Y axis i think). Hence blank space void is created between the para bottom and actual page bottom.
To avoid hours of a frustrating questions and answers game, and because this "problem" may have thousands of reasons, could you please do the following:
Upload your .muse document to Dropbox or a similar file sharing service and post the download link here. Then I will have a closer look.
If you don't want to share your original .muse file, delete all unnecessary elements, use placeholders or create a new Muse document with some text and sample images, which shows, what you are trying to achieve.
Hi, i dont have a dropbox account. I shall try creating one. Meanwhile im attaching some pictures here to help explain it better. Plz see the following...
Yes, that is "normal behaviour". Your layout had 2 columns (small image to the left, images and text to the right), and in this case it is quite tricky to keep things in order, because Muse can't know, which of the elements should push down/lift up which other elements. To solve this issue, it is necessary to have a look at the .muse file.
If you are not experienced in web design it would be much, much easier, if you create a one-columne-design.
By the way: You don't need a Dropbox accout. Your CC subscription contains a file sharing component. Just have a closer look into your CC Desptop app!
Its all on one column only. Just that grass image is pinned to the left upper corner of browser and the top menu bar pinned to right upper corner of browser. The para is right edge page pinned to enable it to scroll. Few minutes please, ill share the .muse file.
Nice. But there is no obvious possibility to download your file. You don’t expect us to create an account for this service, do you? 🙂
Upload your file, and after that sign out of this service and test the download before posting: try to download the file by yourself …
Im able to download from that very same link. Theres no sign in even required. Nothing. I just refreshed. Closed all my pages and downloaded from a different pc and its working. WHy would you have to create an account ???
See it first well....It has a big GREY download this file BUTTON. Below that it says sign up etc in PINK thats all optional.
I alwys test a download if its working. Twice. Before i share.
Heres another link....
Just click and hit the download button only for all these. Theres no complication.
As you said in a post above...." Unfortunately you are right!. Evidently this behaviour war changed" .... Similar to that you missed something here also and will change your opinion, give it a try. It needs no regn or anything but a click. You dont expect a link which needs no click i hope :)).
NOTE : If you remove the images, the para works correctly without this excess space being created. This indicates something to do with the images expansion.
All works as expected, and the issues are pure layout issues, no Muse problems.
Her you find a modified and corrected .muse file:
Furthermore, I can’t understand, why CC users fiddle around with those third party file services. Why not use CC Files: