How to Create a Sparkbow

[PsYcHo_RaGE 30]

In this tutorial i am gonna show you how to create a sparkbow, basically its a mixture of two effects viz Sparkling and rainbow > Sparkbow

let's get started > first of all go to AdminCP and login  then go to 

>Customization>Themes>

like the images above, do the same thing >

now go to global template which is shown by default so paste The below piece of code towards the bottom of the script. For example, you could place it just above where you see something relevant to <!-- ::: Footer ::: -->

<script>
var speed=80
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")
var r=1
var g=1
var b=1
var seq=1
function changetext(){
for(i=0;i<document.getElementsByName("Rainbow").length;i++){
var storetext=document.getElementById? document.getElementsByName("Rainbow")[i] : document.all.highlight
rainbow="#"+hex[r]+hex[g]+hex[b]
storetext.style.color=rainbow
}
}
function change(){
if (seq==6){
b--
if (b==0)
seq=1
}
if (seq==5){
r++
if (r==12)
seq=6
}
if (seq==4){
g--
if (g==0)
seq=5
}
if (seq==3){
b++
if (b==12)
seq=4
}
if (seq==2){
r--
if (r==0)
seq=3
}
if (seq==1){
g++
if (g==12)
seq=2
}
changetext()
}
function starteffect(){
if (document.all||document.getElementById)
flash=setInterval("change()",speed)
}
starteffect()
</script>

After you have inserted the code, within [edit html & css] go to CSS Tab and click on custom.css (if you are not able to find it, Search it!) now in custom.css paste the following code

/* Membership Color Group /Color is in hex /change anything you want and suit your needs/ i have included only two groups here, you can incude as many as you want */
.Youranygroup {
background: url(link to sparkle gif);
color: #00fffa;
font-weight: bold;
text-shadow: 2px 0px 11px #00ffe5;
}

.Youranygroup {
background: url(link to sparkle gif);
color: #f93647;
font-weight: bold;
text-shadow: 2px 0px 11px #f93647;
}

 

Now, we will navigate from within the AdminCP to Members > Member Groups > Manage Member Groups > Click on the group you wish to have the sparkbow effect

For the group prefix, you are going to enter the following code

<span name="Rainbow" class="youranygroup">

As for the group suffix, you are going to enter

</span>

And you are done, now surf up the website and see that changes made//////// if you are still getting any problem..i am here to help you

Conclusion

Edited August 8, 2018 by PsYcHo_RaGE

[Cookie Monster 816]

Would suggest add a small preview of what it is (for people this is just pure code)

Also i optimized your code a bit, as your self executing things all the time. using else if should speed up the time it takes for JS to check if its truthy or falsy.

also the JS can be optimized even further as this seems a bit sloppy written imo other then that great guide.

function change() {
	if (seq == 6) {
		b--;
		if (b == 0) seq = 1;
	} else if (seq == 5) {
		r++;
		if (r == 12) seq = 6;
	} else if (seq == 4) {
		g--;
		if (g == 0) seq = 5;
	} else if (seq == 3) {
		b++;
		if (b == 12) seq = 4;
	} else if (seq == 2) {
		r--;
		if (r == 0) seq = 3;
	} else if (seq == 1) {
		g++;
		if (g == 12) seq = 2;
	}
	changetext();
}

 

[PsYcHo_RaGE 30]

26 minutes ago, Cookie Monster said:

Would suggest add a small preview of what it is (for people this is just pure code)

Also i optimized your code a bit, as your self executing things all the time. using else if should speed up the time it takes for JS to check if its truthy or falsy.

also the JS can be optimized even further as this seems a bit sloppy written imo other then that great guide.

function change() {
	if (seq == 6) {
		b--;
		if (b == 0) seq = 1;
	} else if (seq == 5) {
		r++;
		if (r == 12) seq = 6;
	} else if (seq == 4) {
		g--;
		if (g == 0) seq = 5;
	} else if (seq == 3) {
		b++;
		if (b == 12) seq = 4;
	} else if (seq == 2) {
		r--;
		if (r == 0) seq = 3;
	} else if (seq == 1) {
		g++;
		if (g == 12) seq = 2;
	}
	changetext();
}

 

well i forgot to add preview but its now inserted 

and thanks for optimizing the code, greatly appreciated your help

and i also i will try to to make it more stable and will update it continuously 

Edited August 8, 2018 by PsYcHo_RaGE

[kLeiNtjiEE 3]

Thank you very much, it looks very good

[PsYcHo_RaGE 30]

6 hours ago, kLeiNtjiEE said:

Thank you very much, it looks very good

did you tried it? if you are getting any problems i am here and thanks for trying it

[Caleeco 21]

This looks clean... will look to integrate it and let you know how i get on