ipublishedcontent how to render image razor - Razor

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

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

Mohammad Javed 64 posts 373 karma points

Mar 16, 2015 @ 16:23

IPublishedContent - How To Render Image (Razor)?

Razor

Hello,

I've written the below code to look up a root node that has child nodes which pulls out banner images with a caption. Now i can get the page name and URL out fine, i'm now having trouble getting the image out.

@inherits Umbraco.Web.Macros.PartialViewMacroPage
<div class="bannersContainer">

    @foreach (var childBanner in Model.Content.Children.Where(c => c.DocumentTypeAlias.Equals("BannersIndex")))
    {        
        <div class="carousel slide" data-ride="carousel" data-pause="false">

            @if (childBanner.Children.Any(x => x.DocumentTypeAlias.Equals("Banner")))
            {
                <div class="carousel-inner">
                    @foreach (var banner in childBanner.Children.Where(p => p.DocumentTypeAlias.Equals("Banner")))
                    {
                        <div class="item">
                            <a href="@banner.Url">@banner.Name</a>
                            <img class="bannerImg" src="@Umbraco.TypedMedia("bannerImage").Url" />
                        </div>
                    }
                </div>
            }
        </div>
    }
</div>

Using @Umbraco.TypedMedia("bannerImage").Url doesn't seem to do the trick.

Any ideas as to what i should be using here?

Copy Link

Dennis Aaen 4499 posts 18254 karma points admin hq c-trib

Mar 16, 2015 @ 16:35

Hi Mohammad,

What if you do something like this does it work then.

@inherits Umbraco.Web.Macros.PartialViewMacroPage
<div class="bannersContainer">

    @foreach (var childBanner in Model.Content.Children.Where(c => c.DocumentTypeAlias.Equals("BannersIndex")))
    {        
        <div class="carousel slide" data-ride="carousel" data-pause="false">

            @if (childBanner.Children.Any(x => x.DocumentTypeAlias.Equals("Banner")))
            {
                <div class="carousel-inner">
                    @foreach (var banner in childBanner.Children.Where(p => p.DocumentTypeAlias.Equals("Banner")))
                    {
                        <div class="item">
                            <a href="@banner.Url">@banner.Name</a>
                            @{
                                if(banner.HasValue("bannerImage")){
                                    var mediaItem = Umbraco.TypedMedia(banner.GetPropertyValue("bannerImage")); 
                                    <img src="@mediaItem.GetPropertyValue("umbracoFile")" alt="@mediaItem.GetPropertyValue("Name")"/>    
                                }   
                            }
                        </div>
                    }
                </div>
            }
        </div>
    }
</div>

Hope this helps,

/Dennis

Copy Link

Jan Skovgaard 11280 posts 23678 karma points MVP 10x admin c-trib

Mar 16, 2015 @ 16:37

0

Hi Mohammad

Have you tried just writing @Umbraco.TypedMedia("bannerImage").umbracoFile

Hope this helps.

/Jan

Copy Link
Mohammad Javed 64 posts 373 karma points

Mar 16, 2015 @ 16:52

0

Hi Dennis,

That worked a treat! Need to remember "GetPropertyValue" it just wouldn't drop in to my head.

Jan, you're solution didnt work, something do with there is no definite .umbracoFile for iPublishedContent

Cheer's guys, just need to now figure why carousel isnt showing the image - ha!

Many Thanks Javed

Copy Link
Jan Skovgaard 11280 posts 23678 karma points MVP 10x admin c-trib

Mar 16, 2015 @ 16:55

1

Hi Javed

Aaah, yes - Was not thinking straight there :)

Good you got it working though.

/Jan

Copy Link
is working on a reply...

Please Sign in or register to post replies