foundation
Bulletproof background images
Custom helper that adds bulletproof background images to your email templates.
Based on https://backgrounds.cm/
Usage
{{#bg-img src="assets/img/image.jpg" classes="hero-header" imgwidth="900" imgheight="520" bgcolor="#212831" top_padding="30" bottom_padding="30"}}Your Content Here{{/bg-img}}
Options
- src: Path to your background image
- classes: Adds custom classes for custom css styling
- imgwidth: Sets the width for Outlooks <v:rect> tag.
- imgheight: Sets the height for Outlooks <v:rect> tag.
- bgcolor: Sets background color for the block of code. Must be hex value (#212831)
- top_padding: Adds padding to the top of the background image block
- bottom_padding: Adds padding to the of bottom the background image block.
- fitcontent: Sets mso-fit-shape-to-text:true. Use at your own risk.
Example
Love this! We think this would actually be better as an inky tag than a helper, that way folks who aren't using the template could still use it. Was there a reason you did it here instead? Could you set it up as an inky tag here? https://github.com/zurb/inky
@kball It could probably be an Inky tag as well. I just wasn't very familiar with the framework at the time of creating this for my project. I haven't gotten back around to messing with zurb since I finished the project I had been working on. I will be working on a few more projects for our platform soon which I will investigate adding it to inky.