PDA

View Full Version : Images & Images that expand into new windows on click



W3bMa5t3r
02-23-2006, 06:23 PM
Ok well I have this on Page 7 of my site here, but as requested, I'll be writing a few "Website HowTo's" for GotStang?. Since I do have some of this information on my site already, I'll try to go a bit more in-depth with what I write here. Please forgive me beforehand for any grammatical or spelling errors, as I am no speech/english major. :) Thanks. Now on to the HowTo...

Adding "Images & Images That Expand Into New Windows".

Ok, first of all, we're going to cover adding images to webpages. It's quite easy now since J has added the cool webpage editor.
In the "Manage" box to the right, select "Website".
From "Website", select the car you wish to edit the page(s) of (if you have more than one car).
Once the desired car is selected, choose the page you wish to edit.
Now that the desired page to edit has been selected, you will see a cool webpage editor. In this editor, scroll to the area where you would like to add your image.
Click where you would like your image and then click on the "Insert/Edit an Image..." icon from the buttons at the top of the webpage editor.
This will open a wizard to help you insert the image. Just select your image and configure the settings, then press "OK".
[NOTE!!: your images must be hosted on a server as you must have the URL for this to work. You can either upload the images here, or another site, but you must have the full and correct URL for this to work properly. It should resemble the code that follows:

Once done, you should have a nice image sitting in your page.

If you were to look at the code for the image we just inserted in the "HTML CODE" view of the webpage editor, you would see something like this:
<img src="http://www.gotstang.com/0905/W3bMa5t3r/createdbyw3bma5t3r.gif" border="0">

Now... On to adding "Images That Expand Into New Windows.

This will cause an image that is linked to a large image, to open in the same window when clicked. If you would prefer it opens in a new window ( I do so I can continue to listen to the music on the site while looking at picture and not hearing the beginning of a song 20 times) this is what your code needs to look like. Just go into the "HTML CODE" view (buttons at the bottom of the webpage editor) and make the simple change. You are going to add a LINKING URL (links the samll image to the larger image) in front of the image URL. Just like the image URL, you need to make sure you have the LINKING URL correct, pointing to the larger image.

<a href="/http://www.gotstang.com0905/W3bMa5t3r/createdbyw3bma5t3r.gif" target="_blank"></a><img src="http://www.gotstang.com/0905/W3bMa5t3r/createdbyw3bma5t3r.gif" border="0">

That's all there is to adding "Images & Images That Expand Into New Windows". :) Enjoy and I hope this helps. If you have any questions feel free to ask. I will be doing each section one at a time so look for more to come... Later...
W3bMa5t3r :beerchug: