Clickable URL help please

Deblk · **Joined:** Dec 22, 2011 **Posts:** 385

GIMP Version: 2.8.14
Operating System: Windows
GIMP Experience: New User

Can anybody help me to add this to my logo...TIA

molly · **Joined:** Apr 07, 2010 **Posts:** 14182

Are you asking to add it to your signature? I don't know what you mean by logo.

jontait2 · **Joined:** Dec 27, 2014 **Posts:** 508

To make a clickable link on a phpBB bulletin board like GimpChat use this form:

Code: Select all

[url=http://xxxxxxx]yyyyyyyy[/url]

where:
xxxxxx = the website you want to link to
yyyyyy = whatever you want to appear as the clickable item (eg. text, image, etc)

The animation in your signature is probably stored in the form:

Code: Select all

[img]http://gimpchat.com/files/nnnn_zzzzzzz.gif[/img]

..so, if you want to make it into a clickable link just wrap it between the [url] tags like this:

Code: Select all

[url=http://xxxxxxx][img]http://gimpchat.com/files/nnnn_zzzzzzz.gif[/img][/url]

Clickable link

Deblk · **Joined:** Dec 22, 2011 **Posts:** 385

Thanks...will try to explain. I have an image logo and would like to make the text on the image a clickable link to direct it to another website.

jontait2 · **Joined:** Dec 27, 2014 **Posts:** 508

Where is this logo being used ? What program is it appearing in ? How you turn the text into a link will depend upon the program which is displaying the logo.

Deblk · **Joined:** Dec 22, 2011 **Posts:** 385

jontait2 wrote:

Where is this logo being used ? What program is it appearing in ? How you turn the text into a link will depend upon the program which is displaying the logo.

I made a logo with gimp using images and text. This logo is on one of my sites and I would like to make some of the text on the logo clickable so that it will direct to another of my sites. I have opened the logo in gimp and using the image map tool have so far selected the text I want to use and added my URL but now I am lost

jontait2 · **Joined:** Dec 27, 2014 **Posts:** 508

You cannot embed an active link in an image file.

The image can only be turned into a link by the file that defines the website layout (ie. the HTML file, or whatever program was used to generate the website layout). And it will turn the whole image into an active link, not just the text. (To get just the text to work as a link you would have to create two images - a background image and a text image and then use HTML directives to overlay the text onto the background and make it a link.)

Deblk · **Joined:** Dec 22, 2011 **Posts:** 385

jontait2 wrote:

You cannot embed an active link in an image file.

The image can only be turned into a link by the file that defines the website layout (ie. the HTML file, or whatever program was used to generate the website layout). And it will turn the whole image into an active link, not just the text. (To get just the text to work as a link you would have to create two images - a background image and a text image and then use HTML directives to overlay the text onto the background and make it a link.)

Ok thank you

ofnuts · **Joined:** Oct 25, 2010 **Posts:** 4739

jontait2 wrote:

You cannot embed an active link in an image file.

The image can only be turned into a link by the file that defines the website layout (ie. the HTML file, or whatever program was used to generate the website layout). And it will turn the whole image into an active link, not just the text. (To get just the text to work as a link you would have to create two images - a background image and a text image and then use HTML directives to overlay the text onto the background and make it a link.)

You can always use an 'imagemap' with one single area that just encompasses the text. But imagemaps are so Web 1.0...

Odinbc · **Posted:** Sun Apr 26, 2015 10:04 am **(#10)**

Image maps are still a thing in HTML5 and Gimp can somewhat help with 14.2. ImageMap tool (Filters → Web → ImageMap). More info at Grokking the Gimp, 9.2 Clickable Image Maps. After using the ImageMap tool in Gimp the result is HTML code (not a new image) that you would add to the image code on your web page. This works well on static image areas.

Here's an example of the code generated by Gimp that you would add to your web page.

Code: Select all

<img src="imagemap.png" width="512" height="512" border="0" usemap="#map" />

<map name="map">
<!-- #$-:Image map file created by GIMP Image Map plug-in -->
<!-- #$-:GIMP Image Map plug-in by Maurits Rijk -->
<!-- #$-:Please do not edit lines starting with "#$" -->
<!-- #$VERSION:2.3 -->
<!-- #$AUTHOR:Odinbc -->
<area shape="rect" coords="115,210,124,233" alt="Gimp Chat" href="http://gimpchat.com/index.php" />
</map>

usemap="#map" is used in the image tag to link to <map name="map"></map> link coordinate code.
Any 'usemap' name must match the 'map name'.
The <map name="map"></map> code can be placed anywhere between the <body></body> tags.
The 5 lines starting with,  are comment tags.
<area shape="rect" (type rectangle), coords="115,210,124,233" (coordinates of link area), alt="Gimp Chat" (alternative text) and href="http://gimpchat.com/index.php" (the link).

That's the short answer. There are other techniques and responsive image solutions unrelated to Gimp. Is your web site responsive (mobile friendly)?