HOME | DD

Published: 2009-05-15 01:15:08 +0000 UTC; Views: 54037; Favourites: 1312; Downloads: 711
Redirect to original
Description
DOWNLOAD FOR FULL VIEWHow to upload Journal Skins
How to make and share ready to use journal skins on deviantArt is a tutorial that should help you getting started in uploading your skins to the deviantART Related / deviantART Skins & Scripts / Journal & Gallery Skins / Installable Journal Skins
section on deviantArt.
In this section you can find CSS journals to use and can easily install them by pressing on the install button. Why not give it a try?
THE "PRE CODE":
updated: November 11, 2012
Need more help?
I started learning CSS with w3scools.com and `NyssaB 's CSS Rundown + Template . Other useful tutorials with updated CSS including gruze is explained in `ginkgografix 's tutorials section that I highly recommend you check out here!
But I want to learn how to code CSS now:
Community Help
Share this and
Still confused?
FAQ #67: How do I share Journal Skins?
FAQ #892: What is the file format for Journal skins?
FAQ #62: How do I use Journal skins?
Related content
Comments: 503
Kjherstin In reply to ??? [2012-08-01 06:39:05 +0000 UTC]
Yes that is what you normally do. How else are you going to test your journal before submitting it anyway? They expect you to have a working CSS journal. Having the links in the CSS helps the transference easier for the installable journals. Of course you don't need those links if you share a CSS journal when you upload it to the 'deviantART Related / deviantART Skins & Scripts / Journal & Gallery Skins / Complete Journal & Gallery CSS' gallery
👍: 0 ⏩: 0
Oxdarock In reply to ??? [2012-07-28 21:20:21 +0000 UTC]
Hello. I'm very new to html and css. I've taken a couple of tutorials and understand most of the basics. I've even tried out some coding on Adobe Dreamweaver and it works just fine.
I've been trying some tests to see if I can upload a journal skin, but at the moment I'm stuck. I keep getting this message whenever I try to submit a txt file: "Forbidden property - .header {font-family" or something similar. I would like to know what exactly I am doing wrong. Here's a copy of what I try to submit:
The skin's header goes here
The skin's footer goes here
Besides that, I'm also confused as to how to code in background images as there doesn't seem to be a body tag. I kind of realize that this is an internal css, but like I said, I'm new to this. Any help would be appreciated, thank you.
👍: 0 ⏩: 1
Kjherstin In reply to Oxdarock [2012-08-01 06:53:46 +0000 UTC]
Well CSS journals on deviantART has more classes to code for than the code you just shared with me here. There are 2 ways of coding journals for deviantART:
1. Traditional CSS Method
2. Gruze Method
All of which code for different parts of the journal customizable parts. Coding CSS for a whole website is different from only a section of the page (Journal section) So you need to code for the different parts of 'their layout' to personalize their different customizable areas which not only includes the text area, header and footer. You also should code for the top, bottom and moodbox section at least (traditional CSS coding for DA) or the rounded corners for the gruze template.
Here you can understand the comparison with `ginkgografix 's tutorial [link]
There are plenty of links with templates for the customizable coding areas here on DA. I have shared the links to the Traditional Method called Cascading style Sheets which `thespook so kindly shared and the Link I put on this comment with both the traditional and Gruze method.
I hope that helps. Otherwise you can ask for help in the different CSS groups I have provided you with in the description
👍: 0 ⏩: 1
Oxdarock In reply to Kjherstin [2012-08-01 11:34:48 +0000 UTC]
Thank you for replying. I've actually gone over some of 's tutorials and have come to more of an understanding as to how CSS works in DA. I tried it out and it actually worked (yay!)
There are however a couple of major problems that I still have at the moment. Here's an excerpt from a note that I sent to :
The first problem is that I'm trying to add images to my journal skins. My idea at this point is to have a banner to use as a background for the header and to have a large image for the background of the whole journal (or journal text. I would prefer it if the background had a lower opacity, making it slightly translucent). My problem is that when I try to add an image path to my coding, no image shows up. Here is a copy of my coding:
.journalbox{
background-image: url(htp://25.media.tumblr.com/tumblr_m812dpd9Ru1rc0nl8o1_1280.jpg);}
*Because this is a DA note, I had to remove one "t" from "http" for you to see it, but the link works.
I've tested the paths of two images: one on my Tumblr and on from on of my DA pictures. I've confirmed that both work.
[link]
[link]
I would like to know if there is a problem with my coding. Something that I'm doing wrong since I'm still a beginner.
My second problem is the addition of new classes in the CSS. I'm unsure of how to add them. What I mean is, the CSS needs to apply them to some form of HTML correct? If so, then where do you add the HTML coding? Does the CSS work as an internal style sheet? And how would the CSS be able to read that accurately? For example, in your "Pink Border" tutorial, how did the browser know where to put the divider?
My reason for asking the second question is because I'd like to add links to the CSS similar to this journal:
[link]
I like the way that the links at the bottom are a part of the journal skin.
I appreciate any help greatly.
👍: 0 ⏩: 1
Kjherstin In reply to Oxdarock [2012-11-16 08:31:51 +0000 UTC]
Oh my gosh so much time has passed and I did not answer you. I'm sorry. I hope everything is sorted now if not, let me know
👍: 0 ⏩: 1
Oxdarock In reply to Kjherstin [2012-11-16 14:04:45 +0000 UTC]
It's fine. I figured it out. Thanks fo answering tho.
👍: 0 ⏩: 1
MADlSASTER In reply to ??? [2012-07-27 08:14:37 +0000 UTC]
I don't understand one thing, what should go in "footer goes here" and "header goes here"??? I know what a header and footer is, but what kind of code? I mean, the footer and header is already in the whole CSS code...
👍: 0 ⏩: 1
Kjherstin In reply to MADlSASTER [2012-07-28 07:31:46 +0000 UTC]
The header and footer code required for submiting your CSS journal is not the code from the 'Skin CSS' under Options but yes 'Skin Header' window . You have to make that code come with the installable version for it to work so you have to copy all that HTML stuff into the submission's text file separately. So where it says "header goes here", replace that text with the HTML code you use for your CSS journal; just like you see in my example: [link]
If you did not add a HTML code for your header and footer, then just delete the text: "header goes here" and "footer goes here" respectively.
When coding in CSS, you can code for a header or a footer but for it to show up in your journal entry, you have to call for it to appear and that you cannot do unless you use HTML and you can only use HTML in your Header, Footer and Journal Entry. So answering your last question: No the Header and Footer is not in the whole CSS code. CSS is one thing and HTML is something elsew
👍: 0 ⏩: 0
Destinyforestwarrior In reply to ??? [2012-07-19 01:36:42 +0000 UTC]
👍: 0 ⏩: 1
Kjherstin In reply to Destinyforestwarrior [2012-08-01 07:01:00 +0000 UTC]
You have to make the code yourself. I have links to the CSS syntax needed for coding in my description. Otherwise you can just install CSS journals made by the many designers/coders on DA
👍: 0 ⏩: 1
idzaf In reply to ??? [2012-07-06 05:17:45 +0000 UTC]
Thanks, I decided to upload my own journal skin. You're such a great helper!
👍: 0 ⏩: 1
DragonShinyFlame In reply to ??? [2012-07-05 20:05:25 +0000 UTC]
I cant submit!
The page showed this:
"The CSS in the file you have uploaded could not be validated.
Forbidden property - goes"
What can I do?
👍: 0 ⏩: 1
Kjherstin In reply to DragonShinyFlame [2012-08-01 07:03:16 +0000 UTC]
Sorry for the late reply. Well I think maybe that the area of your precode has been uploaded incorrectly. Send me a note so I can verify it with you
👍: 0 ⏩: 1
DragonShinyFlame In reply to Kjherstin [2012-08-02 00:54:23 +0000 UTC]
oh!! no problem! ^^ i dont need it! xD
👍: 0 ⏩: 1
Ace-Hyperhandshockz In reply to ??? [2012-06-28 01:27:52 +0000 UTC]
how can i get the CSS code? its confusing in that part..
👍: 0 ⏩: 1
Kjherstin In reply to Ace-Hyperhandshockz [2012-08-01 07:04:52 +0000 UTC]
The CSS code has to be written by you. This is a tutorial to help coders upload their journal designs to share with other members
👍: 0 ⏩: 1
Ace-Hyperhandshockz In reply to Kjherstin [2012-08-02 01:17:26 +0000 UTC]
oh but i dont know how to write a CSS code? do yah know how?
👍: 0 ⏩: 1
Kjherstin In reply to Ace-Hyperhandshockz [2012-08-03 07:20:33 +0000 UTC]
I think so, yes :giggles: Got over 50 CSS journals in my gallery now
👍: 0 ⏩: 1
Ace-Hyperhandshockz In reply to Kjherstin [2012-08-04 07:25:45 +0000 UTC]
cool!! now im talkin' to the master!! hehe : ) can yah teach me how? i really dunno how O.O
👍: 0 ⏩: 1
Kjherstin In reply to Ace-Hyperhandshockz [2012-08-04 12:20:45 +0000 UTC]
I wouldn't go as far as to call myself a master but the best place to learn CSS is at w3scools.com but I have more links from deviantART too to get you started
👍: 0 ⏩: 1
Ace-Hyperhandshockz In reply to Kjherstin [2012-08-07 05:05:05 +0000 UTC]
yeah, but its better to learn from someone who has experience in it..
👍: 0 ⏩: 1
Kjherstin In reply to Ace-Hyperhandshockz [2012-08-07 13:10:30 +0000 UTC]
The links I share are from the masters
👍: 0 ⏩: 0
little-space-ace In reply to ??? [2012-06-28 00:35:56 +0000 UTC]
This is very helpful, except what is your CSS code? How do you get one?
👍: 0 ⏩: 1
Kjherstin In reply to little-space-ace [2012-08-01 07:06:06 +0000 UTC]
You have to code your own. This tutorial is to help coders share their CSS designs with other DA members. If you cannot code your own you can use the ready made ones
👍: 0 ⏩: 1
little-space-ace In reply to Kjherstin [2012-08-09 23:48:35 +0000 UTC]
Oh, thanks I know now, I'm starting to get it and this is helping me ^^
👍: 0 ⏩: 1
Kjherstin In reply to little-space-ace [2012-08-10 07:52:07 +0000 UTC]
Oh that's just great. it's always a great feeling to know that you have helped someone in some way
👍: 0 ⏩: 1
ladybugging In reply to ??? [2012-06-27 21:24:46 +0000 UTC]
Hey, I know this is not the tutorial's subject, but... could you explain me how does all this comission stuff go? I need points like crazy!!
👍: 0 ⏩: 1
Kjherstin In reply to ladybugging [2012-08-01 07:07:57 +0000 UTC]
Well it's all very personal. It depends on how much you want to earn. I personally do not code for points, so I can't really say but I normally coded for $25 through paypal.
👍: 0 ⏩: 1
Silver-moon123 In reply to ??? [2012-06-17 12:40:11 +0000 UTC]
how did you get to: submitting your code?
👍: 0 ⏩: 1
Silver-moon123 In reply to Kjherstin [2012-06-22 10:01:36 +0000 UTC]
nevermind... I know now...
👍: 0 ⏩: 1
Kjherstin In reply to TDIGeoff-jessie [2012-06-22 08:56:41 +0000 UTC]
Yes you need a membership to use a journal skin but not to submit one, although it's not wise because you should always test them
👍: 0 ⏩: 0
RenSStudios In reply to ??? [2012-06-08 22:29:27 +0000 UTC]
ok ive tried a million times but i still cant submit it, i need help
👍: 0 ⏩: 1
Kjherstin In reply to RenSStudios [2012-06-11 16:50:27 +0000 UTC]
Can you tell me the exact error message you get after your submission fails please?
👍: 0 ⏩: 0
Red-Roses-1327 In reply to ??? [2012-04-23 07:17:14 +0000 UTC]
How do you actually make journal skins?
👍: 0 ⏩: 1
Kjherstin In reply to Red-Roses-1327 [2012-04-23 07:40:26 +0000 UTC]
I code them using a text editor
👍: 0 ⏩: 1
<= Prev | | Next =>