Hello viewers, so today's topic is installing Blinking Table Of Content in Median Ui 1.5 and Median Ui 1.6.
Usually median ui template come with basic median ui table of content and it doesn't have any Blinking effect on it.
Actually, this method can be installed on any median ui or jago theme, only you have to be aware of the table of icon contents icons and it class must be same variable and colour same to work. So read the full post and don't skip any part.
Installing Blink Effect on Table of Content for Median Ui 1.6
Step 2 :- Now go to
themes sections and click on edit html.Step 3 :- Copy the below
CSS code and paste it before or above this code /*]]>*/</style> .tocC:before{content:'';display:block;width:12px;height:12px;background-color:var(--linkC);border:2px solid var(--bodyB);border-radius:50%;position:absolute;top:5px;left:12px;animation:indicator 1s ease infinite;-webkit-animation:indicator 1s ease infinite;z-index:1}@-webkit-keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}@keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
save theme.Blink Effect for Median Ui 1.5
Again you have to repeat the same methods as above given.
Log in to your blogger account and after that go to themes section and then click on edit html. Copy the below given CSS codes and place it above the code /*]]>*/</b:skin> . Find this /*]]>*/</b:skin> code in theme.
Blogger>themes>edit html>paste the code>save
.Blog .post-tocContainer .show:before{content:unset;display:block;position:absolute;width:10px;left:13px;border-radius:50px;top:7px;height:10px;background:#555;webkit-animation:indicator 1s ease infinite;-moz-animation:indicator 1s ease infinite;animation:indicator 1s ease infinite}
@-webkit-keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@-moz-keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.tableOfIcon:before {
content: '';
display: block;
width: 12px;
height: 12px;
background-color: var(--link-color);
border: 2px solid var(--content-bg);
border-radius: 50%;
position: absolute;
top: 8px;
left: 15px;
animation: indicator 1s ease infinite;
-webkit-animation: indicator 1s ease infinite;
}
After completing the above steps, don't forget to save the theme.
After that go and check the web for updated Table of Content in your site.
Conclusion
So I hope after following the above steps. You can now successfully installed the blink effect of table of content on median ui 1.5 and 1.6. That's all for today. If you have any regarding this article or you didn't implement the above codes. Kindly let us know by commenting on below the comment section. Do visit our site again thankyou.
Post Reference
Reference :
Www.TechAadi.Eu.Org