Rob Bedeaux Posted September 2, 2016 Share Posted September 2, 2016 This is a pretty neat feature you can apply to a background to tint it. Place the following code in your head code of a page (or cascading pages) <style type="text/css"> .site-background { background-blend-mode: multiply; } </style> Now set your background in the admin control panel to have a greyscale image and then set the background color. You should then see the image have the tint of the background. You could use this to set different sections of your site to have the same background image but be tinted different colors to allow them to stand out as distinct. To learn more about CSS Blends check out https://css-tricks.com/basics-css-blend-modes/ Rob Bedeaux (he/him/his)Director, Partnerships & Symphony MarketingE rob.bedeaux@nbcuni.comNBC SPORTS NEXT & FANDANGO Link to comment Share on other sites More sharing options...
Bryan Hopper Posted September 9, 2016 Share Posted September 9, 2016 Rob, I really love when you put coding tips like this on the forums. Its these little customizable tweaks that make the subtle difference between a regular page and a customized one. This one doesnt seem to work though. When I put the head code in our "summer internships" page it got all funky on me in edit mode. See the screen shot below. Link to comment Share on other sites More sharing options...
Rob Bedeaux Posted September 9, 2016 Author Share Posted September 9, 2016 Hey Bryan, Sorry I missed the close style tag above. I've updated it. -rob Rob Bedeaux (he/him/his)Director, Partnerships & Symphony MarketingE rob.bedeaux@nbcuni.comNBC SPORTS NEXT & FANDANGO Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.