Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Cedeste 37 posts 129 karma points
    Apr 03, 2023 @ 14:10
    Cedeste
    0

    Toggle Content on Front End Pages

    I am trying to build out an alert section that can be toggled on and off for display on the home page.

    It's very possible I have it wrong because I'm still learning. But this is what I've done.

    I created a property called "hide" with a true/false toggle. When I try to add the hide to the code, it breaks the page.

    See code below. 

    @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage
@using Umbraco.Cms.Web.Common.PublishedModels
@using Umbraco.Cms.Web.Common.Views
@using Umbraco.Cms.Core.Models

@{

    if(.hide ?? false) { return; }

}

<div class="container-fluid" >
    <div class="row justify-content-center pelican-UI-light-bk" style="border-bottom: 10px solid #fe9903;  ">

<div class="col-lg-12" style="background-color: #b00003; text-align: center; padding-top: 15px; padding-bottom: 10px;">
    <h3 style="color: #ffffff; font-weight: bold;">@Model.Value("alertMessage")</h3>
</div>

            </div>


</div>

    Any help would be greatly appreciated!

    Copy Link
  • Marc Goodson 2157 posts 14434 karma points MVP 9x c-trib
    Apr 03, 2023 @ 15:30
    Marc Goodson
    100

    Hi Cedeste

    There are different approaches to implementing views, using Published Content or Modelsbuilder, it looks like here you are using 'PublishedContent'...

    ... so I think something like this

    @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage
@using Umbraco.Cms.Web.Common.PublishedModels
@using Umbraco.Cms.Web.Common.Views
@using Umbraco.Cms.Core.Models


@if(Model.Value<bool>("hide") == false){
<div class="container-fluid" >
    <div class="row justify-content-center pelican-UI-light-bk" style="border-bottom: 10px solid #fe9903;  ">

<div class="col-lg-12" style="background-color: #b00003; text-align: center; padding-top: 15px; padding-bottom: 10px;">
    <h3 style="color: #ffffff; font-weight: bold;">@Model.Value("alertMessage")</h3>
</div>

            </div>


</div>
}

    Essentially if your new 'true/value' property has property alias 'hide' then you can read it using the PublishedContent approach by

    @Model.Value<bool>("hide")

    this reads the value from Umbraco and turns it into a 'bool' which is a boolean value of either true or false, and so you can check if it's false, eg not hidden, and therefore ok to write out the HTML...

    regards

    Marc

    Copy Link
  • Cedeste 37 posts 129 karma points
    Apr 03, 2023 @ 15:36
    Cedeste
    0

    THANK YOU! That worked.

    Copy Link

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies