We need to have background images in a div tag depending on the device, so it would be something like this :

<div data-bg-m="@@background-mobile@@" data-bg-d="@@background-desktop@@" style="background: url('@@background-desktop@@') no-repeat; background-size: cover;">

I have gone through the forums and understand that below link will provide me with a solution for the inline styling or the tag for "style":

I have also gone through the link : but couldnt make this to work for multiple images in the same div tag.

For now, we have images for desktop and mobile but it is possible to add another image in future for tablet or someother breakpoint? Any suggestions?

1 Answer 1


I guess I was too fast in posting the question but I was able to answer my own question. For those, who find them in the same situation, just read through this post carefully and implement a .net assembly. That will fix work for custom html tags as well.

The solution is to create a .Net Assembly Which searches for such CSS background image patterns and replaces them with appropriate URLs. or create a C# TBB which does the same thing.

The post above has the code snippet which can help

  • Could you please summarize the post here in this answer rather than just supplying a link? The link is fine, but a summary will give people a quick insight on this site already. Mar 17, 2016 at 8:43
  • above comment edited to explain the solution
    – GJin
    Jul 11, 2016 at 19:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.