Get the most out of your journal (part 1)

5 min read

Deviation Actions

LineBirgitte's avatar
By
Published:
37.6K Views
Content in part 1
    Using <a> tags
    Using image tags




Using <a> tags.

How to link/make links
the <a> tag can used to make regular text links where you decide what the link will be called

Two kinds of links:

1) My Gallery: http://brgtt.deviantart.com/gallery/ will be displayed as:

My gallery: brgtt.deviantart.com/gallery/

2) <a href="http://brgtt.deviantart.com/gallery/">My gallery</a> will be displayed as:

My gallery

You can also put all kinds of other stuff inside <a> tags - like images, which will be explained further down in this journal ;)




Using image tags.

What is an image tag?

An image tag let's you put images (not thumbs) in your journal - like this:



the code to display an image is very simple and easy to remember:

<img src="imageurlhere" />

- so the image tag code consist of the actual tag (img) which holds the image url (the place online where the image is stored).

The image I used is stored here: http://th02.deviantart.net/fs51/300W/f/2009/262/5/6/Psychedelic_Studio___223_by_emperpep.jpg

I found it by going to to deviation, rightclicking it and selecting "copy image adress" - the image url is then copied to your clipboard and you can simple paste it into the image tag like this:

<img src="http://th02.deviantart.net/fs51/300W/f/2009/262/5/6/Psychedelic_Studio___223_by_emperpep.jpg" />

here's a visual on how to get the image url:



Image size

Ok so you got the image you want - but it's too big and takes up way too much space, and a thumb is too small for you.

Don't panic - you can simple tell the image tag how big the image should be.

If you set the height the width will follow automaticly and the same goes the other way around - BUT; if you set both of them you can stretch the image out of poportions - take a look at these four examples:

Width:200px

<img src="imageurlhere" width="200" />

Height: 200px

<img src="imageurlhere" height="200" />

Height: 200px, Width: 200px;

<img src="imageurlhere" width="200px" height="200" />

Huge thumbs
Ok - so you got an image in your journal now - but noone knows where to go to fave it! :noes:

There are a number of ways to let people know, you could simple tell them who made it and that they can find it in her gallery. But really - that's a lot of work, and a thumb they could simply click or collect would be much more satisfying - so why don't we simply turn our image into a thumb? (remember this will only work with work from dA)

Copy the url of the original deviation;


We are now using the <a> tag to make our image a link (see top of journal to learn more about the <a> tag). By putting the image tag inside the <a> tag the image will act as a link:



<a href="deviation_url_here"><img src="image_url_here" width="200" /></a>

try collecting the huge thumb as if it was a regular thumb :eyes: - nifty aint it?




- can't figure out what any of this meant? Let me know so I know how to improve this guide and help you understand!

© 2009 - 2024 LineBirgitte
Comments266
Join the community to add your comment. Already a deviant? Log In
TastyMoonCheese's avatar
Your image tag code doesn't work. Please update this tutorial.