https://discord.umbraco.com logo
Join Discord
Powered by
Home page displaying blank all of a sudden
# help-with-umbraco
a
Hi, my home page is displaying blank all of a sudden after having made no changes to anything. I've turned off all google chrome extensions, tried different browsers and also tried republishing the site, any ideas? https://cdn.discordapp.com/attachments/1203708033562058823/1203708033767710790/image.png?ex=65d21377&is=65bf9e77&hm=2d642bca276bc5a537543baae8a06b0b800290c4f5d98a34463beca43e5c6e24&
Copy code
html
@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage
@{
    Layout = null;
}
<!DOCTYPE html>
<html lang="en">
@* <header>
    <script src="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.js
"></script>
    <link href="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.css
" rel="stylesheet">
</header> *@
<head>

</head>
<body>

    @RenderBody()

</body>
<footer>
    @RenderSection("BhajanViewScripts", required: false);
    <script src="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.js
"></script>
    <link href="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.css
" rel="stylesheet">
    <script>
        const swiper = new Swiper('.swiper', {
            // Optional parameters
            direction: 'horizontal',
            loop: true,
            slidesPerView: 5,

            // If we need pagination
            pagination: {
                el: '.swiper-pagination',
            },

            // Navigation arrows
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },

            // And if we need scrollbar
            scrollbar: {
                el: '.swiper-scrollbar',
            },
        });
    </script>
</footer>
</html>
this is the master.cshtml
and here is the home.cshtml
Copy code
html

@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.Home>
@using ContentModels = Umbraco.Cms.Web.Common.PublishedModels;
@using Umbraco.Cms.Core.Services;
@using Umbraco.Cms.Core.Models;
@inject IUserService UserService;

@{
    Layout = "Master.cshtml";
    var home = (Home)Model.Root();
    var bhajans = Model.Children<Bhajan>();
}

<h1>@home.Header</h1>

@Html.GetBlockListHtml(Model.BodyText)

@foreach(Bhajan bhajan in bhajans){
    //var artist = umbraco.BusinessLogic.User.GetUser(bhajan.Artist);

    var deityImageUrl = ((Umbraco.Cms.Web.Common.PublishedModels.Deity)bhajan.Deity).DeityAvatarImage?.Url();

    <div style="outline-style: dotted; height: 300px; width: 300px; background-size: cover;background-image: url('@deityImageUrl'); display: inline-block; border-radius: 50%; padding-left: 5px; padding-right: 5px;">
        <a href="@bhajan.Url()" >Link </a>
        <p><h3><b>@bhajan.BhajanTitle</b></h3></p>
   </div>
}
r
You'll want all the content to go within the 
<body>
tag, including the header and footer but not the head. I'm not sure why the home content wouldn't be displaying, though
The body tag contains all the content for the browser to render, so any html content outside of that will be ignored. The head tag contains all the metadata for the browser like the title, styles, and scripts, which is why it goes outside the body tag.
a
I see, thanks, I will try that and let you know how it goes!
here is my new home page
Copy code
html
@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.Home>
@using ContentModels = Umbraco.Cms.Web.Common.PublishedModels;
@using Umbraco.Cms.Core.Services;
@using Umbraco.Cms.Core.Models;
@inject IUserService UserService;

@{
    Layout = "Master.cshtml";
    var home = (Home)Model.Root();
    var bhajans = Model.Children<Bhajan>();
}
<header>
    <script src="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.js
"></script>
    <link href="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.css
" rel="stylesheet">
</header>
<h1>@home.Header</h1>

    <div style="outline-style: dotted; height: 300px; width: 300px; background-size: cover;background-image: url('@deityImageUrl'); display: inline-block; border-radius: 50%; padding-left: 5px; padding-right: 5px;">
        <a href="@bhajan.Url()">Link </a>
        <p><h3><b>@bhajan.BhajanTitle</b></h3></p>
    </div>
}

<footer>
    @RenderSection("BhajanViewScripts", required: false);
    <script src="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.js
"></script>
    <link href="
https://cdn.jsdelivr.net/npm/swiper@11.0.5/swiper-bundle.min.css
" rel="stylesheet">
    <script>
        const swiper = new Swiper('.swiper', {
            // Optional parameters
            direction: 'horizontal',
            loop: true,
            slidesPerView: 5,

            // If we need pagination
            pagination: {
                el: '.swiper-pagination',
            },

            // Navigation arrows
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },

            // And if we need scrollbar
            scrollbar: {
                el: '.swiper-scrollbar',
            },
        });
    </script>
</footer>
and here is my master
Copy code
html
@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage
@{
    Layout = null;
}
<!DOCTYPE html>
<html lang="en">

<head>

</head>
<body>

    @RenderBody()

</body>

</html>
still displaying a blank page on my home page
r
Hi is it showing all the other template code...
as in from the master..
I'd also try simplifying it and making sure its connected up properly..
Copy code
@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.Home>


@{
    Layout = "Master.cshtml";
 
}

<h1>Hello</h1>
and ou can add in sequesntially.. ie check what you have in the model.. if the model is null etc
18 Views
PreviousNext
Powered by