Adding CSS animation to WP

  • nomadbynature

    (@nomadbynature)


    6 years, 4 months ago

    Hi,
    I’m new to css animations, but i’ve created one for my webpage (wrote it in a text editor). Basically, the whole animation are squares floating at the background.

    I want to apply this animated background to one of my pages, but I don’t know where to start. Where should I paste the html and css components? And how to target only this one page?

    I am using Gutenberg with Malina theme. Is there an option to add html & css for my animation without using additional plug-ins?

    Thank you

    • This topic was modified 6 years, 4 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Everything else WordPress topic
Viewing 3 replies - 1 through 3 (of 3 total)
  • Joy

    (@joyously)

    6 years, 4 months ago

    Put the HTML into a HTML block, with unique enough classes so your CSS affects only that.
    Put your CSS into the Customizer > Additional CSS.

    Thread Starter nomadbynature

    (@nomadbynature)

    6 years, 4 months ago

    Thank you for your reply @joyously
    I tried doing that, but even though my classes are unique the css effected all the pages…I later added the page id and that helped, but the css wasn’t rendering correctly.

    Should I add the body tag in the html block when I’m adding my own html or skip it?

    At least I know html block + adding css in the customizer is the right way to go. Thank you!

    Joy

    (@joyously)

    6 years, 4 months ago

    No, your content should not contain a body tag. The theme outputs that.

    If your class is unique then your CSS must be targeting something less specific if it affects all pages.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Adding CSS animation to WP’ is closed to new replies.