HOME | DD
JenFruzz — How to DeviantArt: Journals!
#eclipse #editor #features #journal #learn #teach #tutorial #how
Published: 2019-09-26 00:09:12 +0000 UTC; Views: 52122; Favourites: 236; Downloads: 0
Redirect to original
Description
body div#devskin13708779 .banned { text-decoration:line-through !important; opacity:.4; filter:alpha(opacity=40); _zoom:1; } body div#devskin13708779 .gr-box { font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; font-size:1em; position:relative; padding:0px; overflow:visible !important; margin:0 auto; background:#000; } body div#devskin13708779 .text { padding:0 16px 0; max-width:700px; margin:auto; line-height:1.5em; } body div#devskin13708779 .shadow { padding:0 !important; } body div#devskin13708779 i.gr1 { display:none; } body div#devskin13708779 i.gr2 { display:none; } body div#devskin13708779 i.gr1 i { display:none; } body div#devskin13708779 i.gr2 i { display:none; } body div#devskin13708779 i.gr3 { display:none; } body div#devskin13708779 .gr-top { padding:0px; margin:0 auto; width:auto; border:0; background-color:transparent; height:280px; font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; } @media only screen and (max-width: 767px) { body div#devskin13708779 .gr-top { height:180px; } } body div#devskin13708779 i.tri { display:none; } body div#devskin13708779 .gr-top .gr { background:transparent; padding:40px 0px 20px !important; display:block; position:absolute; border:none; bottom:0; width:100%; background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%); background:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%); } body div#devskin13708779 .gr-top h2 { font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; font-size:4em; font-weight:normal; color:#fff; line-height:1.2em; max-width:700px; padding:0 16px .1em; margin:auto; } @media only screen and (max-width: 767px) { body div#devskin13708779 .gr-top h2 { font-size:3em; } } body div#devskin13708779 .gr-body h1 { color:#000; font-size:1.8em; font-family:inherit; font-weight:normal; text-shadow:0px 1px 1px white; } body div#devskin13708779 .gr-body h2 { color:#000; font-size:1.5em; font-family:inherit; font-weight:normal; text-shadow:0px 1px 1px white; } body div#devskin13708779 .gr-body h3 { color:#000; font-size:1.3em; font-family:inherit; font-weight:bold; text-shadow:0px 1px 1px white; } body div#devskin13708779 .gr-body h4 { color:#000; font-size:1.1em; font-family:inherit; font-weight:bold; text-shadow:0px 1px 1px white; } body div#devskin13708779 .gr-body h5 { color:#666; font-size:1.1em; font-family:inherit; font-weight:bold; text-shadow:0px 1px 1px white; } body div#devskin13708779 .gr-top h2 { color:#fff; } body div#devskin13708779 .gr-top h2 a { color:#fff; } body div#devskin13708779 .gr-top h2 a:hover { color:#fff !important; } body div#devskin13708779 .gr-top h2 img { display:none; } body div#devskin13708779 .gr-top h2 input { border-width:0 !important; } body div#devskin13708779 .gr-top h2 input:focus { outline:none; } body div#devskin13708779 .gr-top h2 ::-webkit-input-placeholder { color:#fff; } body div#devskin13708779 .gr-top h2 ::-moz-placeholder { color:#fff; } body div#devskin13708779 .gr-top h2 ::-ms-input-placeholder { color:#fff; } body div#devskin13708779 .gr-top span.timestamp { background:transparent; font-size:1.3em; color:#A6ACA9; white-space:nowrap; z-index:1; display:block; padding:0 16px; color:rgb(255, 255, 255); color:rgba(255,255,255,.5); max-width:700px; margin:auto; } body div#devskin13708779 blockquote { padding-left:2em; margin-left:2em; border-left:2px solid #ccc; } body div#devskin13708779 .gr .author .gr .author a { display:block; color:#196bb0; text-shadow:0px 1px 0px #a7a5a5; font-size:11px; font-style:italic; line-height:14px; margin-top:10px; } body div#devskin13708779 .gr-body { background:#fff; border:0 !important; font-size:1.3em; overflow:visible !important; position:static; } body div#devskin13708779 .gr-body .grf-indent { background:transparent; } body div#devskin13708779 .gr-body .gr { border:0 !important; position:static; } body div#devskin13708779 .gr-body .bottom { background-color:#fff; padding:2em 16px; max-width:700px; margin:auto; text-align:left; font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; } body div#devskin13708779 .gr-body .bottom a { color:#000; } body div#devskin13708779 .gr-body a { color:#159; } body div#devskin13708779 .gr-body a:hover { color:#37b !important; } body div#devskin13708779 .gr-body .bottom a.commentslink:hover { text-decoration:none; } body div#devskin13708779 ul.list { height:0; width:0; clear:both; visibility:hidden; } body div#devskin13708779 .textwrap { margin:0 0 -16px; } body div#devskin13708779 .text br:first-child { display:none; } body div#devskin13708779 .highlight { background-color:#ef7; display:inline; } body div#devskin13708779 .box { background-color:#f3f3f3; border-radius:.2em; -moz-border-radius:.2em; -webkit-border-radius:.2em; padding:.4em .6em; } body div#devskin13708779 hr { border-top-width:0; border-left-width:0; border-right-width:0; border-bottom:1px solid #e6e6e6; height:1px; } body div#devskin13708779 .writer { border-width:0; overflow:visible !important; } body div#devskin13708779 .textwrap textarea:focus { outline:none; } body div#devskin13708779 .skin_credit { font-size:1em; color:#ccc; float:right; margin-top:2em; } body div#devskin13708779 .skin_credit a { color:inherit !important; text-decoration:underline !important; font-weight:normal; } body div#devskin13708779 .embedded-image-deviation { line-height:0; } body div#devskin13708779 .cover { position:absolute; top:0px; left:0px; height:280px; overflow:hidden; width:100%; line-height:0; box-shadow:0 0 30px rgba(0,0,0,.3) inset; -moz-box-shadow:0 0 30px rgba(0,0,0,.3) inset; -webkit-box-shadow:0 0 30px rgba(0,0,0,.3) inset; } body div#devskin13708779 .cover_bottom { position:absolute; top:0px; left:0px; height:280px; overflow:hidden; width:100%; line-height:0; box-shadow:0 0 30px rgba(0,0,0,.3) inset; -moz-box-shadow:0 0 30px rgba(0,0,0,.3) inset; -webkit-box-shadow:0 0 30px rgba(0,0,0,.3) inset; } @media only screen and (max-width: 767px) { body div#devskin13708779 .cover { height:180px; } } @media only screen and (max-width: 767px) { body div#devskin13708779 .cover_bottom { height:180px; } } body div#devskin13708779 .cover a { width:100%; } body div#devskin13708779 .cover img { margin-top:0%; width:100%; } body div#devskin13708779 .cover_bottom a { width:100%; height:100%; } body div#devskin13708779 .cover_bottom img { position:absolute !important; bottom:0; margin-top:0%; width:100%; } body div#devskin13708779 .cover > a.embedded-deviation.embedded-image-deviation:after { content:'Check The CR group'; position:absolute; top:0px; right:0px; font-size:.8em; font-weight:normal; padding:.4em .4em; color:rgb(255, 255, 255); color:rgba(255,255,255,.7); background:rgb(0, 0, 0); background:rgb(0, 0, 0); background:rgba(0,0,0,0.2); z-index:99; display:inline-block; line-height:1em; border-bottom-left-radius:3px; -moz-border-bottom-left-radius:3px; -webkit-border-bottom-left-radius:3px; } body div#devskin13708779 .cover_bottom > a.embedded-deviation.embedded-image-deviation:after { content:'Check The CR group'; position:absolute; top:0px; right:0px; font-size:.8em; font-weight:normal; padding:.4em .4em; color:rgb(255, 255, 255); color:rgba(255,255,255,.7); background:rgb(0, 0, 0); background:rgb(0, 0, 0); background:rgba(0,0,0,0.2); z-index:99; display:inline-block; line-height:1em; border-bottom-left-radius:3px; -moz-border-bottom-left-radius:3px; -webkit-border-bottom-left-radius:3px; } body div#devskin13708779 .cover:hover > a.embedded-deviation.embedded-image-deviation:after { content:attr(href); color:#fff; background:rgb(0, 0, 0); background:rgba(0,0,0,0.3); } body div#devskin13708779 .cover_bottom:hover > a.embedded-deviation.embedded-image-deviation:after { content:attr(href); color:#fff; background:rgb(0, 0, 0); background:rgba(0,0,0,0.3); } body div#devskin13708779 div.ccwriter-wrapper.expanded { position:static; } body div#devskin13708779 div.ccwriter-content { position:static; } body div#devskin13708779 .ccwriter-shadow { border-width:0px !important; }
Yes. At long last we are diving into the world of Eclipse journals! Prepare yourselves because this tutorial may beat them all as far as length goes. And by "beat" I mean it's gonna be longer...
Much longer.
Here is why this tutorial will rule them all:
- Where to Find Submitted Journals and Drafts
- Where to Create Your Journal
- Dissecting the Journal Editor
- Cover Images!
- Formatting Text
- Adding and Formatting Media
- Submitting Your Journal
Where to Find Submitted Journals & Drafts
As Julie Andrews once sang, "Let's start at the very beginning..." and tell you where to find journals by both yourself and anyone else on DA. It's quick, it's easy, and that's why it's first. Just navigate to someone's profile and check out their Posts page. Then click Journals. BOOM!
Similarly with Drafts, navigating to that link (which you can only see on your own profile!) will take you to drafts that you have saved (more on that below) and want to continue writing (and here is a final, unnecessary parenthetical). WHOOSH!
Where to Create Your Journal
You are able to begin writing your journal no matter where you are on DA. Just hover over the Submit drop-down and, you guessed it, click on Journal. Away to the editor we go!
And voila, you have reached Eclipse's journal editor. A significant change from DeviantArt green to Eclipse is the centralizing of DA's word processor. While on the old site you could write journals from sta.sh or the journal page, Eclipse brings everything to one easy-to-find spot.
There are a lot of pieces to the journal editor page. We'll pick them apart in the next section...
Dissecting the Journal Editor
OBSERVE. The editor page:
1. Status Updates i
2.Current Status and Save Status
3. Featured Post option ii
4. Save as Draft (saved to the Draft page above)
5. SUBMIT! iii
6. Title Section
7. Text area iv
And the footnotes:
i: If you find your journal is SUPER short, you can easily change it to a status update !
ii: Selecting Featured will add your Journal to the Featured column on your Posts->Journal page! A great place for showcasing the journals you want people to see first.
iii: More on this at the end.
iv: Let your genius unfold.
Now that we have the lay of the land, we need to chat about Cover Images. Carry on, traveler!
Cover Images
Eclipse's journal editor allows you to very easily add a cover image (note: this is optional) to your journal. This can have a variety of uses. Whether your journal is part of a regular series (using the same cover image) or you want to feature an amazing artwork that caught your attention (hello generous curators!) the cover image is a great way to make your journal pop.
Simply click the "Add Cover" button and select an image from your gallery or sta.sh:
Formatting Text
Text formatting is a great way to call attention to a particular word, emphasize your very important points, and separate sections of really, really long Eclipse tutorials. 
And it's super easy to boot. Just highlight the word or group of words you want to format. Once highlighted, a window will appear with a variety of options allowing you to make text bold, italicized, underlined, or two different styles of header (T1 and T2).
You can then go wild and turn your unorganized thoughts into an efficiently numbered or bulleted list! And if you're quoting someone profound (like me 
Words are great, especially for the lit types, but when you're looking to add some visual flair to your journal... WHO YOU GONNA CALL?
Why, Mr. Rogers, of course! (just keep reading)
Adding and Formatting Media
For the curators and art appreciators of DeviantArt, you may want to include visual or literature artwork to your journals. This is a great way to break up longer sections of text or even focus in on a central theme or idea you're hoping to get across to those reading your journal!
Adding an Image
To begin, simply click the plus sign icon (this only pops up on a new line, it won't pop up on the same line as existing text) and select the Add Image icon.
Which brings you to a menu where you can insert an image from your gallery, collections, sta.sh, or somewhere else on DeviantArt. You can even upload a piece directly to your sta.sh from this menu.
Once you select your Mr. Roger's image, just click the green Select button at the bottom right and your image shall appear.
Formatting an Image
Clicking a single image (this will not work for galleries!) allows you several new formatting options for Eclipse's journal editor.
From left to right, the formatting options are a whole image, a left-aligned image, a right-aligned image, linking the image, changing it out, or removing it altogether. When aligning left or right, you'll notice things shift on the screen! You can format text to the opposite side of an aligned image. Have fun experimenting with these options.
Linking an ImageSometimes you will want to have the image you insert link the reader elsewhere. It could be a different DA page or anywhere else on the internet. But how do?! Click the image again to bring up the formatting toolbar, then select the link icon (you know, the icon that is literally two links). Once you do that, a window will appear that allows you to add a URL and create your linking image!
Adding GalleriesHead on back to the Linking an Image subsection. Remember that toolbar? Let's click the second icon, which is going to allow us to insert a group of images. Once you click it, you'll be presented with a menu that allows you to insert a gallery, collection, a group of images from sta.sh, or images from DeviantArt.
Let's select my APN Daily Deviations collection and get some images into this journal. Once you're inside a folder/collection/etc. just click the images you want to add. You'll see a tally (highlighted below) letting you know how many you've selected out of 24 max.
When you're done, click the green Select button.
Formatting GalleriesGalleries have their own set of formatting tools to easily fit a lot of images into one journal. Click any of the images to select the entire block. Then a toolbar appears with options to change the orientation of the gallery deviations, pick new deviations, or remove the gallery altogether.
*NOTE: Gallery formatting options only work when adding groups of images from a gallery or collection. This will not work if you're only adding individual images.
The first option is the default: Grid view. This will organize the deviations in two columns of equal width and height.
This can be ideal for many layouts but in some instances it may cut off an image (like the beheaded insect above) and you'll want to check out the Masonry option. This will orient the deviations according to their size, creating a mosaic of artwork instead of two columns.
Both options help artwork be displayed neatly and beautifully (with insect heads intact!). It is up to you which option fits your journal the best!
Adding Video, Emoticons, and GIFs:
The last three options when adding media are much simpler than images and galleries! Eclipse's journal editor finally gives us the chance to easily embed YouTube videos directly into a journal! Simply click the video player icon and insert the YouTube URL you want to display:
Emoticons and avatars can be easily added using the smiley face icon. A menu will appear with options to add Official emoticons, Community emoticons, or user avatars. You can also click the search icon and type something specific!
And finally the GIF menu. Just click and you'll be able to quick search for the proper GIF for any journal. In our case, creepy Mr. Rogers:
Clicking the arrows will let you select a new GIF while the trashcan will remove it. Which I am doing... now.
Bye, Mr. Rogers.
Submitting Your Journal!
Just click that big green SUBMIT button at the top and away it goes into uploaded Posts land 
What are some Eclipse-submitted journals that you love? Link them in the comments!
Questions?
If you have questions about cover images, please leave them in the comments! If you have general feedback about Eclipse, that is better left where staff will see it .
More "How to DeviantArt" Tutorials:
Skin by Dan Leveille
Related content
Comments: 681
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 2 ⏩: 0
👍: 4 ⏩: 0
👍: 2 ⏩: 0
👍: 0 ⏩: 0
👍: 3 ⏩: 0
👍: 2 ⏩: 0
👍: 3 ⏩: 0
👍: 0 ⏩: 0
👍: 3 ⏩: 0
👍: 0 ⏩: 0
👍: 1 ⏩: 1
👍: 0 ⏩: 0
👍: 1 ⏩: 0
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 1 ⏩: 0
👍: 1 ⏩: 0
👍: 2 ⏩: 0
👍: 5 ⏩: 1
👍: 1 ⏩: 0
👍: 3 ⏩: 0
👍: 1 ⏩: 0
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 9 ⏩: 2
👍: 2 ⏩: 0
👍: 4 ⏩: 0
👍: 0 ⏩: 0
👍: 1 ⏩: 0
👍: 0 ⏩: 1
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 0 ⏩: 1
👍: 0 ⏩: 1
👍: 0 ⏩: 0
👍: 0 ⏩: 0
👍: 1 ⏩: 0
👍: 0 ⏩: 0
👍: 1 ⏩: 0
👍: 1 ⏩: 0
👍: 1 ⏩: 0
👍: 1 ⏩: 0
👍: 4 ⏩: 0
👍: 1 ⏩: 0
👍: 1 ⏩: 1
| Next =>