错字3中带有字体的图标的菜单答案

【问题标题】：menu with fontawesome icons in typo3错字3中带有字体的图标的菜单
【发布时间】：2018-05-14 09:22:48
【问题描述】：

我尝试在typo3 8.7.13 中使用fontawesome 图标来实现一个菜单。我的想法是使用字段 tx_fontawesome_icon 扩展表格页面 - 没问题 - 它可以在页面属性中使用，也可以保存在数据库中。

但是如何在打字稿中使用它呢？

[ts]
lib.mainnav_mobile = HMENU
lib.mainnav_mobile {
  wrap = <ul>|</ul>
  1 = TMENU
  1 {
    expAll = 1
    NO = 1
    NO {
      wrapItemAndSub =<li>|</li>
      stdWrap.wrap = <i class="fas fa-home fa-2x"></i>|
      stdWrap.htmlSpecialChars = 1
      ATagTitle.field = title
      ATagParams = class="home-link"
    }
  }
}
[/ts]

谢谢沃尔克

【问题讨论】：

标签： menu typo3 typoscript typo3-8.7.x

【解决方案1】：

我假设您将完整的图标名称存储在该字段中。如果您可能会跳过前缀，请在包装中构建前缀。

您可以尝试使用.stdWrap，所以我更喜欢这个属性：.before

你可以使用这样的东西（填写菜单定义的其余部分）：

    :
    NO {
        :
        before.cObject = TEXT
        before.cObject {
            field = tx_fontawesome_icon
            ## have a default icon: 
            ifEmpty = fa_home
            noTrimWrap = |<i class="fas | fa-2x"></i>|
            # if you want the icon to be linked too:
            typoLink.parameter.field = uid
        }
    }

使用.noTrimWrap，这样您就可以保留图标名称前后的空格。

如果图标应该只在一个链接内，您需要将图标添加到项目文本（页面标题）中。

因此，您在开始时使用.stdWrap.wrap。但您需要从 cObject 构建包装（见上文）或使用数据包装：

:
NO {
    :
    stdWrap.dataWrap = <i class="fas {field:tx_fontawesome} fa-2x"></i>|
    :
}

【讨论】：

非常感谢 - 功能如您所愿。但我犯了一个大错误 - fontawesome 图标应该在 a-tag 内（对代码进行了太多测试，然后复制错误:() cu Volker
答案已编辑：获得链接图标的两种可能性

【解决方案2】：

我的解决方案是：

lib.mainnav_mobile = HMENU
lib.mainnav_mobile {
wrap = <ul>|</ul>

1 = TMENU
1 {
    expAll = 1

    NO = 1
    NO {
        wrapItemAndSub =<li>|</li>

        stdWrap.htmlSpecialChars = 1
        ATagTitle.field = description // subtitle // title
        ATagParams = class="home-link"
        ATagBeforeWrap = 1
        stdWrap.wrap.cObject = TEXT
        stdWrap.wrap.cObject {
            field = tx_fontawesome_icon
        ## have a default icon:
                ifEmpty = fa-home
            noTrimWrap = |<i class="fas | fa-2x"></i>&nbsp;|
        }
    }

感谢您的帮助！沃尔克

【讨论】：