One Page Demo Icons

Archive
1

Hello, I cant seem to determine this from the docs. Where are the icon images being called from on the features page

2

Have a look at my comments in this post:

Basically the image are being set in the yaml frontmatter of the features.md modular page. Let me know if you need more details :slight_smile:

3

somethings not clicking here I still cant seem to follow them to the end. Are you talking about user hemes\antimatter emplates\modular?

4

I guess you’re talking about the icons from awesome font? Check the Font folder, it is where the font is installed. Or go directly to the awesome font page to look at the available choice and labels.
http://fortawesome.github.io/Font-Awesome/icons/

5

Yes the antimatter theme loads the font awesome font and those font icons are referenced via the yaml in the page header. Then they are output in the appropriate <i> tag via the twig template.

6

ah ok makes much more sense now, thanks!

7

Would it be possible, to use images instead of icons here? I tried to replace the icon: with image: but that didn`t help.

8

You could but you would also have to tweak the twig file to reference the image correctly. Currently its just inserting the name of the icon in an appropriate <i> tag. Obviously this would have to be changed to an <img> tag for images.

9

Hello, this is how I did it:

  1. uploaded the images to the (new) folder: /grav/user/images/features/

  2. added the image condition within antimatter/templates/features.html.twig

{% if feature.image %}
<img src="/grav/user/images/features/{{ feature.image }}">
{% endif %}
  1. replaced all the “icon” text with “image” within features.md:
...
    - header: Markdown Syntax
      image: text-height.png
    - header: Twig Templating
      image: code.png
...
---