How to add sparkles to username

For support and discussion related to templates, themes, and imagesets in phpBB 3.0.
Ideas Centre
Locked
User avatar
Sinom
Translator
Posts: 1685
Joined: Thu Oct 28, 2010 9:53 am
Contact:

How to add sparkles to username

Post by Sinom »

Since there has been some requests regarding Sparkles on username, I thought I'd make a little guide as how to implement this in a few different ways.

I use the following image as an example, and I place it in \styles\prosilver\theme\images\ named sparkle.gif
Image

Table of Contents
[/size]
-----------------------------------------------------------------------------------------------------------------------------

Add sparkles to specific group
1) In order to add to a specific group, we need to add two lines in a .php file.

Open viewtopic.php and find:

Code: Select all

'POSTER_AGE'		=> $user_cache[$poster_id]['age'],
Add on a new line below:

Code: Select all

'POST_AUTHOR_GROUP_ID'      =>  $user_cache[$poster_id]['user_group_id'],
Find:

Code: Select all

'user_colour'		=> $row['user_colour'],
Add on a new line below:

Code: Select all

user_group_id'         => $row['group_id'],
2) Go to \styles\prosilver\template\ and open viewtopic_body.html

Find:

Code: Select all

<!-- IF not postrow.U_POST_AUTHOR --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE -->{postrow.POST_AUTHOR_FULL}
Replace that with:

Code: Select all

<!-- IF postrow.POST_AUTHOR_GROUP_ID eq 5 --><span class="sparkle"><strong>{postrow.POST_AUTHOR_FULL}</strong></span>
5 is the group number I'm using as an example, you can find the ID in ACP > Users & Groups

Find: (Around line 135)

Code: Select all

<strong>{postrow.POST_AUTHOR_FULL}</strong>
Replace with:

Code: Select all

<!-- IF postrow.POST_AUTHOR_GROUP_ID eq 5 --><span class="sparkle"><strong>{postrow.POST_AUTHOR_FULL}</strong></span><!-- ELSE --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ENDIF -->
3) Go to \styles\prosilver\theme\ and open colours.css

Find:

Code: Select all

.bg3	{ background-color: #cadceb; }
Add on a new line below:

Code: Select all

.sparkle {background-image: url("{T_THEME_PATH}/images/sparkle.gif");}
-----------------------------------------------------------------------------------------------------------------------------


Add sparkles to specific user

1) Go to \styles\prosilver\template\ and open viewtopic_body.html

Find:

Code: Select all

<!-- IF not postrow.U_POST_AUTHOR --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE -->{postrow.POST_AUTHOR_FULL}
Replace that with:

Code: Select all

<!-- IF postrow.POSTER_ID eq 2 --><span class="sparkle"><strong>{postrow.POST_AUTHOR_FULL}</strong></span><!-- ELSE -->
            <strong>{postrow.POST_AUTHOR_FULL}</strong>
2 is the ID of the first Admin, you can find the ID in ACP > Users & Groups

Find: (Around line 135)

Code: Select all

<strong>{postrow.POST_AUTHOR_FULL}</strong>
Replace with:

Code: Select all

<!-- IF postrow.POSTER_ID eq 2 --><span class="sparkle"><strong>{postrow.POST_AUTHOR_FULL}</strong></span><!-- ELSE --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ENDIF -->
2) Go to \styles\prosilver\theme\ and open colours.css

Find:

Code: Select all

.bg3	{ background-color: #cadceb; }
Add on a new line below:

Code: Select all

.sparkle {background-image: url("{T_THEME_PATH}/images/sparkle.gif");}
-----------------------------------------------------------------------------------------------------------------------------

When editing your style, I would recommend the following:

*Download a good text editing program - Such as Notepad++*
  • Log in to your server using your FTP-client. Find and download the file you need to edit.
  • Save a backup, make the changes you're going to do, and then save your file.
  • Re-upload the file to your server, and then head into your forum.
  • Log in to the ACP and head to ACP >> Styles > Choose Templates/Themes/Imagesets for your style and click Refresh!
  • When you're done, you will have cleared the cache and will be able to see the changes you've done the next time you go to the board and hit F5.
- Sinom

User avatar
maciasbarlinek99
Registered User
Posts: 241
Joined: Sat Sep 29, 2012 9:15 am
Location: Polska
Name: Maciej Przyborowski
Contact:

Re: How to add sparkles to username

Post by maciasbarlinek99 »

Wow ! This tutorial is the best!
Thanks you very much.
I will add other shiny images:

Image

Code: Select all

https://camo.phpbb.com/685ac113e857adb62b419282c918248da0f71c68/687474703a2f2f696d6732302e6f746f666f746b692e706c2f6f6272617a6b692f70693439345f316666312e676966
Black
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/c26bc5df455287f304b6a25d2d4aca2d21969344/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b69677265656e5f3134332e676966
Blue/Green
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/314aed92cc427d1cc0cc12d8eca6a382b76336b2/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b697265645f3430392e676966
Red
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/5609b3d5492d30873cba91fe5a673e799c03f2ad/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b695f3230392e676966
Yellow
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/93f1e3a5327f117ea228d521325f66dabc91f57a/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b69626f72646f5f3133342e676966
Dark Red
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/16d2a1aa6f95d587210eaca118983464ee25beb9/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b696461726b677265656e5f3133342e676966
Dark Green
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/ba85a64d45034a13125946e5eb070934d73496bd/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b696f72616e67655f3134302e676966
Orange
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/abbd92a74f47ddf1eaac26a4974964d8dde5e0f2/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b6976696f6c65745f3130332e676966
Violet
-----------------------------------------------------------------------------------------------------------------------------

Please, add to first post.

User avatar
Dead Man
Registered User
Posts: 241
Joined: Tue Jun 05, 2012 12:35 am

Re: How to add sparkles to username

Post by Dead Man »

I have a SubSilver 2 Base theme.

I have this in my viewtopic_body.html but it doesn't seem to work for me. I already did the rest of the edits to viewtopic.php and added the sparkle code to the theme style .css

Code: Select all

<b class="postauthor"
<!-- IF postrow.POST_AUTHOR_COLOUR --> style="color: {postrow.POST_AUTHOR_COLOUR}"<!-- ENDIF -->><!-- IF postrow.POST_AUTHOR_GROUP_ID eq 5 --><span class="sparkle"><strong>{postrow.POST_AUTHOR_FULL}</strong></span></b><!-- ELSE -->{postrow.POST_AUTHOR_FULL}</b><!-- ENDIF -->

mxandios
Registered User
Posts: 14
Joined: Sun Oct 19, 2014 11:27 am

Re: How to add sparkles to username

Post by mxandios »

hey
maciasbarlinek99 wrote:Wow ! This tutorial is the best!
Thanks you very much.
I will add other shiny images:

Image

Code: Select all

https://camo.phpbb.com/685ac113e857adb62b419282c918248da0f71c68/687474703a2f2f696d6732302e6f746f666f746b692e706c2f6f6272617a6b692f70693439345f316666312e676966
Black
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/c26bc5df455287f304b6a25d2d4aca2d21969344/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b69677265656e5f3134332e676966
Blue/Green
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/314aed92cc427d1cc0cc12d8eca6a382b76336b2/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b697265645f3430392e676966
Red
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/5609b3d5492d30873cba91fe5a673e799c03f2ad/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b695f3230392e676966
Yellow
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/93f1e3a5327f117ea228d521325f66dabc91f57a/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b69626f72646f5f3133342e676966
Dark Red
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/16d2a1aa6f95d587210eaca118983464ee25beb9/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b696461726b677265656e5f3133342e676966
Dark Green
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/ba85a64d45034a13125946e5eb070934d73496bd/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b696f72616e67655f3134302e676966
Orange
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/abbd92a74f47ddf1eaac26a4974964d8dde5e0f2/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b6976696f6c65745f3130332e676966
Violet
-----------------------------------------------------------------------------------------------------------------------------

Please, add to first post.
can you upload it again for me please i very need it

mxandios
Registered User
Posts: 14
Joined: Sun Oct 19, 2014 11:27 am

Re: How to add sparkles to username

Post by mxandios »

And can we add the sparkly to another gruop

mxandios
Registered User
Posts: 14
Joined: Sun Oct 19, 2014 11:27 am

Re: How to add sparkles to username

Post by mxandios »

can't find the code in viwetopic_body in absolution theme

User avatar
maciasbarlinek99
Registered User
Posts: 241
Joined: Sat Sep 29, 2012 9:15 am
Location: Polska
Name: Maciej Przyborowski
Contact:

Re: How to add sparkles to username

Post by maciasbarlinek99 »

mxandios wrote:hey
maciasbarlinek99 wrote:Wow ! This tutorial is the best!
Thanks you very much.
I will add other shiny images:

Image

Code: Select all

https://camo.phpbb.com/685ac113e857adb62b419282c918248da0f71c68/687474703a2f2f696d6732302e6f746f666f746b692e706c2f6f6272617a6b692f70693439345f316666312e676966
Black
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/c26bc5df455287f304b6a25d2d4aca2d21969344/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b69677265656e5f3134332e676966
Blue/Green
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/314aed92cc427d1cc0cc12d8eca6a382b76336b2/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b697265645f3430392e676966
Red
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/5609b3d5492d30873cba91fe5a673e799c03f2ad/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b695f3230392e676966
Yellow
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/93f1e3a5327f117ea228d521325f66dabc91f57a/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b69626f72646f5f3133342e676966
Dark Red
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/16d2a1aa6f95d587210eaca118983464ee25beb9/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b696461726b677265656e5f3133342e676966
Dark Green
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/ba85a64d45034a13125946e5eb070934d73496bd/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b696f72616e67655f3134302e676966
Orange
-----------------------------------------------------------------------------------------------------------------------------
Image

Code: Select all

https://camo.phpbb.com/abbd92a74f47ddf1eaac26a4974964d8dde5e0f2/687474703a2f2f7777772e70727a656d6f2e6f72672f7068704242322f666f72756d2f66696c65732f677769617a646b6976696f6c65745f3130332e676966
Violet
-----------------------------------------------------------------------------------------------------------------------------

Please, add to first post.
can you upload it again for me please i very need it
I don't understand.. I give you link and it's online..
Do you want to attachment or what?

Locked

Return to “[3.0.x] Styles Support & Discussion”