how to add custom alt text to the post image

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

Joshua Brown 13 posts 93 karma points

Jun 21, 2016 @ 20:01
0

How to add custom alt text to the Post Image
I edited the Articulate Post document type and added a textbox to the Image tab called "Alt Text". Then, in the Post.cshtml view, I tried changing the alt text to:
```
<img class="postImage img-responsive" alt="@Model.altText" src="@cropUrl" />
```
and I got a compiler error:
```
Compiler Error Message: CS1061: 'Articulate.Models.PostModel' does not contain a definition for 'altText' and no extension method 'altText' accepting a first argument of type 'Articulate.Models.PostModel' could be found (are you missing a using directive or an assembly reference?)
```
My digital marketing team really wants the option to add custom alt text to these images and I've already used the Image tab for over 100 blog articles. Changing them to images inside the Rich Text Editor would be an onerous task. How can I add this custom alt text?
Copy Link
Michaël Vanbrabandt 863 posts 3348 karma points c-trib

Jun 21, 2016 @ 20:05

0

Hi Joshua,

try using the following:

@Model.GetPropertyValue("altText")

/Michael

Copy Link

Joshua Brown 13 posts 93 karma points

Jun 21, 2016 @ 20:08

Compiler Error Message: CS0122: 'Umbraco.Core.Models.PublishedContent.PublishedContentWrapped.Content' is inaccessible due to its protection level

Copy Link

Michaël Vanbrabandt 863 posts 3348 karma points c-trib

Jun 21, 2016 @ 20:12

0

Hi Joshua,

can you post the entire Post.cshtml view?

/Michael

Copy Link

Joshua Brown 13 posts 93 karma points

Jun 21, 2016 @ 20:13

@using Articulate
@using Umbraco.Core
@model Articulate.Models.PostModel
@{
    Layout = "Master.cshtml";
    ViewBag.CssBodyClass = "post-template";
}

<article class="post">

    <div class="row">
        <div class="col-xs-12 col-sm-4">
            @if (!Model.PostImageUrl.IsNullOrWhiteSpace())
            {
            var cropUrl = Model.GetCropUrl("postImage", "full");
            if (!cropUrl.IsNullOrWhiteSpace())
            {
            <img class="postImage img-responsive" alt='@Model.Content.getPropertyValue("altText")' src="@cropUrl" />
            }
            }
        </div>
        <div class="col-xs-12 col-sm-7 col-md-5">
            <header>
                <h2 class="highlight-left">@Model.Name</h2>
                <div class="post-meta">
                    <time datetime="@Model.PublishedDate.ToString(" yyyy-MM-dd")">
                        @Model.PublishedDate.ToString("dddd, MMMM dd, yyyy")
                    </time> /
                    @if (!Model.Author.Name.IsNullOrWhiteSpace())
                    {
                        <span class="post-author">By @Model.Author.Name</span>
                    }
                </div>
                @Html.ThemedPartial(Model, "PostTags")
            </header>
            <section class="post-content">
                @Model.Body
            </section>
        </div>
    </div>
</article>

Copy Link

Shannon Deminick 1526 posts 5272 karma points MVP 3x

Jun 22, 2016 @ 09:19

101

Use: @Model.GetPropertyValue("altText")

Your view has this: @model Articulate.Models.PostModel which means that the Model of your page == Articulate.Models.PostModel which in turn implements IPublishedContent, so you can use all of the features of IPublishedContent based on your Model such as @Model.GetPropertyValue("altText")

You cannot just do @Model.altText because Model == Articulate.Models.PostModel, it has no property called altText. Articulate uses strongly typed views so dynamics are not supported.

(btw, we are dropping dynamics support in v8)

Copy Link
Biagio Paruolo 1618 posts 1910 karma points c-trib

Feb 26, 2018 @ 08:34

0

dropping dynamics support in v8: good so we'll have a one mode to access data.

Copy Link
Syed 4 posts 73 karma points

Jan 04, 2020 @ 14:00

0

How can we access custom variables in V8?

Copy Link
Joshua Brown 13 posts 93 karma points

Jun 22, 2016 @ 12:32

0

Perfect! Thanks!

Copy Link

Biagio Paruolo 1618 posts 1910 karma points c-trib

Feb 26, 2018 @ 08:33

Good!

Example:

From

 var typedMultiMediaPicker = Model.Content.GetPropertyValue<IEnumerable<IPublishedContent>>("caseStudyImages");

var typedMultiMediaPicker = Model.GetPropertyValue<IEnumerable<IPublishedContent>>("documents");

Copy Link

is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?