带有图标

Question

您好我想设计带图标的链接按钮。当我点击链接按钮或图标时，它将导航到网址。为此，我使用了以下代码。它给了我链接旁边的图标链接。我想要的是第一个图标，然后是那个链接按钮

@Html.Sitecore().BeginField("ReturnLink", new { @class = "link-arrow" })
<i class="icon">
  @Html.Sitecore().Field("ReturnLinkIcon")
</i>
@Html.Sitecore().EndField()

<a class="link-arrow" href="www.google.com">Back To Internet
                <i class="icon">
                    <img src="xxx.jpg">
                </i>
                </a>

请先帮我看看如何显示图标，然后点击下图标旁边的链接

Answer 1

控制链接呈现的一种方法是构建HTML self。为此，您必须获取LinkField的URL和文本。

请参阅https://briancaos.wordpress.com/2012/08/24/sitecore-links-with-linkmanager-and-mediamanager/

Razor中的示例

@using Sitecore.Data.Fields
@using Sitecore.Data.Items

@functions { 
public static string GetLinkUrl( Item item, string fieldName)
        {
        var linkField = (LinkField) item.Fields[fieldName];
            if (linkField == null)
            {
                return string.Empty;
            }
            switch (linkField.LinkType.ToLower())
            {
                case "internal":
                    // Use LinkMananger for internal links, if link is not empty
                    return linkField.TargetItem != null ? Sitecore.Links.LinkManager.GetItemUrl(linkField.TargetItem) : string.Empty;
                case "media":
                    // Use MediaManager for media links, if link is not empty
                    return linkField.TargetItem != null
                               ? Sitecore.Resources.Media.MediaManager.GetMediaUrl(linkField.TargetItem)
                               : string.Empty;
                case "external":
                    // Just return external links
                    return linkField.Url;
                case "anchor":
                    // Prefix anchor link with # if link if not empty
                    return !string.IsNullOrEmpty(linkField.Anchor) ? "#" + linkField.Anchor : string.Empty;
                case "mailto":
                    // Just return mailto link
                    return linkField.Url;
                case "javascript":
                    // Just return javascript
                    return linkField.Url;
                default:
                    // Just please the compiler, this
                    // condition will never be met
                    return linkField.Url;
            }
        }

}

@{
    LinkField linkfield = Sitecore.Context.Item.Fields["ReturnLink"];
}

<a href="@GetLinkUrl(Sitecore.Context.Item, "ReturnLink")">
    <i class="icon">
      @Html.Sitecore().Field("ReturnLinkIcon")
    </i>
    @linkfield.Text
</a>

当然，您可以更好地将函数放在辅助类中或在控制器中执行操作。