SFCore

Node Icons & Animations

StylesFactory

• 2 min read

In this tutorial you will learn how to use "Node Icons & Animations" feature in SFCore for all StylesFactory themes. Here you can change many settings for floating nodes while scrolling, change gradient options for node backgrounds, turn on snow and much more!

  1. You need SFCore plugin to make it work. Here you can learn how to install plugin.
  2. Login to your Admin Control Panel
  3. Go to "SFCore" tab and click "Control Panel" from dropdown menu.
  4. From SFCore - Dashboard panel find Node Icons & Animations Options.
  5. Click on checkbox "Animation effect" to turn on animations. By default it's turned on.
  6. "Animations for category block for nodes" is option which brings you animations for categories while scrolling. By default it's turned on.
  7. "Custom node icons" will turn on/off options to support custom icons. For example:

By default it's turned on.

8. "Animations for nodes" is option which brings you animations for nodes. By default it's turned on. On demo board it's turned off.

Animation while loading on scrolling.

9. "Widget animations" is option that turns on animations for your widgets placed in sidebar and other places in your forum.

Widgets while loading during scrolling

10. "Snow effect" is option great while it's winter (or you just like snow :P). It's turned off by default.

11. "CSS": here you can change settings for node background gradient effect.

On this image you can see gradients on each forum node. By default it's set to: linear-gradient(to bottom,rgba(14,14,14,0.6) 51%, rgba(14,14,14,.95) 100%)

You can change it but remember to use RGBA color scheme.

12. "Icon width" is setting for custom image icons. If you set custom node icon as image you will be able to change it's size by changing this setting. By default it's 50px.

13. "Subforum icon size (img)" works similar to "Icon width". You can change subforum image size if set. By default it's set to 30px.

14. "Subforum icon size (font awesome) changes size of font awesome icon. By default it's 18px. Don't set too big icons because it have impact on responsivness of your theme.

15. "Unread icons colors" is setting when you want to mark unread messages by colored icon. By default it's turned on.

Sign up for more like this.

Enter your email
Subscribe