Sign in Register
Go to solution
Copied to clipboard

Flag this post as spam?

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


  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 15:45
    TaoistTotty
    0

    Inline Image

    Using Umbraco 7

    I am using the code below to try and insert some inline styling to a div, but it keeps failing saying a } is missing.

    What am I doing wrong?

     

    <div
@{
if(CurrentPage.HasValue("topImage"))
{
var dynamicMediaItem = Umbraco.Media(CurrentPage.topImage);
style="url(@dynamicMediaItem.Url) no-repeat scroll 100% 0 rgba(0, 0, 0, 0)"
}
}
>
    Copy Link
  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 15:48
    TaoistTotty
    0

    I should mention I am using Umbraco 7.1.4

    Copy Link
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Jul 29, 2014 @ 15:48
    Jeavon Leopold
    0

    How about this:

    @{
    if (CurrentPage.HasValue("topImage"))
    {
        var dynamicMediaItem = Umbraco.Media(CurrentPage.topImage);
        var myStyle = "url(" + dynamicMediaItem.Url + ") no-repeat scroll 100% 0 rgba(0, 0, 0, 0)";

        <div style="@myStyle"></div>
    }
}
    Copy Link
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Jul 29, 2014 @ 15:51
    Jeavon Leopold
    0

    Or even better with a null check on the media item:

    @{
    if (CurrentPage.HasValue("topImage"))
    {
        var dynamicMediaItem = Umbraco.Media(CurrentPage.topImage);

        var myStyle = dynamicMediaItem != null ? "url(" + dynamicMediaItem.Url + ") no-repeat scroll 100% 0 rgba(0, 0, 0, 0)" : null;

        <div style="@myStyle"></div>
    }
}
    Copy Link
  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 16:06
    TaoistTotty
    0

    Hi Jeavon

    I have just tried the first one and am seeing the following error:

    Line 19:     <body>
Line 20:        <div id="main">
Line 21: @{ Line 22:     if (CurrentPage.HasValue("topImage"))
Line 23:     {
    Copy Link
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Jul 29, 2014 @ 16:07
    Jeavon Leopold
    1

    Could you please post your entire script?

    Copy Link
  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 16:07
    TaoistTotty
    0

    I am seeing the same error with the second one as well

    Copy Link
  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 16:10
    TaoistTotty
    0 
    @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
    Layout = null;
}
<!DOCTYPE html>
<html>

    <head lang="en">
        <meta charset="utf-8">
        <link rel="stylesheet" href="/css/mycss.css">
        <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
        <meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0">
        <script src="/scripts/responsive-nav.js"></script>
        @Umbraco.Field("description", insertBefore: "&lt;meta name=&quot;description&quot; content=&quot;", insertAfter: "&quot;&gt;")
        <title>
            @Umbraco.Field("pageTitle", altText: "My Page")
        </title>
    </head>
    <body>
        <div id="main">
            @{
    if (CurrentPage.HasValue("topImage"))
    {
        var dynamicMediaItems = Umbraco.Media(CurrentPage.topImage);

        var myStyle = dynamicMediaItems != null ? "url(" + dynamicMediaItems.Url + ") no-repeat scroll 100% 0 rgba(0, 0, 0, 0)" : null;

        <header style="@myStyle">
    }
}
                <h1>
                    Name
                </h1>
                @Umbraco.Field("topImageText", insertBefore: "&lt;p&gt;", insertAfter: "&lt;/p&gt;")
                <nav>
                    @Umbraco.RenderMacro("Menu")
                </nav>
            </header>
            <div id="maincontent">
                <section>
                    @Umbraco.Field("pageText")
                </section>
                @{
                    if(CurrentPage.HasValue("rightImage"))
                    {
                        var dynamicMediaItem = Umbraco.Media(CurrentPage.rightImage);
                        <img src="@dynamicMediaItem.Url" alt="@CurrentPage.rightImageDescription" />
                    }
                }
            </div>
            <footer>
                <p>
                    Copyright 2014. Designed and built by DGS Design
                </p>
            </footer>
        </div>
        <script>
            var navigation = responsiveNav("header nav")
        </script>
    </body>
 </html>
    Copy Link
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Jul 29, 2014 @ 16:13
    Jeavon Leopold
    100

    Ok, a small nesting issue, try this:

    @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
    Layout = null;
}
<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="utf-8">
    <link rel="stylesheet" href="/css/mycss.css">
    <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
    <meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0">
    <script src="/scripts/responsive-nav.js"></script>
    @Umbraco.Field("description", insertBefore: "&lt;meta name=&quot;description&quot; content=&quot;", insertAfter: "&quot;&gt;")
    <title>
        @Umbraco.Field("pageTitle", altText: "My Page")
    </title>
</head>
<body>
    <div id="main">
        @{
            if (CurrentPage.HasValue("topImage"))
            {
                var dynamicMediaItems = Umbraco.Media(CurrentPage.topImage);

                var myStyle = dynamicMediaItems != null ? "url(" + dynamicMediaItems.Url + ") no-repeat scroll 100% 0 rgba(0, 0, 0, 0)" : null;

                <header style="@myStyle">
                    <h1>
                        Name
                    </h1>
                    @Umbraco.Field("topImageText", insertBefore: "&lt;p&gt;", insertAfter: "&lt;/p&gt;")
                    <nav>
                        @Umbraco.RenderMacro("Menu")
                    </nav>
                </header>
            }
        }
            <div id="maincontent">
                <section>
                    @Umbraco.Field("pageText")
                </section>
                @{
                    if(CurrentPage.HasValue("rightImage"))
                    {
                        var dynamicMediaItem = Umbraco.Media(CurrentPage.rightImage);
                        <img src="@dynamicMediaItem.Url" alt="@CurrentPage.rightImageDescription" />
                    }
                }
            </div>
            <footer>
                <p>
                    Copyright 2014. Designed and built by DGS Design
                </p>
            </footer>
        </div>
            <script>
            var navigation = responsiveNav("header nav")
            </script>
        </body>
        </html>
    Copy Link
  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 16:20
    TaoistTotty
    0

    Thank you very much for this and it is now working. I can also, I think, see why it was not working. It was because I did not have the whole of the HTML header tag within the code black. Is this right?

    Copy Link
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Jul 29, 2014 @ 16:21
    Jeavon Leopold
    1

    Yes exactly, Razor code blocks must be complete, so you needed the whole of the header element within the block

    Copy Link
  • TaoistTotty 246 posts 314 karma points
    Jul 29, 2014 @ 16:22
    TaoistTotty
    0

    Thanks Jeavon, and that is a good lesson learnt there

    Copy Link
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Jul 29, 2014 @ 16:25
    Jeavon Leopold
    1

    You're very welcome!

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft