Settings in 2sxc

Read Global/Site/App/View Settings using the Settings object

#2 Deep dive into the Settings stack

Use PageService.Activate to enable features, Css and Js

Settings Stack

Settings are stacked in a way that the View-settings have a higher priority than App-settings, which has a higher priority than Site, etc. In rare cases you may want to explicitly check for a setting at a specific place in the stack.

This example has a setting called CustomColor which is set at App and View level. Using GetSource(...) we can access a specific source.

Output

@Settings.CustomColor: #4CAF50CC
@Settings.GetSource("View").CustomColor:
@Settings.GetSource("App").CustomColor:
@Settings.GetSource("Site").CustomColor:
Note: this will be empty, as Site doesn't have this setting)
@Settings.GetSource("Global").CustomColor:
Note: this will be empty, as Site doesn't have this setting)

<ul>
  <li>
    <div style='width: 20px; height: 20px; float: left; background-color: @Settings.CustomColor'></div>
    &nbsp; <code>@@Settings.CustomColor</code>: @Settings.CustomColor 
  </li>
  <li>
    <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("View").CustomColor'></div>
    &nbsp; <code>@@Settings.GetSource("View").CustomColor</code>: @Settings.GetSource("View").CustomColor 
  </li>
  <li>
    <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("App").CustomColor'></div>
    &nbsp; <code>@@Settings.GetSource("App").CustomColor</code>: @Settings.GetSource("App").CustomColor 
  </li>
  <li>
    <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("Site").CustomColor'></div>
    &nbsp; <code>@@Settings.GetSource("Site").CustomColor</code>: @Settings.GetSource("Site").CustomColor <br>
    <em>Note: this will be empty, as Site doesn't have this setting)</em>
  </li>
  <li>
    <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("Global").CustomColor'></div>
    &nbsp; <code>@@Settings.GetSource("Global").CustomColor</code>: @Settings.GetSource("Global").CustomColor <br>
    <em>Note: this will be empty, as Site doesn't have this setting)</em>
  </li>
</ul>

Read Global/Site/App/View Settings using the Settings object

#2 Deep dive into the Settings stack

Use PageService.Activate to enable features, Css and Js

Source Code of this file

Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code

@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
<!-- unimportant stuff, hidden -->

Settings Stack Settings are stacked in a... <!-- unimportant stuff, hidden -->

  <ul>
    <li>
      <div style='width: 20px; height: 20px; float: left; background-color: @Settings.CustomColor'></div>
      &nbsp; <code>@@Settings.CustomColor</code>: @Settings.CustomColor 
    </li>
    <li>
      <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("View").CustomColor'></div>
      &nbsp; <code>@@Settings.GetSource("View").CustomColor</code>: @Settings.GetSource("View").CustomColor 
    </li>
    <li>
      <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("App").CustomColor'></div>
      &nbsp; <code>@@Settings.GetSource("App").CustomColor</code>: @Settings.GetSource("App").CustomColor 
    </li>
    <li>
      <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("Site").CustomColor'></div>
      &nbsp; <code>@@Settings.GetSource("Site").CustomColor</code>: @Settings.GetSource("Site").CustomColor <br>
      <em>Note: this will be empty, as Site doesn't have this setting)</em>
    </li>
    <li>
      <div style='width: 20px; height: 20px; float: left; background-color: @Settings.GetSource("Global").CustomColor'></div>
      &nbsp; <code>@@Settings.GetSource("Global").CustomColor</code>: @Settings.GetSource("Global").CustomColor <br>
      <em>Note: this will be empty, as Site doesn't have this setting)</em>
    </li>
  </ul>