This document provides instructions for customizing features on oFeatures.com by adjusting styles like skin, color, shape, layout, font, shadow, and animations. The customization options allow users to match features to their website by choosing skins, colors, shapes, layout positions, fonts, shadows, CSS themes, and animations including fly-in/fade-in effects and easing options. An example screenshot demonstrates customized chat and call back features.

1. How To Adjust Style with
oFeatures
www.oFeatures.com

2. After adding features to your account, they
can be found in the “Features” tab. To
begin customization of a feature click the
settings icon under “Actions”.

3. Here you can
customize the skin
(1), adjust color (2),
reset theme (3),
choose a popular
theme (4). On the
bottom of the page
you can see the
preview of your
feature (5).
1
2
3
4
5

4. You can adjust the shape, layout,
position, width, font and shadow of
your feature.

5. Adjust the colors to
match your website.
Skin and Colors
Choose one of many
skins for your
feature.

6. Choose a shape from over 10 different options (1).
You can also adjust the radius of the borders (2).
Shape
2
1

7. Choose where you would like your feature to
be placed in the “Layout” options (1). You
can adjust the width (2) and position (3).
Layout
1 2 3

8. Font
There is also an option to change
font style (1) and size (2).
1
2

9. Shadow
In this section you can choose one
of the available shadows.

10. Advanced style
customization
In case you would like to customize your feature
even more you can use the option of CSS Theme
Customization (1).
“Randomize Theme” (2) mixes all the options to
create a unique look of a feature.
1
2
1

11. Animations
Animations determine the way a feature appears on your website.
You can set the effect: Fly-in or Fade-in (1).
Edge sets the direction from which the feature will appear (2).
With Fly-in you can choose from a variety of easing options (3).
Add an animation at any time (4).
View the way your feature is animated by clicking Play animation preview (5).
You can disable and reset animations (6).
1 2 3
4
5
6
6

12. Customization
Example
Here is an example of Chat
and Call me back
customized to match a user’
s website.