For those who do visit my blog, you must have observed or seen the unique style I gave to my Emporio Blogger Theme. Whenever you're scrolling to the button of any post, you will see how I made my Page Header Title animate thus, making my blog unique from others.
Although I never wanted to share this tutorial because, (as I have always said) "this is one of the features that make's my Emporio Blogger Theme different thus, making it unique from others" but since we're human, sometimes we have to let go some things in other not to let them bother you. So on this post, I will be showing How To Add Animating Page Header Title.
Step 2: Select Theme.
Step 3: After Selecting, Customize Tab will Open >> Click on Advanced >> CSS.
Step 4: Now copy the code below and paste it there.
Although I never wanted to share this tutorial because, (as I have always said) "this is one of the features that make's my Emporio Blogger Theme different thus, making it unique from others" but since we're human, sometimes we have to let go some things in other not to let them bother you. So on this post, I will be showing How To Add Animating Page Header Title.
Watch the demo video below to see what I meant
⇣
Steps on How To Add Animating Page Header Tittle in Emporio Blogger Theme
Step 1: Go to Blogger Account >> Blogger Dashboard.Step 2: Select Theme.
Code:
@-webkit-keyframes typing { from { width: 0; } }
@-webkit-keyframes blink-caret { 50% { border-color: transparent; } }
h1 {
font: bold 300% Consolas, Monaco, monospace;
border-right: .1em solid black;
width: 16.5em;
width: 21ch;
margin: 2em 1em;
white-space: nowrap;
overflow: hidden;
-webkit-animation: typing 2s steps(21, end),
blink-caret .5s step-end infinite alternate;
}
Step 5: Click on Appy to Blog.
N.B: After pasting the CSS Code always hit enter key at the end of the code before applying to blog, Always reload your blogs home page to see the result. Cheers Hope This works!
N.B: After pasting the CSS Code always hit enter key at the end of the code before applying to blog, Always reload your blogs home page to see the result. Cheers Hope This works!