Problem wrapping text in version 3

For the website Banair.eu I wanted to use text wrap with the pilot helmet on the homepage. It worked one time earlier with this site published on a test site. Then I changed the page and tried text wrap again.
I now I see it in Sparkle, but it is not working in the preview on Firefox/Safari (and published of course).
Tried to find out what goes wrong, cannot find it. Somehow the square around the helmet stops the text.
You can see what happens on the test site https:berwers.org/test1.

Could anyone please tell me what I did wrong? Comment much appreciated!
Benhttps://banair.eu

The image itself must be a transparent png, so the first step is removing the background - like this:


The checkerboard shows the area that should be transparent.

Place your text and image on the canvas and with the image selected, choose the CONTOUR text wrap option as shown below:

When you preview in a browser, it should look something like this:

If you right align or fully justify the text, you can better see that the text follows the contour (non-transparent outline) of the image - like this:

If it works in some browsers, but not others, it’s probably a browser issue - maybe there is some feature in the browser that displays incorrectly that isn’t supported.

1 Like

Hello Francbrowne,
thanks very much for your quick reply. In fact the image is a png file with a transparent background. In Sparkle the text is wrapping as you can see in the attached image.

And I did the same as you with the settings to Contour. In preview (and in Firefox on Linux and Mac and on Safari) there is no text wrapping as the background seems to be somehow in the way.
Now I start to doubt the png file (I also tried a different png file) and I am going to check that.
Thanks again and I will let you know the results.

It turns out that the Sparkle file became corrupt, maybe because I used Onyx or First Aid recently.
Working on a new page in the same file with the same picture I got the same result.
When I made a new Sparkle site and tried text wrap with the same picture and text it works!
Now I have to find out what to do or forget about this effect for this site (but that is not my style …).
Thanks for the help!

1 Like

I’m not entirely sure, but maybe the issue had something to do with the positioning of the text frame and the image. I don’t know if it makes any difference (haven’t checked) but it could be that the text has to be ABOVE or BELOW the image to make the text-wrap work in certain browsers. I could be completely wrong, but glad you got it sorted.

In the beginning I too thought that Above or Below, regarding the frames, could be an issue, but no matter what I tried, no difference. I am glad that this seems not to be a Sparkle issue. I am copying the site now to a new file, some work, but it looks to be solved. I worked with a lot of programs, but due to the freedom in design (with some minus) I am very happy with it. Thanks for offering me a mirror!

Onyx might remove Sparkle localizations, which triggers a Sparkle bug as mentioned in this post:

Just to say the project file might not actually be corrupt, just not openable by Sparkle.

Thank you Duncan, I am glad and not glad with your comment :face_with_hand_over_mouth: because I thought to overcome the trouble, by copying the pages to a new file, it seemed to help, until I changed the size of the picture a bit … Again it is not working. Strange, if I switch on text wrap for the picture, not only this text bloc stops at the square of the png picture, but the title too.

Should I re-install Sparkle to solve?

If text wrap is not working it’s either this Chrome bug (but Chrome 90 is out now so it shouldn’t be the case):

or there’s something else in the project. Hard to say without looking at it. Please send it to feedback@sparkleapp.com and we’ll take a look.

Yes I will re-install Sparkle tomorrow.

Text wrapping still does not work on the homepage of Banair.eu after re-installing Sparkle 3. Strange enough it worked and still works on the mobile device version of this site.

I wouldn’t expect reinstalling Sparkle to have any effect. Please send us the project file as mentioned and we’ll take a look.