Animated WordPress Title

Animated titles are easy to create with SCL. The above example is the default animation when opening the SCL Editor. It provides three variables at the top that you can change. Two are quite self-explanatory.

var COLORS="unique-bk.jpg"
var POSTTITLE="Title Your Post"
var SPEED=90
  1. POSTTITLE is the text of your title
  2. SPEED is how fast to rotate the background of the title. The speed is calculated as degrees per second. The default is 90 degrees of rotation per second.
  3. COLORS is the name of the image file to use as the background of the text. The post comes with three defaults: The fancy design you see here, and color variations.

Default background included are:

animated title background: purple radial pattern
Radial Background Pattern in Purple
Animated title background: Blotchy rainbow colors
Blotchy rainbow color background tile
Animated title background: Radial Rainbow
Radial Rainbow Background Tile

COLORS is a file name based on the uploaded image on the images tab. Meaning you can upload your own background image, then use its file name for the color variable. For example, you code might look like this:

var COLORS="flowers.png"
var POSTTITLE="Flower Markets of Denver"
var SPEED=180

If you are looking for images to use for your animated title background, try visiting Open Game Art or any of the other free image services you can find through Google.

You can make much more than just animated titles with our plugin. Be sure to check out our guide for interactive animated examples. There you will be able to test out code, try features of SCL, and how you might want to use them to add animations to your posts. Our reference guide will teach you how to add different kinds of movements to your animations, and how to make them interactive.

Leave a Reply

Your email address will not be published. Required fields are marked *