For some time, I have tried to figure out how to have an image in the background of text. For our audience it is much more acceptable to have a text background that looks like textured paper or parchment rather than one flat color.
I have recently learned how to make this work in Scripture App Builder and am sharing the solution:
- Navigate to Media → Illustrations to add your desired background image.
- In Appearance → Styles, select the style (the CSS Selector) you want to change. For me, this was “body”.
- Add the
background-imageproperty to the declaration block, and give it the valueurl(illustrations/filename.png)as in my example below
body {
background-image: url(illustrations/vellum.png);
}
@ChrisHubbard, who taught me about this, also mentioned the CSS styles that also govern the image:
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
Some adjustment may be necessary for different devices & aspect ratios.