HOME | DD
cerena — CSS Journal Tutorial Part III
Published: 2009-07-17 05:15:26 +0000 UTC; Views: 27750; Favourites: 659; Downloads: 1259
Redirect to original
Description
Part I.Part II.
************
Journal CSS by ¢mindfuckx
************
UPDATED AGAIN!! - 8.1.09 - fixed the transparent background issue
First draft! -- This kindof sucks, so I will hopefully be updating this with a more clear version Edit -- code comments updated slightly.
Click "Download" for file that includes my test file and a commented version of the code -- that is half the tutorial after all.
So please excuse all the text in this part.And you need a subscription to use journal CSS, btw... @_@
Please be sure to include a link to this tutorial in your new journal layout in your credits!
This is the third and final part, long awaited! The other two parts deal with image preparation and planning, so be sure to check those out. If you find this tutorial helpful, please link back or favourite so other people can find it.
If you have any suggestions, questions or comments, post them! I love comments. Mmmm comments.This is less a "copypaste and it will work" kind of thing, more of a "use this to teach yourself something about CSS" kind of thing.
Which is why I have provided some basic CSS info links below.Now get out there and get journalin!
******
Helpful links
******
Lissa Explains - an INVALUABLE guide to CSS/HTML!! (read before asking CSS attribute questions, click "CSS" along the top bar)
DaFont.
CGTextures.
-----
Artwork and content © Cerena 2008.
Chamma Chamma girl (Devi) is here .
Related content
Comments: 114
I have a question that I can't find the answer to. How do you make a background transparent (Like a side menu) with out making the text and images transparent as well ?
👍: 0 ⏩: 0
I've read all the steps of your tutorial, and just to make sure I'm getting it right. This journal shows how you were able to take your own images that you make on Photoshop and make them a header?
I've read a LOT of tutorials and they have all said that you need to post your header, or any images, on Photobucket so you can copy and paste the html to the journal.
I want to be able to make my own headers... but do I have to post them on Photobucket to make it into a journal header? So again: does this tutorial show how to make your own headers without posting on Photobucket?
👍: 0 ⏩: 0
I keep getting lost, but most of this will come in very handy! (Maybe it's because I'm half asleep right now. xD) Anyways, thank you!
👍: 0 ⏩: 0
Mind if I ask do you know how to add a second scroll box into a journal skin? like an extra box for stamps and such, but on the bottom of the journal
👍: 0 ⏩: 0
Wow, thank you so much for making 3 awesome tutorials for this! : D I just got a subscription and had no idea how to even begin making a journal, but now I feel a lot more confident about it.
The websites you provided are great as well (Dafonts, CGTextures and Lissa Explains).
👍: 0 ⏩: 0
i'm sorry to bother you but can you tell me where to insert the backroung url (not the header url) ?because i keep trying and all i got is a transparent background
👍: 0 ⏩: 1
Look for something that says "background" (search for it using your notepad or whatever). Whereever that comes up, test each entry to see which one is the right one, but this should narrow it down. So much of what I did was trial and error to learn CSS! Please let me know if you have any more questions--I am just now getting back to DA after a long hiatus.
👍: 0 ⏩: 1
Thank you so much!and welcome back from hiatus!
👍: 0 ⏩: 0
God damnit, I tried these so many times and it just always goes wrong.
I have no idea where I fail, but I fail badly at some point.
👍: 0 ⏩: 1
This is so out of date! It might be easier to use a newer theme and then tweak it to your needs. Maybe I will have to try and make a tutorial for if/when I ever update my journal. I'll have to get a subscription to do so but I will post an update to this deviation if it happens! I'm so sorry this is so out of date!
👍: 0 ⏩: 0
Wow, this whole tutorial was very helpful and easy to understand!!
Very clear and going to try it out sometime soon. C:
Excellent job.
👍: 0 ⏩: 0
I don't know where in the code to put the background image for the body of the journal..
I only see places to put the header and the corner images.
Any help would be greatly appreciated.
👍: 0 ⏩: 0
Thanks a lot!
I learned a lot from your tutorial!
I've made my own journal skin thanks to you! <33
👍: 0 ⏩: 0
Hmmm It seems that my background image will not show up... Uh, I dont know whats wrong. The header shows but not the background.
👍: 0 ⏩: 0
Could you please tell me what the code is for making your header and journal box merge without getting any room in between? (Sorry if that sounded confusing. Maybe you should look at my journal to get what I mean.)
I want my journal to be like what you did with the cat-lady example (the first one with the journal name in front of it, not the second without journal name) in your tutorial. But I can't get it right. I tweaked and tweaked...butijustcan'tgetitriiiight
I've looked in Lissa Explains, but all of it is alien to me. D'X
👍: 0 ⏩: 0
How would one remove the text saying 'journal entry'? I can't find it lol
👍: 0 ⏩: 0
when I did the preview there was no bg just the header ?
👍: 0 ⏩: 0
Your tutorials are awesome but i have just one question...
I have a line between my header (the character) and the portion where i type. A gray line like the dA's bg 
I have tried lowering or getting it up but same thing.
Here's the link to my journal [link]
👍: 0 ⏩: 0
I found your tutorial super helpful
👍: 0 ⏩: 0
Overall this was a fantastic, thankyou for uploading! I'm not a natural at coding so it took me a few days to get this right. I still can't get the background of the main journal entry to be an image, however. It just covers the entire thing instead.
👍: 0 ⏩: 0
I'm having problems with my journal code. Could you look over and maybe tell me what I've done wrong?
When I go to write my journal there's no border outline and image
[link]
👍: 0 ⏩: 0
I'm still pretty confused. @_@ But I haven't coded in over a year so.
👍: 0 ⏩: 0
I mostly have trouble putting an image from my gallery into the CSS code for a topper.
👍: 0 ⏩: 0
I've wanted to make a CSS so bad, but... I can't understand any of this... 
Besides that, it looks like it's a great tutorial (if only I understood anything that it was talking about).
👍: 0 ⏩: 0
Very very useful! Thank you for creating this. I'm so happy I stumbled across this.
👍: 0 ⏩: 0
I was able to do some but this is just too confusing for me. I wasn't able to get my corners or background to show up. I may have to stick to premade. Thanks for the tutorial though :]
👍: 0 ⏩: 0
i read all the tutorials but i am still stumped i was wondering do you upload the stuff you made for the header online and then copy the link to the notepad where all the css codes are? just thought i'd check as I'm attempting to do my own journal css.
👍: 0 ⏩: 0
Thank you a lot for this tutorial!
I only have two issues: 
Any help would be very, very appreciated!
👍: 0 ⏩: 0
Excellent tutorial. Can't wait to make full use of this.
👍: 0 ⏩: 0
oh thank you so mucho for this! , I have a question D; how can I match the header image with the content? here a image to explain [link] thanks again!
👍: 0 ⏩: 0
I'm working on trying to figure out my own journal... I'll have to try this better when I have more time. It's so confusing TAT;;
But thanks for the help!
👍: 0 ⏩: 1
There's always [link] to help make a CSS much more easier ^^
👍: 0 ⏩: 1
i got the two first parts but this third one is really @_@ *sigh*
T..T i really want to make it work v...v"" help ?!
i swear it took the whole day i dont want it to go to waste
it's just these codes i dont understand what to put
where to put, or what to do v...v" help ? T.T
👍: 0 ⏩: 0
Okay, the coding has seriously got me. ;___;
I have no idea what URL's go where and where to put the colour things and gahhhh. D":
Somebody help please? :'c
All that text has confused me. *A*;;
👍: 0 ⏩: 1
srry i cant help u bcoz i feel EXACTLY the same way!
if you find out plz could you tell me
👍: 0 ⏩: 1
I'm glad I'm not the only one! D:
I can't figure it out ;__; sorry!
👍: 0 ⏩: 1
I LOVE this Tutorial, it is amazing!
~Lai
👍: 0 ⏩: 0
i dont get how the code tweaking thing goes when i saved the code, then opened it in notepad, it was all in computer text! im so confused!!
👍: 0 ⏩: 0
Hi, I'm having a problem with the header, the damn thing shows on top of the journal box, and I want it behind it, like yours. How do I fix it?
👍: 0 ⏩: 1
Uhm....
Well, I'm not totally sure off the top of my head what the right piece to change would be. It's been a while. Best thing I can tell you, and this is for ANYTHING you see on a website that you want to figure out, right click on a journal entry of mine that uses what you want to achieve and "view source" and compare code. That way you can also add and subtract things you want or don't need, by comparing code, just in general.
👍: 0 ⏩: 1
| Next =>