TYPO3 8.7.13中如何通过Typoscript调用自定义字段实现FontAwesome图标菜单

Hey Volker, nice work getting that custom page field set up and saving values to the database—half the battle is already done! Let's tweak your TypoScript to pull in that tx_fontawesome_icon value dynamically instead of using the fixed fa-home class.

Basic Implementation (Show Icon for All Pages with a Value) #

The key here is using TYPO3's insertData flag to parse the field value inside your wrap. Update your NO section like this:

lib.mainnav_mobile = HMENU
lib.mainnav_mobile {
 wrap = <ul>|</ul>
 1 = TMENU
 1 {
  expAll = 1
  NO = 1
  NO {
   wrapItemAndSub = <li>|</li>
   # Replace fixed icon class with dynamic field value
   stdWrap.wrap = <i class="fas {field:tx_fontawesome_icon} fa-2x"></i>|
   # Tell TYPO3 to parse the {field:...} placeholder
   stdWrap.insertData = 1
   stdWrap.htmlSpecialChars = 1
   ATagTitle.field = title
   ATagParams = class="home-link"
  }
 }
}

Handle Empty Icon Values (Cleaner Output) #

If some pages don't have an icon set, the above code will output <i class="fas fa-2x"></i> (with an extra space). To avoid that, use a COA (Content Object Array) to conditionally render the icon only when the field has a value:

lib.mainnav_mobile = HMENU
lib.mainnav_mobile {
 wrap = <ul>|</ul>
 1 = TMENU
 1 {
  expAll = 1
  NO = 1
  NO {
   wrapItemAndSub = <li>|</li>
   stdWrap.cObject = COA
   stdWrap.cObject {
    # Render icon only if tx_fontawesome_icon is not empty
    10 = TEXT
    10 {
     value = <i class="fas {field:tx_fontawesome_icon} fa-2x"></i>
     insertData = 1
     if.isTrue.field = tx_fontawesome_icon
    }
    # Render page title (always)
    20 = TEXT
    20 {
     field = title
     htmlSpecialChars = 1
    }
   }
   ATagTitle.field = title
   ATagParams = class="home-link"
  }
 }
}

Quick Notes: #

• Double-check that your field name matches exactly (tx_fontawesome_icon)—typos here are a common gotcha!
• The insertData = 1 line is critical: it tells TYPO3 to replace {field:tx_fontawesome_icon} with the actual value from the pages table for each menu item.

That should get your Font Awesome icons showing up dynamically based on the page property you set!

内容的提问来源于stack exchange，提问作者Pavenstaedter