Outpout fontawesome icons via kirbytext?

Hello dear friends,

i just have a question, i have this section whit some icons from fontawesome

and this is the markup

<ul class="icons-grid">
                                <span class="icon major fa-camera-retro"></span>
                                <h3>Magna Etiam</h3>
                                <span class="icon major fa-pencil"></span>
                                <h3>Lorem Ipsum</h3>
                                <span class="icon major fa-code"></span>
                                <h3>Nulla Tempus</h3>
                                <span class="icon major fa-coffee"></span>
                                <h3>Sed Feugiat</h3>

Do you have any ideas how i can make that editable whit the Panel?.

Have a great day :sunny:

1 Like

You could use a structure field. Each structure item would have a title and icon field. The PHP code would look like this:

<ul class="icons-grid">
    <?php foreach($page->icongrid()->toStructure() as $icon): ?>
        <span class="icon major fa-<?php echo $icon->icon() ?>"></span>
        <h3><?php echo $icon->title() ?></h3>
    <?php endforeach ?>
1 Like

Okay thanks a lot for this information, and the icon field how exactly should look?. i have the icon field already installed

Do you mean this icon field? There’s an example blueprint in the repo. :slight_smile:
You could use a simple text field as well, it just won’t have a preview in the Panel. Works just the same though.

okay i will take a look at it, but i have this example field:

    label: Social Icons
    type: structure
    style: items
    modalsize: medium
        label: Icon
        type: icon
        placeholder: heart-o
        label: Icon Text
        type: text
        icon: font

can i use this example?