Help - Search - Members - Calendar
Full Version: How To Add Links To Your Signature
mobile9 Forum > ThemeMaking > Chat, Tutorials & Resources > Tutorials
your_mother
This tutorial will show you how you add links to your forum signature. It doesn't help with creating the signature itself... I'm using Tattwams siggy for an example:


To add the links to your siggy you have to cut your image in different parts. To do that open the image in photoshop. It all works best if your file has only one layer...


1. Create some guidelines where you want to cut your image.
Make sure the 'Move Tool' is selected. Now simply click on any part of the rulers and pull the guide line to the point you want to cut your image. Let go of the mouse when you are satisfied. You can still move your guide afterwards. Simply move the mouse on the line, click and drag.


If you can't see the rulers on your photoshop window you can make them visible by choosing 'View' - 'Rulers'.


In this siggy I want to have three images, one with Tattwams Name, that has no link, one for the gallery-link and one for the profile-link. I added guide-lines accordingly:



2. Choose the 'Crop Tool' from your tools bar.


Now choose the first part of your siggy. In my case that's the part with Tattwams Name. Make sure you crop the image where you set your guide lines. Press the ok symbol on the top of your photoshop window when you are satisfied.



3. Save the cropped image. You have to do that with 'File' - 'Save for web and devices'


4. Now undo your last step with 'Edit' - 'Step Backward' or press 'ctrl' & 'alt' &'Z'.



5. Repeat the steps 2 and 3 with the other two parts of the image. Of course your siggy can also have only two parts... More than three doesn't work, by the way.

You should now have three different images saved:



6. Upload your images.
You can use any webpage for that. I'm mainly using Photobucket...


7. The code.
Post your images as you would usually do in the forum. The only thing you have to take care of is the right order. Since I have one image on top and two that have to be placed under it my code looks like this:
CODE
[img]http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/nothing.png[/img]
[img]http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/profile.png[/img][img]http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/gallery.png[/img]

First the image with Tattwams Name, then the Profile and Gallery image right under it.

8. Adding the links
Mark the part of the code where you have your profile image. In my example that would be this part:
CODE
[img]http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/profile.png[/img]

Now press the 'Insert Link' button of the editor and insert the link to your profile. After that mark the part of the code where you have your gallery image and insert the link to your gallery.

That's it. You now have a linked signature. clap.gif

By the way: If you're making a siggy for somebody else you might want to share the code. To do that simply ad code-tags to the code you want to share. Like this:
soumyadeepbshn
Thnx a lot Mom !

Previously I used "Photoscape" for cropping the images & insert the links

Now I have learned with cs5 , thnx 2 u .
sksahoozzz
Very good Tutorials about Siggy.
BTW mom is it only allowed .png formats / .jpg formats also allowed for use ?
your_mother
QUOTE (sksahoozzz @ Jul 12 2011, 11:41 AM) *
Very good Tutorials about Siggy.
BTW mom is it only allowed .png formats / .jpg formats also allowed for use ?

Basically you can use any format for a signature (png, jpg, gif). If you are using jpg you have no possibility to make the background of your siggy transparent, that's why it's often in png format. If you are using gif format you can add transparency, but not as nice as with png (it's pretty hard to add a shadow for example). But it gives you the possibility of adding an animation...
Na3em0
that's amazing u r so good thnx
LordOfLightning
Awesome tutorials
mom
mkraj25
THANKS MOTHER smile.gifsmile.gifsmile.gifsmile.gif
san-sagar
Thanks mommy for this amnsome tutorial
_Daniel_02
Thanks alot...nice tutorial..! clap.gif
peace_lover3
thahks
gourabguddu
thank you..
king_abhishek
nice tutorial thumbsup.gif
Rohitkohli888
nice tutorial smile.gif
Emopintu95
Can u make any emoboy sig for me.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.