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


  • Rob 27 posts 129 karma points
    Jan 17, 2019 @ 20:44
    Rob
    0

    How to show an image from blog post in list view on blog page?

    Templates, (partial) views and macros
    Umbraco 7

    Hi guys,

    I am new to Umbraco so please excuse if this might be a bit of a silly question.

    I built a website containing a blog page using the Umbraco Starter Kit.

    I have some blog posts added which contain an image that I would like to be displayed on the blog page's list view and on the home page in the recent blog posts area.

    Now I am struggling to achieve this and could not find any article or thread that might guide the way.

    Could somebody assist me to achieve what I am looking for?

    Best regards

    Robert

    Copy Link
  • Bryna 73 posts 259 karma points
    Jan 17, 2019 @ 22:55
    Bryna
    0

    I think if you look at the Person Document Type in the sample site, you'll see that it uses a mediapicker. If you look at the template for people, that will give you the code block to display the photo:

    @person.Photo.Url

    If you instead use an tag in the template that you make(or adjust the Blog template), does that get you close to what you are looking for?

    Copy Link
  • Rob 27 posts 129 karma points
    Jan 18, 2019 @ 20:52
    Rob
    0

    Hi Bryna,

    Thanks a lot for the answer though.

    Struggling to work out where and how to place the code, and even what the code would need to look like as I am not a developer but a newbie to Umbraco and coding.

    Copy Link
  • Rob 27 posts 129 karma points
    Jan 21, 2019 @ 20:06
    Rob
    101

    Okay, so I found a way to achieve this now by simply add the following code to the LatestBlogposts.cshtml under Partial View Macro Files:

    @if(post.FeaturedImage != null){

    @post.PageTitle
    }

    Copy Link
  • Alex 8 posts 88 karma points
    Apr 03, 2019 @ 21:41
    Alex
    0

    Hi Rob,

    Struggling with this now myself, did you add a media picker to the blogpost doc type called 'FeaturedImage' and you're just referencing it with

    @post.FeaturedImage.Url

    Is there any steps I'm missing here?

    Copy Link
  • Rob 27 posts 129 karma points
    Apr 04, 2019 @ 07:35
    Rob
    1

    Hi Alex,

    Actually I am now using this piece of code on a partial view macro

     @if(post.FeaturedImage != null){
                <div class="blogpost-image">
                    <img class="img-responsive" src="@post.FeaturedImage.Url?width=200" alt="@post.PageTitle" style="width: 100%; height: 100%;"/>
                </div>
                }

    That works perfectly for me

    Copy Link
  • Alex 8 posts 88 karma points
    Apr 04, 2019 @ 11:45
    Alex
    0

    Thanks Rob!, Will have a play with it - couldn't get it working last night

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft