Problems with picture headers

I would keep things very simple. Get out your image editing app and create some header images that better suit the aspect ratio you’re trying to achieve.

Below are your images that have been placed on a canvas sized 2500 x 600 px (just an example size). These would now be ready to add as a narrow banner image, whether full width or page width. What I’ve done here is place your images over a plain colour background and sized to fit the height of the canvas. Then, with a soft brush, loaded with the background colour, brush around the edge of your image so that it blends into the background.

Sometimes, it’s easier to create such banners in an external image editing app, and then import them into sparkle at their correct aspect ratio. It’s a whole lot easier than trying to have sparkle crop them within the confines of wide box. The app I used was Pixelmator, but almost any imaging app will do the job.

P.S. If the above images are of use to you, please feel free to download them and use them in your project. To download them, just drag them to your desktop - they will be smaller when dragged. If you want the full size images, click the image first to enlarge, then drag to your desktop.

I’ve also attached a link to a sparkle file so you can see the settings used to display the banner correctly on each device variant.

https://triselcommunications.com/download/banner-sample.sparkle

2 Likes