Thumbs Methodology (1 Viewer)

[T Y L E R]

Hi Guys ,

While browsing the forum this week , I discovered that some of you are still on dialup internet ! It gave me pause to think that if I was getting a little frustrated with the forum speed ( improved now ) , that you dialup guys must be going bananas ! I suggested in one of the threads that perhaps we could try using 'thumbnails' here . Beo remarked that it might be a good project for me , as long as I didn't go messing with the forum itself .. hehe . Would I do that ? Shortly after Beo replied , a few more of you also began to show your support for such an idea . Well I sat down this morning with that in mind , and I now have a solution . It does not change any of the forum software , but it does use the YaBB code tags for IMG and URL . I will detail below the methods for getting thumbnails up and running . It may seem a little cumbersome at first , but I'm hoping that it will also be intuitive enough that folks will slowly latch onto it . As more of us try it , those of you on dialup may begin to enjoy pages that load a little faster .

• First you will need to join a free online image host . I have had great success with Cartogra.com in the past so I rejoined them this morning and was up and running within 10 mins !
• After you join , remember to log out before you begin loading pics .
• Log back in and 'Create New Album' . I called mine 'Forum Pics'
• Load up a few pics to start with . The great thing is that any pic you load can be viewed as 'thumbnail' , 'large' , or 'fullsize' .
• Correspondingly , if you choose the 'Create Link for auction' , then you will see what I mean ...

Now for the technical part ...

Upload a few pics , and we will begin shortly ! What I will do to illustrate the code used is use a two part process . The example(s) will involve 'two' seperate parts . In the first portion of the post you will see an image . By clicking on the image you will be able to see the full-sized version . Directly below this image you will find the code which I used to create it . Clear as 'mud' eh ?

Ok , lets get started !

 

[T Y L E R]

[url=http://www.cartogra.com/servlet/LinkPhoto?GUID=566f7bae-5813-62d2-2e03-7de414ca5fd0&size=lg][img]http://www.cartogra.com/servlet/LinkPhoto?GUID=566f7bae-5813-62d2-2e03-7de414ca5fd0&size=sm[/img][/url]

 

[T Y L E R]

Ok , let's begin to tear apart the code in the example above ...

• Even before we are ready to create the above code , we need to have our pics (thumb) url copied to our clipboard .
• To do this go back to your photo album on Cartogra where your now uploaded pics are saved .
• Click on the 'select view' below the picture of your choice ; that will check mark your selection .
• Now select 'Create Link for auction' and a new window will appear .
• On the windows upper right side you will see a smaller window that has the special code you must 'highlight and copy' to your clipboard .

Here's an example of such code :

http://www.cartogra.com/servlet/LinkPhoto?GUID=566f7bae-5813-62d2-2e03-7de414ca5fd0&size=sm

One thing I'd like to draw your attention to is the last bit of that code :

size=sm

"Size=sm" , or size equals small . This is an important part of the string because it is the part we will have to change in order to let us eventually create the url for the full sized image .

Ok , now lets post that example code again in it's entirety :

[url=http://www.cartogra.com/servlet/LinkPhoto?GUID=566f7bae-5813-62d2-2e03-7de414ca5fd0&size=lg][img]http://www.cartogra.com/servlet/LinkPhoto?GUID=566f7bae-5813-62d2-2e03-7de414ca5fd0&size=sm[/img][/url]

If you look closely , you will notice that in the first part of the code , I actually use 'size=lg' . This is because I am creating a URL that will identify the pic I saved on Cartogra ; but in it's large format . The second part of the code uses the familiar 'size=sm' ; spoken of earlier . This is because it is being used to identify the thumbnail of our picture hosted on Cartogra . The thumbnail image that we will use to display on the forum .

Essentially the above code is the combination of two distinct YaBB functions . On one hand we are posting an image ... and on the other a URL , or 'hyperlink' . The code merges these two functions together , so that we :

• See the image
• But do not see the URL , or 'Hyperlink' .
• What we've accomplished is allowing the 'image' itself to serve as the hyperlink .

Simply model your own code after the above example , and you should be good to go . If you have any questions , I'll do my best to answer them here .

Good luck guys , and dolls !

T Y L E R

[color=0000FF]T[/color][color=0008FF]O[/color][color=0010FF]Y[/color][color=0018FF]O[/color][color=0020FF]T[/color][color=0028FF]A [/color][color=0030FF]F[/color][color=0038FF]Z[/color][color=0040FF]J[/color][color=0048FF]8[/color][color=0050FF]0 [/color][color=0058FF]C[/color][color=0060FF]R[/color][color=0068FF]U[/color][color=0070FF]I[/color][color=0078FF]S[/color][color=0080FF]E[/color][color=0088FF]R[/color][color=0090FF]S [/color][color=0098FF]R[/color][color=00A0FF]O[/color][color=00A8FF]C[/color][color=00B0FF]K [/color][color=00B8FF]![/color][color=00C0FF]![/color][color=00C8FF]![/color]

Special thanks to the guys that lit the fire under my butt to get this done . They include Beo , Bad_Religion , and Asiarider . Also thanks is due to Woody for his help this morning in combining the URL/Image tags together for that purty look

 

[Asiarider]

Tyler,

thanks. That looks pretty good and not to complicated. Hopefully many members will apply it and speed the forum up. Thanks again Tyler.

Mike

 

[Beowulf]

Nice work Tyler!

Those of us that don't use Cartogra can probably do the same thing by creating a small image on your web host and a corresponding large image. Same basic idea. I'll try it in this thread later tonight or maybe this weekend. (Kinda busy right now.... having to work for a living sucks.)

-B-

 

[PHAT MAX]

hey, i got a hot tip for us webphotos users (they dont allow linking).

when linking to a webphotos image, copy the url, EXCEPT the .jpg at the end. voilla! that is how i post all my images!

 

[PHAT MAX]