Element’s general settings

In general, every element is unique and has its own settings. However, there are 3 groups of parameters that every element has. They all are configured in the “General” tab in the element’s inspector. In this article, you will learn about these common parameters of the Element’s general settings.

Attributes

You can set a custom value for several native attributes of the element HTML code so that you can later use it in custom CSS/JS code. Supported attributes are as follows:

  • ID
  • Class
  • Name

Besides native attributes, you can define custom attributes for more advanced customization.

Visibility

This parameter of the Element’s general settings is useful for you if you want to hide elements in different devices.

You can choose to hide the element on specific devices:

  • Hide On Desktop
  • Hide On Laptop
  • Hide On Tablet
  • Hide On Mobile

For example with the image below, if you choose the Hide On Mobile option, then this image will be displayed on Desktop, Laptop, and Tablet, but not on Mobile.

This video will let you know more about how to use this “Hide” function across different devices

Animation

There are 2 cases when you can add an animation to the elements to spice up your page.

  • When Display
    Choose the animation to apply to the element when a visitor sees it for the first time.
  • When Mouse Over
    Choose the animation to apply to the element when a visitor moves the mouse over it.

Each case gives you many animation choices.

Element general settings

If you want to remove the animation, you just need to delete the animation like the gif below

Was this helpful?

Try out all PageFly features with Free plan

.myshopify.com
Don’t have Shopify store yet? Create store
×