Styled Member Names 2.2.0 [Updated: 12th Dec, 2017]

[bai]

ah so i cannot have both the gradient and animation? Peter

[Peter]

bai,

Can you explain the effect you are trying to achieve?

[bai]

Jul 20, 2018 10:28:28 GMT -8 Peter said:

bai ,

Can you explain the effect you are trying to achieve?

Yes I want gradient text with a sparkle GIF background image. Someone on here helped me find the code for gradient text but perhaps that is conflicting with the background-image.

[Peter]

bai ,

I don't think you will be able to do that without a restructure of the element. Because you are applying a gradient to the background, then basically creating a stencil for the text, so the background outside of the stenciled area is removed. The best you could do is add the sparkles to the gradient text.

Edit:  Spoke too soon.  I just read over the docs for those props and misread one of them.

Try this...

text-transform: uppercase; background: url('//78.media.tumblr.com/6a75b14a40ac6b21bc5eae631826b2a8/tumblr_inline_oyquemHEAG1s3m3c2_500.gif'), linear-gradient(to right, orange , yellow, green, cyan, blue, violet) text; -webkit-text-fill-color: transparent;

Links for reading:

developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient

developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-fill-color

developer.mozilla.org/en-US/docs/Web/CSS/background-clip

[bai]

Peter the code you gave me makes the name disappear, and when i replaced the color words with html color codes it disappeared. same thing if i used "pink, red"

thanks for those extra links!

[Peter]

bai,

You will need to tweak it for cross browser support, as some of those properties aren't standard. I tweaked your original CSS for Firefox. If I had to guess, it's the text clipping. So try changing it to -webkit-background-clip instead.

[Eclipse]

Hi Peter . Is there a way to use this plugin for member ranks as well?

[Smokey]

Does this allow for background colors/highlight?

[bai]

Sept 16, 2018 13:43:56 GMT -8 Smokey said:

Does this allow for background colors/highlight?

Yeah you just gotta play around with code a bit.

Try

background-color: COLOR HERE;

If you need to change the opacity or this code doesn't do the trick for you, let me know. I'm a beginner coder so I'll be learning with you as well.


Eclipse I may be speaking out of turn, but I believe to do that you would need to code it by scratch. It's "Easy" enough, but you will have to do some CSS styling.

[Eclipse]

Sept 19, 2018 8:44:54 GMT -8 bai said:

Sept 16, 2018 13:43:56 GMT -8 Smokey said:

Does this allow for background colors/highlight?

Yeah you just gotta play around with code a bit.

Try

background-color: COLOR HERE;

If you need to change the opacity or this code doesn't do the trick for you, let me know. I'm a beginner coder so I'll be learning with you as well.


Eclipse I may be speaking out of turn, but I believe to do that you would need to code it by scratch. It's "Easy" enough, but you will have to do some CSS styling.

Great! What do I have to do?

[mysticrystal]

Hello, I have it where there is a background color along with a different colored text. But the only thing that's showing up on the profiles is the text color. How can I get the background color to show up on the profile like it does on the main forum?

[mysticrystal]

bump if possible? I could really use the help.

Tagging Peter

[Former Member]

I just installed the ColorSmear plugin and I have also the Icon Next To Members Name plugin installed. Since I have added the ColorSmear plugin the Icon Next To Members Name plugin doesn't work (meaning the icons are not showing up anymore next to the names I added the ColorSmear to). My question to ya'll is there a way I can have both plugins work with each other?

Thank you..

[Peter]

Jul 29, 2019 16:42:59 GMT -8 mysticrystal said:

bump if possible? I could really use the help.

Tagging Peter

Link me to where it is and isn't working so I can inspect.

[Peter]

Jul 30, 2019 8:11:30 GMT -8 Nabeela said:

I just installed the ColorSmear plugin and I have also the Icon Next To Members Name plugin installed. Since I have added the ColorSmear plugin the Icon Next To Members Name plugin doesn't work (meaning the icons are not showing up anymore next to the names I added the ColorSmear to). My question to ya'll is there a way I can have both plugins work with each other?

Thank you..

Reorder the plugins.