Jump to content


TUTORIAL: Creating Clickable Thumbnails


17 replies to this topic  – Started by Mister Phes , Jan 28 2007 06:37 AM

#1 Mister Phes

Mister Phes
  • Uncle Sam edit!


    Posts: 20259
    Joined: 19-March 05
    Member: 273

Posted 28 January 2007 - 06:37 AM

Creating Thumbnails


Step 1:  Getting the Thumbnail link


If You're using FireFox

Right Click on the thumbnail in the Brickshelf folder and select "Copy Image Location"


If You're using Internet Explorer 6 or above

Posted Image


Next

Right Click on the thumbnail in the Brickshelf folder and select "Properties" then wait for the Properties dialogue box to appear.

Posted Image

From Address: (URL) highlight the entire link and then copy (CTRL C or Right Click then select "Copy").  

E.g. Highlight
Posted Image

Make sure you highlight all of the URL as it may span 3 lines!!!  
To ensure you highlight the entire URL click it and then press CTRL A or Right Click then "Select All".


Step 2:  Paste Thumbnail link into Eurobricks
  • Return to Eurobricks thread.
  • Select the Insert Image Posted Image button then paste (CTRL V or Right Click and select "Paste") the Brickshelf URL into the box that pops up.
  • The result should be the following:
Posted Image


Step 3:  Getting the Image link
  • Return to Brickshelf.
  • Click on the thumbnail to load into a Brickshelf Preview of that image.  
  • Click on the preview image to go directly to the image file.  
    It is important to click a second time because if you copy the preview URL you will get an error message when attempting to post the image in the forum.
  • Highlight the image address in the Address Bar then copy (CTRL C or Right Click then select "Copy").
Address to be copied should look something like this:

Posted Image


Step 4:  Make the Image a link
  • Return to Eurobricks
  • Highlight the image code you have just inserted and then click the "Insert Link" Posted Image button.
  • Paste the link you just copied into the dialogue box which appears.
The URL tag should wrap around the IMG tag, for example:

Posted Image


Remember
  • The code should only occupy ONE line, it only spans two lines in this example because of space limitations.
  • Be sure to let users know the thumbnail is a link otherwise they may not realise.
End Result

You should finish with this:

Posted Image

Click on Thumbnail to view larger image


Posted Image


#2 Bonaparte

Bonaparte
  • Christmas Moose


    Posts: 14452
    Joined: 22-June 06
    Member: 822
    Country: Belgium

Posted 29 January 2007 - 03:13 PM

Nice job Mr. Phes! These tutorials are very useful!
I would propose to combine them with the "TUTORIAL: How to perform a batch image resize" in the same thread. So we have all the tutorials in different posts in 1 thread inorder to avoid too many pinned topics.
What do you think?

Want to find out more about our Reviewers Academy? Just click the logo.



Posted Image



New Member? Read This | Questions? Need Help? Ask Here



Site Guidelines | Eurobricks FAQ | Visual User Guide






#3 Mister Phes

Mister Phes
  • Uncle Sam edit!


    Posts: 20259
    Joined: 19-March 05
    Member: 273

Posted 29 January 2007 - 11:48 PM

I think its a good idea but unfortunately its not that simple.

For you see the posts are sorted chronologically so if I was to move the above posts or merge the threads then posts be adhered to the very end of the thread.  So what we'd have is the first tutorial about 15 posts of discussion and then the two tutorials which wouldn't be very orderly.

The second option is to edit the first post of the other thread and add on to it but I'm reluctant to do that because the post is already long, and when posts get really long they become hard to manage.  Besides I'd lose my feedback pole.

Third option is to merge the tutorial posts and move the discussion posts to a seperate thread.  Maybe that would be the most convenient option but I'll leave them as they are for the moment.


Posted Image


#4 Bonaparte

Bonaparte
  • Christmas Moose


    Posts: 14452
    Joined: 22-June 06
    Member: 822
    Country: Belgium

Posted 29 January 2007 - 11:52 PM

The third option seems best to me.
This way its also streamlined with the other pinned topics which also have a separate discussion thread.

Want to find out more about our Reviewers Academy? Just click the logo.



Posted Image



New Member? Read This | Questions? Need Help? Ask Here



Site Guidelines | Eurobricks FAQ | Visual User Guide






#5 Mister Phes

Mister Phes
  • Uncle Sam edit!


    Posts: 20259
    Joined: 19-March 05
    Member: 273

Posted 30 January 2007 - 12:00 AM

However, for the sake of the feedback poll I'll keep them as seperate threads for the time being.


So if anyone has any comments, feedback or suggestions regarding this tutorial:

POST THEM HERE!!!


Posted Image


#6 Holodoc

Holodoc
  • Has finally seen the box


    Posts: 3831
    Joined: 24-November 06
    Member: 1094
    Country: Germany

Posted 30 January 2007 - 12:52 PM

Thank you very much for this tutorial!

I had a little problem with the FF/IE partition, but after a moment of confusion I got the picture! :) (my fault, so donīt bother  :-D )
I went through the whole instructions (I LOVE those step-by-step recepies with pictures  *y* ) and did my first thumbnail-added link in another thread. I had difficulties in realizing what the next step would be good for, because some steps I formerly have carried out without thinking of it as a problem. But after working on that step it became clear. So I rated the Tutorial "4".
Even more interested in LEGO bricks & parts? Read Tim Johnson's (aka Caperberry) blog: Posted Image

#7 Norro

Norro
  • Writer & Director and Old Grey fetishist


    Posts: 3508
    Joined: 30-April 05
    Member: 315
    Country: Ireland

Posted 30 January 2007 - 01:21 PM

I gave this a 5. I wish it had been around when I was trying to learn how all the computer people on Lugnet were able to do this. I also assume you meant the FF steps to double for Safari...

         God Bless,

               Nathan
Posted Image

#8 Mister Phes

Mister Phes
  • Uncle Sam edit!


    Posts: 20259
    Joined: 19-March 05
    Member: 273

Posted 30 January 2007 - 01:29 PM

View PostHolodoc, on Jan 30 2007, 11:52 PM, said:

I had a little problem with the FF/IE partition, but after a moment of confusion I got the picture! :) (my fault, so donīt bother  :-D )

No!  No!  Nothing is your fault, the aim of this tutorial is to make any user fully understand the process and part of that involves providing clear and easy to understand instructions.

I've made a couple of slight modifications to make it more clear, so let me know if that's any help.



View PostNorro, on Jan 31 2007, 12:21 AM, said:

I gave this a 5. I wish it had been around when I was trying to learn how all the computer people on Lugnet were able to do this. I also assume you meant the FF steps to double for Safari...

I don't have access to a Mac or Safari at the moment so I cannot conduct tests to confirm this.  When I resume my university studies in 3 weeks I'll have access to Macs and be able to so.  But if you've got a Mac Mr Norro then by all means test it and let us know how you went.


Posted Image


#9 captaintau

captaintau
  • Two Drink Minimum


    Posts: 1536
    Joined: 27-October 05
    Member: 525
    Country: England

Posted 01 February 2007 - 06:11 PM

That's really useful. I'll probably revisit this another time when I feel the need, so please keep it prominent.

#10 Norro

Norro
  • Writer & Director and Old Grey fetishist


    Posts: 3508
    Joined: 30-April 05
    Member: 315
    Country: Ireland

Posted 04 February 2007 - 07:42 PM

A little late... I didn't use this program, but the tutorial did inspire me to try batch treatments, so I would rank it as a huge success. Remember every time you help an under-educated computer user... God smiles  ;-)
  
        God Bless,

             Nathan
Posted Image

#11 Norro

Norro
  • Writer & Director and Old Grey fetishist


    Posts: 3508
    Joined: 30-April 05
    Member: 315
    Country: Ireland

Posted 13 February 2007 - 03:58 PM

View PostMister Phes, on Jan 30 2007, 12:29 PM, said:

But if you've got a Mac Mr Norro then by all means test it and let us know how you went.

The safari steps are almost identical to FF... just a few minor name changes...

        God Bless,

              Nathan
Posted Image

#12 Bonaparte

Bonaparte
  • Christmas Moose


    Posts: 14452
    Joined: 22-June 06
    Member: 822
    Country: Belgium

Posted 13 February 2007 - 07:19 PM

Very nice to see all these great tutorials grouped in 1 thread  *y* !

Want to find out more about our Reviewers Academy? Just click the logo.



Posted Image



New Member? Read This | Questions? Need Help? Ask Here



Site Guidelines | Eurobricks FAQ | Visual User Guide






#13 Optimax X

Optimax X
  • Likes sheep......


    Posts: 652
    Joined: 07-January 07
    Member: 1212
    Country: england

Posted 18 February 2007 - 12:08 PM

Well i tried that firfox tutorial and it didn't work at all, i followed the tutorial as it said, and if anything, i has made it bigger.

#14 Mister Phes

Mister Phes
  • Uncle Sam edit!


    Posts: 20259
    Joined: 19-March 05
    Member: 273

Posted 18 February 2007 - 12:11 PM

Can you post a link to the thread where you were attempting to create the thumbnail?

I'll have a look and then I'll tell you what you did wrong and how you should be doing it.


Posted Image


#15 Just Imagine

Just Imagine

    Posts: 71
    Joined: 12-April 10
    Member: 10241

Posted 13 July 2010 - 07:04 PM

I'm really sorry for bumping a 3 year old topic, but when I try to put 3 images in my sig as links to my MOC's I get an error. How come other members have more then 3 images as links to their topics? I did as the tutorial said, but I get an error message because I have more then 2 URLS.

Edited by Just Imagine, 13 July 2010 - 07:05 PM.

Posted Image Posted Image

#16 SlyOwl

SlyOwl
  • Watch out for Infuriated Isaac's metatarsal!


    Posts: 2467
    Joined: 07-October 07
    Member: 2057
    Country: England

Posted 15 July 2010 - 05:41 PM

View PostJust Imagine, on 13 July 2010 - 07:04 PM, said:

I'm really sorry for bumping a 3 year old topic, but when I try to put 3 images in my sig as links to my MOC's I get an error. How come other members have more then 3 images as links to their topics? I did as the tutorial said, but I get an error message because I have more then 2 URLS.
Vassals can only put a maximum of 2 links and 4 pics in their sig - essentially to prevent cluttering up threads and to stop people joining for the sole purpose of self-promotion :pir-wink:

To the barricades!
Posted Image


#17 Brickstarrunner

Brickstarrunner

    Posts: 122
    Joined: 27-September 09
    Member: 7596
    Country: USA

Posted 19 June 2012 - 10:34 AM

I'd hate to bump, but this needs to be updated, because the new coding is giving me trouble because it inserts images and links automatically instead of just having text.

Posted ImagePosted ImagePosted Image
.
"Hmmm, twitcha-twitchy-twitchy-twitch.........Twitcha-twitch! TWITCHA-TWITCH!"

- Pinkie Pie, My Little Pony: Friendship is Magic


#18 Big Cam

Big Cam
  • A good mood, too.


    Posts: 13999
    Joined: 02-April 09
    Member: 5701
    Country: USA

Posted 19 June 2012 - 02:59 PM

View PostBrickstarrunner, on 19 June 2012 - 10:34 AM, said:

I'd hate to bump, but this needs to be updated, because the new coding is giving me trouble because it inserts images and links automatically instead of just having text.
That makes it even easier. Click the image button, paste your image URL(thumbnail sized) [ then hit submit, you then highlight the newly displayed URL that now has image tags around it, then click the URL button, the image tagged url should already be in the text portion and you now paste the full sized URL in the URL field.

Being that this thread is five years old, I don't see a need to update it, since most people don't know it exists, and this type of tutorial is probably better suited elsewhere today than just the pirate forum.



Reply to this topic



  


0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Sponsored Links