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!

  • Marc Goodson 2155 posts 14406 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

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

    THANK YOU! That worked.

Please Sign in or register to post replies

Write your reply to:

Draft