Change contents of a resuable page builder page dynamically.

Michael Turner · November 2016

Hi all,

I have a problem that I'm not quite sure how to tackle...

I have a set of 3 page wrappers that are all identical except for the CSS they call so that they can appear with different colors and fonts. But the fundamental display of the content remains untouched. The intent is to have a series of websites be created for upcoming events this year and to plug them into the page wrapper of their choice.

So far so good - i have a reusable nav, reusable sidebar and a reusable footer plugged into the page wrapper and then using [[S63:3]] I bring in the page builder content. All of it works great except now I'm struggling with how to make the navigation links and sidebar links unique for each event. I don't want to have to copy the page wrapper X amount of times and have many copies where only the reusable navigation and reusable sidebar name are altered.

My initial idea for getting around this would be to use Javascript within these files to check the name of the event from the URL path and then serve the right set of links based on that. The big drawback here is that i'll have to manually go in and input the navigation and sidebar links along with a unique identifier for them...what's worse is that as my list of sites grows so does the size of these files. I can see it becoming a huge headache to maintain these files and the goal is to eventually have less technical people be able to set these sites up themselves. So the JS solution doesn't really seem all that viable...

Does anyone know of any S-tags or any Luminate wizardry that could help with this?

Much appreciated!

-Mike

Brian Mucha · November 2016

I'd do this with S-Tags.

If you can differenciate the events based on the URL, use the S8 tag.

https://www.blackbaud.com/files/support/helpfiles/luminate-online/help/luminateonline.html#../Subsystems/S-Tags/Content/S-Tags/S8_Current_URL.html

We do something similar to style particular sections in Teamraiser.

[[?[[S8]]::pg=entry::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-home.css" />

::

[[?[[S8]]::pg=personal::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-personal.css" />

::

[[?[[S8]]::pg=team::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-team.css" />

::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout.css" />

]]]]]]

EDIT: To finish with this idea. You'd replace the style links with sidebar and navigation reusables. You can even put this entire nested conditional in a reusable, so you aren't editing the wrapper all the time.

[[?[[S8]]::pg=entry::

[[S51:reus_SidebarOne]]

::

[[?[[S8]]::pg=personal::

[[S51:reus_SidebarTwo]]

::

[[?[[S8]]::pg=team::

[[S51:reus_SidebarThree]]

::

[[S51:reus_SidebarDefault]]

]]]]]]

Michael Turner · November 2016

Brian Mucha:

I'd do this with S-Tags.

If you can differenciate the events based on the URL, use the S8 tag.

https://www.blackbaud.com/files/support/helpfiles/luminate-online/help/luminateonline.html#../Subsystems/S-Tags/Content/S-Tags/S8_Current_URL.html

We do something similar to style particular sections in Teamraiser.

[[?[[S8]]::pg=entry::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-home.css" />

::

[[?[[S8]]::pg=personal::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-personal.css" />

::

[[?[[S8]]::pg=team::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-team.css" />

::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout.css" />

]]]]]]

Hi Brian,

Thanks for the reply! That sounds like something that I might be able to do. If you don't mind could I pick your brain about the S8 tag?

I've looked at the link you sent me to and it seems like it's use case is very similar to what I was going to do with Javascript. Just to be sure though...in your example you have the [[S8]]::pg=entry...I imagine that the "entry" is the page name or unique identifier that when present will have that stylesheet added to the page. If you were to make a new page, lets say called "login" would you have to go to the page/file where these s-tags are and add in another [[S8]]::pg=login to make the custom changes to it?

Brian Mucha · November 2016

Michael Turner:

Brian Mucha:

I'd do this with S-Tags.

If you can differenciate the events based on the URL, use the S8 tag.

https://www.blackbaud.com/files/support/helpfiles/luminate-online/help/luminateonline.html#../Subsystems/S-Tags/Content/S-Tags/S8_Current_URL.html

We do something similar to style particular sections in Teamraiser.

[[?[[S8]]::pg=entry::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-home.css" />

::

[[?[[S8]]::pg=personal::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-personal.css" />

::

[[?[[S8]]::pg=team::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout-team.css" />

::

<link rel="stylesheet" type="text/css" href="../_wrappers/stepup/2011/layout.css" />

]]]]]]

Hi Brian,

Thanks for the reply! That sounds like something that I might be able to do. If you don't mind could I pick your brain about the S8 tag?

I've looked at the link you sent me to and it seems like it's use case is very similar to what I was going to do with Javascript. Just to be sure though...in your example you have the [[S8]]::pg=entry...I imagine that the "entry" is the page name or unique identifier that when present will have that stylesheet added to the page. If you were to make a new page, lets say called "login" would you have to go to the page/file where these s-tags are and add in another [[S8]]::pg=login to make the custom changes to it?

Yes, exactly.

In teamraiser the URL looks like: http://foundation.luriechildrens.org/site/TR?fr_id=1680&pg=entry

So we can use S8 to ask "If the URL contains 'pg=entry' then use these assets, otherwise if the url contains..." and so on.

Any page not tested for would use the last default set.

EDIT: Note that you can only nest conditionals around 20 deep or so. If the logic stops working, then you need to start a new nested set. Just have the previous set's default be nothing.

Michael Turner · November 2016

Ok great thanks for clarifying! Certainly nice to know that there is an in house solution that wouldn't require javascript. Sounds like this is the route to go - only bummer is someone reasonably technical will always have to be involved to update the S-tag and the specific commands it should perform every time a new site is introduced... Thats ok though I suppose.

Thanks a lot for your help Brian, I appreciate it very much!

Brian Mucha · November 2016

The nice thing about having this all isolated in a reusable page is you can comment the heck out of it and keep it simple.

Nested conditionals are a bit tricky. You could just have them stacked, which would be way easier for the less technical. You don't get a final default that way though.

I bet most people could figure out how to add page four in this:

[[? [[S8]] :: "first_page_id" :: <first assets> :: ]]

[[? [[S8]] :: "second_page_id" :: <second assets> :: ]]

[[? [[S8]] :: "third_page_id" :: <third assets> :: ]]

Romany Nassief · November 2016

Michael Turner:

Hi all,

I have a problem that I'm not quite sure how to tackle...

I have a set of 3 page wrappers that are all identical except for the CSS they call so that they can appear with different colors and fonts. But the fundamental display of the content remains untouched. The intent is to have a series of websites be created for upcoming events this year and to plug them into the page wrapper of their choice.

So far so good - i have a reusable nav, reusable sidebar and a reusable footer plugged into the page wrapper and then using [[S63:3]] I bring in the page builder content. All of it works great except now I'm struggling with how to make the navigation links and sidebar links unique for each event. I don't want to have to copy the page wrapper X amount of times and have many copies where only the reusable navigation and reusable sidebar name are altered.

My initial idea for getting around this would be to use Javascript within these files to check the name of the event from the URL path and then serve the right set of links based on that. The big drawback here is that i'll have to manually go in and input the navigation and sidebar links along with a unique identifier for them...what's worse is that as my list of sites grows so does the size of these files. I can see it becoming a huge headache to maintain these files and the goal is to eventually have less technical people be able to set these sites up themselves. So the JS solution doesn't really seem all that viable...

Does anyone know of any S-tags or any Luminate wizardry that could help with this?

Much appreciated!

-Mike

Another solution is use S151 tag that test if a named page is available or not like that:

====================

[[?[[E151:reus_assets_[[S334:pg]]::TRUE

::

[[E51:reus_assets_[[S334:pg]]]]

::

[[E51:reus_assets]]

]]

====================

You can just create new reusable pages based on "pg" parameter like (reus_assets_entry, reus_assets_personal, etc...) without any extra conditions. The above condition appends the URL paramter "pg" to "reus_assets_" and evaluates if there is a page with this name. If yes, include it with S51 tag. Otherwise, include a default one "reus_assets".

Change contents of a resuable page builder page dynamically.

Comments

Categories