Skip to main content

Settings

The ReadSonic module offers a variety of settings to customize the appearance of the component on your site. This guide will walk you through the available options.

icon​

Type: "play" | "headphones"

There are two options to choose from:

  • Headphones Icon
  • Play Icon

The Play icon is the default option.

badge​

Type: boolean

You have the option to display a text in a badge before the icon. When enabled, the text and the icon will be displayed side by side inside the badge.

true on by default.

text​

Type: string

If the badge is enabled, you can customize the text that will be displayed in it. The default text is "Listen".

color​

Type: string

If the badge is enabled, you can customize the color of the badge. The default color is #efefef.

badgeClasses​

Type: string

If the badge is enabled, you can add custom classes to the badge.

textClasses​

Type: string

If the badge is enabled, you can add custom classes to the text.

iconClasses​

Type: string

Finally, if the badge is enabled, you can add custom classes to the icon.

And that's it! When you are done customizing the settings, save the code to apply the changes. The ReadSonic button should now be displayed on the site according to your preferences.