Delay

How to Adjust Delay of Appear Animations in AppSections Brand Style

The "Delay" setting in the Brand Style of AppSections allows you to control the delay before appear animations start. This setting provides flexibility in timing the animations, enhancing the visual sequencing and pacing of your elements. Here is how you can adjust the delay of appear animations:

Delay

Purpose: This setting allows you to define the delay before appear animations start.

Usage: Use the range selector to set the desired delay from 0 seconds to 2 seconds.

Steps to Adjust Delay of Appear Animations

  1. Select the Brand Style:

    • Open your Shopify theme editor.

    • Navigate to the Brand Style settings.

  2. Locate the Delay Setting:

    • In the Brand Style settings, find the Delay option.

  3. Adjust Delay:

    • Use the range selector to set the delay of the appear animations between 0 seconds and 2 seconds. You can adjust in increments of 0.2 seconds.

Delay Range Examples

  • 0s: The appear animation will start immediately.

  • 0.2s: The appear animation will start after a delay of 0.2 seconds.

  • 1.0s: The appear animation will start after a delay of 1 second.

  • 2.0s: The appear animation will start after a delay of 2 seconds.

Ensuring the Right Delay Application

  1. Preview Changes:

    • After adjusting the delay, preview your store to see how the changes look.

    • Check various elements to ensure the animation delay is applied correctly and enhances the visual sequencing.

  2. Check Consistency:

    • Ensure that the delay setting aligns with your brand’s aesthetic and provides a cohesive look across both desktop and mobile devices.

  3. Test Across Devices:

    • Verify the delay setting on different devices to ensure it looks good and maintains functionality on all screen sizes.

Summary

By using the "Delay" setting in the Brand Style of AppSections, you can control the delay before appear animations start in your Shopify store. This flexibility allows you to enhance the visual timing and sequencing of your elements, ensuring a dynamic and engaging user experience across all devices. Adjusting the animation delay helps create a smooth and appealing design consistency.

If you have any questions or need further assistance, please contact our customer support team.

Last updated