Deviant Login Shop  Join deviantART for FREE Take the Tour

:iconmiontre: More from miontre


Submitted on
March 24, 2012
Image Size
1.7 MB
Submitted with


310 (who?)


Creative Commons License
Some rights reserved. This work is licensed under a
Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 License.

miontre has limited the viewing of this artwork
to members of the deviantART community only.

You can log in or become a member for FREE!

EDIT: This tutorial has been updated here.

:wave: I had some people ask how I made the layout for my light wonders Journal feature.
So I decided to make a tutorial so that everyone can learn :dummy:
If you've got any questions, feel free to ask :)

Here are the codes you'll need, for easy copy and pasting:
<a href="x"><img src="y" width="700">
<a href="x"><img src="y" height="200">

Important - When getting the links to the deviations (for x), make sure you use the method described in the Journal. Don't use any other link, like the one in your address bar or the link. If you do, people won't be able to drag your deviations to fave them!

Thanks to `GillianIvy's helpful comment, I found out another code which gives the same result and saves a lot of time:
<da:deviation id="p" width="q" />
Replace p with the numbers only in the deviations thumb, and obviously replace q with your width!
Please note it doesn't work with a height - but you can use it for width if you like! :)
Everything else is the same process, it just makes it easier to work with! :)

Centering Text / Deviations:
If you'd like to center your text and deviations, add this code to the very start of your Journal entry:
<div align="center">
If you're using to write your Journal, make sure you do this at the very last change to your Journal before publishing, otherwise it'll screw with your entire feature and you'll get very confused like I did! :)

Make sure you close it with </div> at the end of your Journal, otherwise you probably won't get it centered.

Thanks to my friends ~Catmagik, ~LeighNakamaru, ~shineyx, and ~xoLeighox! I used their photos in the tutorial because I knew they wouldn't mind :hug:

Journals made with this tutorial:
I'd appreciate it if you linked me to the features you write using this tutorial! :D
light wonders
Here are some amazing photos I found today! :+fav:
Please support the artists (and the hours I spent making this feature with cluttered HTML) with a favourite or comment on the news article! :)
feature week 13:rose: Thank you :iconwildrune11: for the wonderful tut <a href="x">
Square'ish. L
Please give a favourite to this news article. :pointr:

Squares. So simple, yet so stunning.

Here's a beautiful collection of squares. Go and fave them!

DreamyArt - March'12 Feature


 :heart: Please fave this Journal if you enjoy it, so we can spread these stunning artworks! :heart:
 "You see things; and you say, 'Why?' But I dream things that never were; and I say, 'Why not?'" 
Add a Comment:
I-Am-Cute Mar 13, 2014  Student General Artist
How did you make your text become a link? When you said comment, for example, how did it become a link?
Jubchili Jun 8, 2013  Hobbyist

PS- how did you make this tutorial? i want to make tutorials too, but idk how!
thanks for this!
miontre Jul 19, 2013  Hobbyist Photographer
I made an image in GIMP containing the text I wanted to say and screenshots etc. :)
I also wrote some tutorial writing tips, if you're interested:
Child-of-Minerva May 11, 2013  Hobbyist General Artist
This tutorial saved me XD I was trying to organize some pictures and it wasn't working so thanks for this!
Miontre, thanks so much for this tutorial! Thanks to your clear instructions I made my first ever journal feature with the html codes. It took a very long time! But it's here [link] - on city photography - street, architecture, cityscapes.

Thanks once again for your effort and generosity!
miontre Mar 28, 2013  Hobbyist Photographer
Thank you for the link! I am glad you found the tutorial easy to follow :D
IraeCoal Feb 6, 2013  Professional General Artist
How do you make words represent a link, like if I hover over light wonders, I can click it and it will link me there? How do you do that?
miontre Feb 6, 2013  Hobbyist Photographer
Just use this code:

<a href="URL">TEXT</a>

:) Hope that helps!
IraeCoal Feb 13, 2013  Professional General Artist
It worked! Thanks so much ^^
Add a Comment: