Text Waves

https://www.muse-themes.com/products/text-waves

Text Waves displays custom messages in animated waves on your site. Animations are controlled by scroll position, making the messages interactive for your site visitors.

Eight SVG paths and extensive customization options give you full control over the presentation of your animated text messages. Great for grabbing attention on static sites!

  • Widget Compatibility: Highly Compatible (No known issues when combining with other MuseThemes widgets)
  • Current Version: 1.0
  • Supported Devices: Desktop, Tablet, Phone

Release Log

  • 1.0: Initial release




Setup in Muse

Note: This widget is not suitable for every site. It should be used on long pages such as one-page sites.

  • Place the widget on your site where you would like the animated text to appear.

  • The widget requires scrolling down the page in order to animate properly. Keep two things in mind when placing the widget on your page:

    • Don't place near the top of the page: The widget is triggered by scroll position. A certain margin from the top of the page is required for the animation to work properly. Placing the widget near the top of the page may result in the text appearing too quickly.
    • Used the widget on long pages: Similar to the above point, the widget should not be placed too closely to the bottom of the page. Placing the widget near the bottom of the pahe may cause the text to not finish animating as expected.
  • Stretch to browser width: In most cases, the widget should be used at 100% width. This will allow text to transition on and off the page properly. Use the "Stretch to browser width" option in the Resize menu.
  • Size the widget container: Sizing the widget container is important. If the widget height is set too narrow, the text may be clipped. The default height of the widget when you drop it on the page should work well.

WIDGET OPTIONS

  • SVG Path: There are 8 options for SVG path. These options allow the text to travel along a different "wave" path.
  • Text on Path: This is the text that appears in the message.
  • Font Color: The color of the text message.
  • Font Family: The font family of the text message.
  • Font Size: The font size of the text message.

ADVANCED SETTINGS:

These settings are provided if you would like to adjust the animation trigger position, or to deal with clipping. These occurrences are unlikely in standard usage; so we advise not to change the settings in this section. The default settings are optimized for typical usage.

  • Scroll Position Offset: Adjusts the position of entry for the text waves. Higher values allow the text to begin animating higher on the page.
  • Overflow Hidden: Prevents widget content from being visible outside of the widget boundries.
  • Limit SVG Height: Enables the svg height limit which can be used to adjust the generated graphics sizing inside of the widget container
  • SVG Height Limit: Percentage of the widget height the generated svg graphics can utilize.

Commonly Asked Questions

No commonly asked questions


Known Issues/Conflicts

No known issues or conflicts


Additional Info Links