A way to create an "application" wrapper Div?

Adrian Cotter

In a related questions to my last one, instead of doing my layout conditionally, another way of approaching the problem was to be able to style elements across different applications by creating a class per application.

So in my page wrapper, around my page layout and content I would have

So in my CSS I could do things like

.application13 .WrapperBack

.application13 .SideBar

.application22 .WrapperBack { border-color: red; }

etc...

Unfortunately, I can't seem to do this, because when I try:

It is not parse correctly by the WYSIWIG, for obvious reasons.

Is there any other way I can accomplish this?

Adrian Cotter

So I went back to the documentation and tried again...

And this does the trick!

<div class=application[[s4]]>

(in case the class does not read correctly it is two sets of square brackets surrounding s4 with no spaces )

</div>

So now I can set CSS styles based on the application I happen to be in.

example:

.application2 .WrapperBack

Here are some application IDs (i'll add more over time):

2 events calendar

13 photos

19 page builder

95 storybuilder

150 take action

210 personal events

3301 admin

Joanna Houlim

test100

c.stauffer

Adrian Cotter:

So I went back to the documentation and tried again...

And this does the trick!

<div class=application[[s4]]>

(in case the class does not read correctly it is two sets of square brackets surrounding s4 with no spaces )

</div>

So now I can set CSS styles based on the application I happen to be in.

example:

.application2 .WrapperBack

Here are some application IDs (i'll add more over time):

2 events calendar

13 photos

19 page builder

95 storybuilder

150 take action

210 personal events

3301 admin

This is fairly creative, I will look into using this technique.

Adrian Cotter

Adrian Cotter:

So I went back to the documentation and tried again...

And this does the trick!

<div class=application[[s4]]>

(in case the class does not read correctly it is two sets of square brackets surrounding s4 with no spaces )

</div>

So now I can set CSS styles based on the application I happen to be in.

example:

.application2 .WrapperBack

Here are some application IDs (i'll add more over time):

2 events calendar

13 photos

19 page builder

95 storybuilder

150 take action

210 personal events

3301 admin

So you can also do this in the additional body tag attributes by doing: