Geekzone Signature Template

Forums › Off topic › Geekzone Signature Template

Cyris

121 posts

Master Geek

#78820 9-Mar-2011 01:51

Hi guys,

I got bored so I decided to create a simple signature template for the geeks who enjoy showing off their special machines that they love so much and maybe for those who don't even have a signature.

The signature will look like this =>

sig

Template here =>

<ul style="font-weight: bold; float: left; list-style-type: none; width: 30%; padding-left: 1px; margin-top: -14px;">

   <li><img alt="OS" src="https://cdn.geekzone.co.nz/imagessubs/f6bb1d2dd7c777c9e93546c5de031737.jpg"> Operating System - TEXT HERE</li>

   <li><img alt="Monitors" src="https://cdn.geekzone.co.nz/imagessubs/9c2ccd32617bef13c625488551336ba5.jpg "> Monitors - TEXT HERE </li>

   <li><img alt="CPU" src="https://cdn.geekzone.co.nz/imagessubs/557029ffbb7f2f38a1d43877135d3f2c.jpg "> CPU - TEXT HERE</li>
</ul>

<ul style="font-weight: bold; float: left; list-style-type: none; width: 22%; display: block; margin-top: -29px;">

   <li><img alt="RAM" src="https://cdn.geekzone.co.nz/imagessubs/dcd6dc1846799a9f42009ca2649ad490.jpg"> RAM - TEXT HERE</li>

   <li><img alt="GPU" src="https://cdn.geekzone.co.nz/imagessubs/57ee114b8ddc89a81c3ad73f7303191b.jpg"> GPU - TEXT HERE</li>

   <li><img alt="HDD" src="https://cdn.geekzone.co.nz/imagessubs/24390755e7c988fdaf35cd570f889484.jpg "> Drives - TEXT HERE</li>
</ul>

Sorry for the messy code, but GeekZone doesn't support pre-formatted text (that I'm aware of).

Just replace all your specs in the designated areas (TEXT HERE), if you are adding a lot of information then adjust the CSS width for each <ul> so it all fits in.

Here's the trick, for some reason Geekzones HTML editor keeps adding <br /> when ever you save your signature, and it kinda messes up all the spacing of this template. I've added CSS to counteract this but it only works with one save.

What? Explain Please? - If you add this to your signature, make sure to fill in all the information correctly, then click save. It will add the <br /> where it wants to, but the CSS should fix it. If you decide to go back and save it again it will add even more <br /> in the code, therefor screwing up the template.

You would have to start all over again, copy paste the code, edit and save only once. So make sure you fill in your specs correctly the first time.

If you would like to improve this code, feel free to do so but please paste the code below so we can keep this all in one thread.

Enjoy
~Cyris

Cyris

121 posts

Master Geek

#446838 9-Mar-2011 02:40

Update

Tried to edit the post to add increased compatibility for the code but it won't allow me now, so the update will be here.

If you are adding a lot of information then adjust the CSS width for each <ul> so it all fits in. Remember to consider the resolutions of other users screens when they view your signature, You can edit the CSS to fit 1280x800 screens and upwards by changing the first <ul> width to 335px and the second <ul> width to 250px

I should have used "px" instead of "%" in the first place anyways.

Tips: Try to keep your specs as short as possible, adding too much characters on one line might be wider than the specified width so the text will move to the next line making it look uneven.

NZCoderGuy

513 posts

Ultimate Geek

Trusted

Kiwi Dev Studios

#446899 9-Mar-2011 11:49

done.. how does mine look?

Edit// it looks like pants.. damnn

--
Stephen
twitter/ NZCoderGuy / KiwiDevStudios

freitasm

BDFL - Memuneh
68844 posts

Uber Geek

Administrator

Trusted

Geekzone

Lifetime subscriber

#446900 9-Mar-2011 11:53

There's a reason why we add the BR tags - and it has to do with some options set in the rich text editor. I will look into updating this soon.

In the meantime, we could create a "standard" signature block, where users would just enter the information and we would provide the icons, etc.

You could just update your profile and have that automatically generated for you... What do you think?

These links are referral codes

Cyris

121 posts

Master Geek

#446901 9-Mar-2011 11:55

freitasm: There's a reason why we add the BR tags - and it has to do with some options set in the rich text editor. I will look into updating this soon.

In the meantime, we could create a "standard" signature block, where users would just enter the information and we would provide the icons, etc.

You could just update your profile and have that automatically generated for you... What do you think?

Well that sounds much easier =)

Could we also have an option to add pre-formatted text? So us developers can share code?

freitasm

BDFL - Memuneh
68844 posts

Uber Geek

Administrator

Trusted

Geekzone

Lifetime subscriber

#446902 9-Mar-2011 11:56

Will work on that later this week.

These links are referral codes

heavenlywild

3805 posts

Uber Geek

Trusted

#446903 9-Mar-2011 11:58

Love it, good idea guys!

xpd

Im a pirate
10801 posts

Uber Geek

Mod Emeritus

Trusted

Lifetime subscriber

#446910 9-Mar-2011 12:18

freitasm:

In the meantime, we could create a "standard" signature block, where users would just enter the information and we would provide the icons, etc.

You could just update your profile and have that automatically generated for you... What do you think?

Was going to suggest that.... :)

I'll have to enter my PS3 details as I dont own a PC...

XPD^ / DemiseNZ

Blog Free Games Twitter My TradeMe Goodies

Pirating in Sea Of Thieves

Coming Soon - BBS door games - all the classics!

gehenna

6639 posts

Uber Geek

Moderator

Trusted

Lifetime subscriber

#446911 9-Mar-2011 12:28

Are signatures required at all? Can't you just stick a link under a users avatar to their profile page for people that can't figure out that you just have to click their username? Signatures just make my page load slower and are annoying, truly annoying.

Cyris

121 posts

Master Geek

#446914 9-Mar-2011 12:32

gehenna: Are signatures required at all? Can't you just stick a link under a users avatar to their profile page for people that can't figure out that you just have to click their username? Signatures just make my page load slower and are annoying, truly annoying.

Such a signature should not have a big effect on your loading speed at all, the icons are ranging from 1kb-2kb each, and the rest is just plain text.

You would have to be below dialup to even notice a difference.

freitasm

BDFL - Memuneh
68844 posts

Uber Geek

Administrator

Trusted

Geekzone

Lifetime subscriber

#446915 9-Mar-2011 12:33

Subscribers can disable signatures in all pages...

These links are referral codes

gehenna

6639 posts

Uber Geek

Moderator

Trusted

Lifetime subscriber

#446918 9-Mar-2011 12:38

Cyris: You would have to be below dialup to even notice a difference.

Yeah I know, but they do make more space for me to scroll through in a page. I know I know, I'm a pedant. I'm just not a fan and will look for any reason to disparage them no matter how ludicrous :)

Kaos36

709 posts

Ultimate Geek

#446921 9-Mar-2011 12:40

Awesome will do this later! On my lunch break.

Worst Response To A Crisis:
From a readers' Q and A column in TV GUIDE: "If we get involved in a nuclear war, would the electromagnetic pulses from exploding bombs damage my videotapes?"

freitasm

BDFL - Memuneh
68844 posts

Uber Geek

Administrator

Trusted

Geekzone

Lifetime subscriber

#446926 9-Mar-2011 12:43

Cyris:
gehenna: Are signatures required at all? Can't you just stick a link under a users avatar to their profile page for people that can't figure out that you just have to click their username? Signatures just make my page load slower and are annoying, truly annoying.

Such a signature should not have a big effect on your loading speed at all, the icons are ranging from 1kb-2kb each, and the rest is just plain text.

You would have to be below dialup to even notice a difference.

Also if we make it official (still optional to have of course) all those images would be automatically optmised and distributed through our CDN arrangements too.

These links are referral codes