why cant i output fontawesome icon

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

mikkel 143 posts 365 karma points

Jul 22, 2019 @ 19:34

Hi every one. i use umbraco 8 the newest version. I have made a page showing 3 different topics, each with their own icon. I would like to be able to replace the icon if necessary.

I have made the document type with a text string where I can insert the fontawesome icon code <i class="fas fa-desktop"></i>, but when I have to show it in front then nothing comes. What do i do wrong

Heres is my code

var selection3 =   Umbraco.Content(Guid.Parse("99c1f202-0f34-4cca-8bc8-2376752fd158")).Children().Where(x => x.IsVisible()).OrderByDescending(x => x.CreateDate);

     @foreach (var item in selection3)
                {
                    <div class="col-md-4 services-box">
                        <span class="fa-stack fa-4x">

                            <i class="fa @item.Value("fontawesomeIkon").ToString();"></i>
                        </span>
                        <h4 class="service-heading">@item.Name</h4>
                        <p class="text-muted">@Model.Value("serviceTeaser")</p>
                        <a class="btn btn-block btn-laes-mere" href="@item.Url">Læs mere</a>
                    </div>
                }

Copy Link

Amir Khan 1287 posts 2744 karma points

Jul 22, 2019 @ 22:00

0

What's actually being rendered on the front end with that code?

Copy Link
Nigel Wilson 945 posts 2077 karma points

Jul 22, 2019 @ 23:15

0

Hi Mikkel

Further to Amir's good suggestion, have you checked the font awesome font is loading correctly in the page, ie you are calling the CDN, or your local CSS references are correct ?

Cheers

Nigel

Copy Link
Søren Mastrup 122 posts 564 karma points c-trib

Jul 23, 2019 @ 05:02

0

Could it be your closing ; after ToString()?

Since you are outputting, I would assume your class is looking like this: class=“fa fa-desktop;”

Try removing the closing ;

Copy Link
mikkel 143 posts 365 karma points

Jul 23, 2019 @ 05:27

0

I have try to hardcode it in and that works fine. but when I try the other way it doesn't work. I dont have Any problem in umbraco 7 but in umbraco 8 i dont work 😃

Copy Link

mikkel 143 posts 365 karma points

Jul 23, 2019 @ 06:46

I have solved y problem. in the foreach loop i was using @Model.Value("fontawesomeIkon").ToString(); I had to use

@item.FontawesomeIkon  fa-circle fa-stack-2x text-primary

So my foreach loop look like this now. I also had to make a variable myself so I got hold of the other document types var selection4 = Model.FirstChild<MlpWebServices>().Children<Ydelse>();

var selection4 = Model.FirstChild<MlpWebServices>().Children<Ydelse>();
    @foreach (var item in selection4)
            {
                <div class="col-md-4 services-box">
                    <span class="fa-stack fa-4x">

                        <i class="@item.FontawesomeIkon  fa-circle fa-stack-2x text-primary"></i>
                    </span>
                    <h4 class="service-heading">@item.Name</h4>
                    <p class="text-muted">@item.Value("serviceTeaser").ToString();</p>
                    <a class="btn btn-block btn-laes-mere" href="@item.Url">Læs mere</a>
                </div>
            }

Copy Link

is working on a reply...

Please Sign in or register to post replies