Shop Mobile More Submit  Join Login
Not-So-Basic Journal Template by quinnypin Not-So-Basic Journal Template by quinnypin
A more advanced version of my Basic CSS Journal Template.

Use ^thespook's reference to find out what each of the sections means.

Click Download to get the text file to edit. Then once you have edited it and deleted all the [square bracketed comments], paste the code into the CSS part of your journal.

This feature is for subscribers/seniors only.

If you use this please comment and let me know, for no other reason than I'm nosy and want to see what people do with it. ;)



Change the colour properties to the hexadecimal code of the colour of your choice.

Change the font-size properties to whatever font size you want in each section. The size is in pixels: leave the "px" in place.

Font-family simply means the font itself, i.e. Courier, Times New Roman, Verdana etc. It is best to use a common font and not one you have downloaded - if other people don't have that font installed on their computer it will not display.

All of the other properties have a list of variables next to them. Pick the one you want, replace that where the ------ is, and delete the square brackets with the list of variables in it.

It should be obvious from this template that if you want a property to change only in one section, move the relevant line of code into that section between the {curly brackets} making sure to include the semi-colon (;) at the end of the line. For example, if you want a background image to appear behind your journal text but not your journal title or comment links, put it under .journalbox .journaltext

If you have any questions at all or you just need a little help, please feel free to note me and I'll be happy to give assistance.

Likewise if I've missed any important properties in here or there's something you want to change about your journal which isn't in this template, drop me a line and I'll see what can be done.
Add a Comment:

The Artist has requested Critique on this Artwork

Please sign up or login to post a critique.

Mythic-Flame Featured By Owner Nov 3, 2014  Hobbyist Digital Artist
i had this:

CSS Error:
Forbidden property (token: .journalbox .journaltext A)

come up? how can i fix it?
aubrelyn13 Featured By Owner May 27, 2013  Student Artist
I used it and my journal is colorful but i didn't see my background!
Skye-Sweet-Author Featured By Owner Mar 30, 2013  Student General Artist
Used it here : [link]
Black-Parade-Kitty Featured By Owner Aug 11, 2012  Hobbyist General Artist
This helps a lot! Thank you so much!
Ealaine Featured By Owner May 31, 2012  Hobbyist Digital Artist
Thanks for the effort of creating and sharing this. This will help a lot! :love:
Dactik Featured By Owner Apr 12, 2012  Student Filmographer
Thanks for providing this, but I'm a complete idiot when it comes to this stuff... I've used the code you've given, deleted everything in square brackets and added the hexadecimal codes (a few different shades of purple), but the journal just looks like this: [link] What's wrong? :rose:
Dactik Featured By Owner Apr 12, 2012  Student Filmographer
Never mind, got it working. (;
xXChibiStarrXx Featured By Owner Feb 9, 2012  Student Writer
Thank you! This helped me out so much!
Nefarious069 Featured By Owner Aug 6, 2011
Thanks for sharing this. Used it HERE
Clockwork-spindle Featured By Owner Jun 18, 2011  Hobbyist General Artist
Hey... justa wondering, how do you put an image in the journal backround? (noob at this hehe...)
ShiverSong Featured By Owner Apr 24, 2011
Why put the comments in square brackets when you can use the multi-line (/* */) CSS comments? Then people could leave them in if they really wanted and you wouldn't have the square bracket issue. Regardless, a nice resource for people new to CSS and journal styling.
quinnypin Featured By Owner Apr 24, 2011  Student Writer
Because at the time - not sure if this is still the case - DA's system wouldn't accept CSS with /* comments */ in it.
ShiverSong Featured By Owner Apr 25, 2011
Ah, cool, I just wondered why, :).
Rooncakes Featured By Owner Apr 10, 2011
I used this and it was so very helpful! Thank you! <3
OtakuMutt Featured By Owner Feb 28, 2011  Student Digital Artist
I'm ganna try and use it, but I fail at the computer codes and such XD
Thanks for all the help!!
Ealaine Featured By Owner Feb 7, 2011  Hobbyist Digital Artist
A great help! Thank you!
MizAmy Featured By Owner Feb 1, 2011  Professional Digital Artist
This is going to Help me so much thank you :heart:
privee Featured By Owner Dec 3, 2010
I;m gonna use it! i'll post the link when i'm finished with it :D
RecklessShameless Featured By Owner Oct 24, 2010
Thanks very much for this! I have a question though, you know some journals have those 'sections' for the groups or stamps images? Is there a certain code for it?
as-red-as-fire Featured By Owner Sep 1, 2010
Thank you very much for this template! I used it here.
Phantom-Wolf42 Featured By Owner Aug 29, 2010  Hobbyist Traditional Artist
How can I change the font, colour and size of the header and footer separately to the main content? As far as I've got it, they all follow each other.
Phantom-Wolf42 Featured By Owner Aug 29, 2010  Hobbyist Traditional Artist
Tarantulady Featured By Owner Aug 21, 2010  Hobbyist Artist
Excellent work, this.
BitterSweetDrug Featured By Owner Jul 30, 2010  Hobbyist Traditional Artist
Thank you so much for this :heart:
I had no idea about CSS and you not so basic template helped me a lot~!
*Has skin now* :3~
Russockshitha Featured By Owner Jul 28, 2010
I will have fun playing around with this.
SAWeston Featured By Owner Jul 9, 2010  Hobbyist General Artist
Thanks for the template. It was very helpful. I have made one journal design, and my make more in the future.
Warchamp7 Featured By Owner Jun 19, 2010  Hobbyist Digital Artist
Uhhh.... Why did you put your comments in square brackets instead of as actual comments? :\

Also, all the ------ is a real pain :(
quinnypin Featured By Owner Jun 21, 2010  Student Writer
Because deviantART doesn't allow 'actual comments' in CSS journal skins so I had to make it obvious that it has to be deleted before submitting.
Patto-san Featured By Owner Feb 2, 2010
D: just noticed ti doesn't look right in other browsers DX it only looks right in Explorer... any advice?
Patto-san Featured By Owner Jan 29, 2010
Thanks a lot for making this :glomp:! It was very useful ♥ I used it here: [link] : D!

And, well, I don't know if you let this on purpose, but there are not variable examples in journalbox "journaltext A:hover" and "journalbox .journaltext A:visited" :3
Za-Baka-Ookami Featured By Owner Jan 10, 2010
I was just about to use it then I said "Wait, I have no use for making one right now OTL";;;
InuRyoko Featured By Owner Jan 1, 2010  Professional General Artist
I am attempting to use your template but I am having some issues. I am trying to use Lucida Handwrit but It wont work. Nor will any other font I am trying to use...
Also getting the image how I want it is not working so well either.

I did HTML a few years ago and I am trying to reteach myself.

Ty Ty for this awesome template!

LeonSpires Featured By Owner Dec 21, 2009  Professional Traditional Artist
I just wanted to let you know that this was very helpful for me in creating my first CSS journal.[link] Thanks =)
Panda-Lollipop Featured By Owner Dec 17, 2009
This was amazingly helpful for someone like me who has no CSS experience at all
Thank you so much for sharing it
ManaMiyahara Featured By Owner Dec 17, 2009  Hobbyist Traditional Artist
This even better :D
angelnablackrobe Featured By Owner Dec 16, 2009  Hobbyist General Artist
thank you so much for this wonderful template. It helped me out sooooo much. If you would like to take a look at the journal I created from it.

again thank you :huggle:
iRock1414 Featured By Owner Nov 24, 2009
The template part seems entirely fantastic,
But whenever I download it I just get the picture :(
tinkerbelcky Featured By Owner Nov 11, 2009  Professional General Artist
I appreciate this so much, it saved me so much time trying to figure out the CSS on my own. Thank you!
Meerkatgirl Featured By Owner Nov 9, 2009  Student Digital Artist
I've been trying these CSS background, now that November give you a free chance. I've gotten what I want to work. Everythign but the background.

I'd just like to have the chosen picture at the bottom. But It always repeats itself and when I place in "Background-repeat:no repeat;" It dosn't worl Or when I place it under a specific position.

Is there a way to fix that or something else I need to do?
quinnypin Featured By Owner Nov 11, 2009  Student Writer
The "no repeat" bit needs a hyphen - background-repeat:no-repeat;.
xXxDiamondxXx Featured By Owner Oct 26, 2009  Student General Artist
:+favlove: Yay!! Thank you so much for the time you have put into this to make it easier for us!!:star::star::star::star::star:
littlemisssunshine11 Featured By Owner Jun 17, 2009  Hobbyist General Artist
This was seriously useful, thank you so much! I had no issues what so ever with the skin :)
SiSero Featured By Owner May 28, 2009  Professional Traditional Artist

thank you sooo MUCH for creating this!! it was so incredibly useful and easy to understand!!! ; U ; it totally cleared things up for me and i was finally able to redo my journal because of it XD

i have one issue with css and hoped that you'd be able to help me :thanks:

i love the link css you provided because i can make my links blink, change color when you hover over them, and have them change color again after they've been visited.

however, the link i clicked on the make sure it worked has not returned to it's original color and does not change color when you hover over it :( i asked my fiance' if this was the case on his computer. he said "yes" and he's in a different state than I am ^^;

is there anything i can do to make that link go back to normal even after it's been visited??

these are 2 of the sections i've used (you already know this obviously XD)
.journalbox .journalbottom A:hover
.journalbox .journalbottom A:visited

thank you so much for your help and your patience! i seriously appreciate it!! :hug:
yeahswingit Featured By Owner Apr 23, 2009
Totally using!
ColorCosmosFlurry Featured By Owner Apr 3, 2009  Professional Digital Artist
This has been SOOO helpful to me! Not only does it help me design my own journal CSS (Still in progress), but it helps me personalize the coding of the designs other people have given out. THank you so much for this. ^^
foggyday Featured By Owner Mar 7, 2009
This will help immensely. Thank you for providing a resource.
shooshooky Featured By Owner Mar 4, 2009
This was very helpful, thank you for making it ^_^ I used it here [link] it looks simple, and that's just how I wanted it, and got it, thanks to the guide. :)
TheDeviantIndigo Featured By Owner Feb 6, 2009  Professional Photographer
All I have to say is, is, yayyyyyyyyyyyyyyyyyyyy

Finally I found a CSS that actually works! Sheeeeesh

I have been subscribed forever, and I stink at CSS, I've tried many free ones on dA, and followed directions to a T, yet none of them worked until this one and your basic one. Thanks so much :)

I haven't picked out a background image to use yet, so if you go and see my page thats why it looks like the basic one kinda :P, once I pick out a background image I'll put it in :)
TheDeviantIndigo Featured By Owner Feb 6, 2009  Professional Photographer
oh! and I featured this :) [link]
divastar1234 Featured By Owner Feb 3, 2009
...nevermind...ignore my last comment... ^^; I figured it out...
Add a Comment:

:iconquinnypin: More from quinnypin


Submitted on
September 27, 2006
File Size
8.9 KB


69,013 (1 today)
1,178 (who?)