FREQUENTLY ASKED QUESTIONS

how do i edit a layout without knowing how to code?

i have to google an lj cut every single time i use one so don't think you have to know anything to be able to do this. the easiest way to overhaul a layout is to copy it exactly and view your work in another tab. once it looks exactly like the one you're working from go back to the tab you're editing in and start combing through piece by piece. i often open the friends page in another tab as well (and if you're working in a blank journal go and follow rps so that you have posts to look at) because a lot of layouts these days have edits to the friends page icons

highlight one line of code, copy it, erase it, and save your work. now go back to your layout tab and refresh. whatever isn't there anymore is what the code you have copied controls. go and paste it back in and edit it however you want that to look. it's easiest to add a /*tag*/ above the bits you've figured out so that you can go back to them later. whatever you put in these brackets will not show up in a layout.

if what you copied changes nothing about the layout or friends page then just leave it out. a lot of layouts i've stolen have had random unnecessary pieces of code in there. cleaning it up helps you understand what you're looking at

if something you've copied and removed changes multiple things, such as the timestamp as well as the navigation at the bottom as is often the case, look at the code and see if it contains two elements, such as .entrybox, .shadowed {. if you only want one of these removed, split them up by pasting the code back in twice and making one .entrybox { and the other .shadowed {, and then figure which is which by once again deleting and refreshing and then adjust whichever one you choose

how do i steal a layout i've found?

head over here to follow my guide or feel free to just ask me to do it!

how do i get making my own layout started?

moosh has provided a basic layout skeleton that you can paste in and insert things into:

she adds: i almost never use the post/comment link so the skeleton is missing the extra component

how do i remove the website link from my layout?

there are probably easier ways but just paste this into your layout at the very bottom:
FRIENDS_WEBSITE=><center></center>
LASTN_WEBSITE=><center></center>

how do i adjust how my sidebar elements are layered?

when you steal a layout with a sidebar in it you're going to see something called a z-index in various parts of the coding. this controls the stacking of your elements. the higher the number the higher in the stack the element is, so let's say you're stacking some links on top of a wreath that's on top of a gif. your gif sits on the bottom so it would be z-index: 1, your wreath would be z-index: 2, and your links would be z-index: 3. if this is in any other order, even if parts covering your links are transparent, you will still find your links to be unclickable.

how do i change the number of entries per page?

LASTN_OPT_ITEMS=>3

how do i align the text in my layout?

tr{text-align:justify;}

how do i make my custom sidebar/wreath show up on my friends page too?

copy everything you have in your lastn_website tag and add paste it again but change LASTN_WEBSITE to FRIENDS_WEBSITE in both the opening and closing tags

what do i do if a layout uses rgba color codes?

if you go here or here you can type in the rgba numbers to find out the hex code that corresponds with it and vice versa but this is usually to adjust the opacity, ie, a white textbox with a slight opacity would be 245, 245, 245, .05. the rbga color code for white is 245, 245, 245 and then the .05 adjusts the opacity.

how do i remove the brackets from my upper right links?

insert the following into your coding. if this doesn't work then there is something elsewhere in your coding preventing it:
/* shows your upper right links without brackets */
.date, a.index {visibility:visible !important;} table table tr.caption td.index{visibility: hidden;}

how do i use my own images for locked posts and userinfo squeak icons?

input the following code into your global head style tag. make sure your images are resized to 12x12 or whatever size you plan on changing the padding in the following code to, as the code will not resize for them. if your image fills to every border you may be better off resizing to 11x11 and making your canvas 12x12 to give it that little wiggle room if you've noticed that it's cutting off a bit.:
/*--- TINYICONS ---*/
img[src*="img/userinfo.gif"]{background:transparent url(IMAGE LINK HERE)no-repeat!important; width:0!important; height:0!important; padding:12px 0 0 12px!important;margin-bottom:0px;}

img[src*="img/community.gif"]{background:transparent url(IMAGE LINK HERE)no-repeat!important;width:0!important;height:0!important;padding:12px 0 0 12px!important;margin-bottom:0px;}

img[src*="img/icon_protected.gif"]{background:transparent url(IMAGE LIKN HERE)no-repeat!important;width:0!important;height:0!important;padding:12px 0 0 12px!important;margin-bottom:0px;}

img[src*="img/icon_private.gif"]{background:transparent url(IMAGE LINK HERE)no-repeat!important;width:0!important;height:0!important;padding:12px 0 0 12px!important;margin-bottom:0px;}

how do i move my time and date down to the next line?

this requires you to change some coding in a few different places. you'll first want to add the following coding inside your global head overrides and adjust the font however you want:
/* special date and time */
.index2 { font-size:8px; font-family: helvetica; text-align: left; background-color:transparent; display: block;}
.entrybox td.index, .index3{ display: none; }

then you're going to need to add the following under your global head like you would a special sidebar:
LASTN_DATE_FORMAT<=
</td> </tr> <tr> <td class="index2"> ︎%%monshort%% %%dd%%, %%12h%%:%%min%%%%ampm%% </font> </td> </tr> <tr> <td class="index3">
<=LASTN_DATE_FORMAT

FRIENDS_DATE_FORMAT<=
</td> </tr> <tr> <td class="index2"> ︎%%monshort%% %%dd%%, %%12h%%:%%min%%%%ampm%% </font> </td> </tr> <tr> <td class="index3">
<=FRIENDS_DATE_FORMAT

how do i replace the comment text with an image or my own text?

add the following at the very bottom of your coding, underneath your global_head. insanejournal will probably move pieces of it when you save but that's okay.
DAY_TALK_LINKS=> <tr> <td align="right" valign="bottom" colspan="2" width="100%" class="comments">%%readlink%% <a href="%%urlpost%%">WORDS OR IMAGE LINK YOU WANT TO REPLACE POST COMMENT </a> </td> </tr>
LASTN_TALK_LINKS=> <tr> <td align="right" valign="bottom" colspan="2" width="100%" class="comments">%%readlink%% <a href="%%urlpost%%">WORDS OR IMAGE LINK YOU WANT TO REPLACE POST COMMENT </a> </td> </tr>
FRIENDS_TALK_LINKS=> <tr> <td align="right" valign="bottom" colspan="2" width="100%" class="comments">%%readlink%% <a href="%%urlpost%%">WORDS OR IMAGE LINK YOU WANT TO REPLACE POST COMMENT </a> </td> </tr>

LASTN_TALK_READLINK=> <a href="%%urlread%%">%%messagecount%% </a>
FRIENDS_TALK_READLINK=> <a href="%%urlread%%">%%messagecount%% </a>
DAY_TALK_READLINK=> <a href="%%urlread%%">%%messagecount%% </a>

how do i customize the title text in my layout?

in your global head portion add <title> </title> and add your text between them. if you want this text to be special go to linojam to generate your smallcaps or cursive text or whatever it is you're looking for and c/p that between the tags instead.

how do i embed a youtube video on insanejournal?

a lot of people will tell you that you can't do this. you can. not only that but it's really easy. go to youtube and find the video you want. press share to get the embed code. c/p this into an entry and replace iframe with embed at the beginning and end of that code. that's all.

where can i find fonts?

i've uploaded a ton of fancy fonts at fontcity that you can use in layouts and styles without having to rehost on your own. for additional fonts that you don't need to host on your own server there's the obvious google fonts and there are a lot of really lovely people on tumblr who host font pages that, like google fonts and fonts from fontcity, give you the font face code to put into your layout. you can find some here, here, and here for a start. just google around and there are more out there. tumblr fonts go below the style tag, while google fonts go above

dafont, 1001 fonts, and font squirrel are great places to find free fonts if you want to upload your own. dafont has forums for font finding so for fandom type layouts i'll often google "star wars font" or whatever i'm looking for and there's usually someone on dafont who's found one for someone else that matches a movie poster or something

how do i upload my own font?

follow these steps:
•go to neocities and create the page you're going to host your font in ending with .css rather than .html

•paste the following onto that blank page and change the font-family title to what you plan to call it:
@font-face {font-family: INSERT HERE; src: url(INSERT HERE) format('truetype');font-weight:normal; font-style:normal;)}

•visit dataurl and upload the .ttf or .otf font file you've downloaded

•copy the very long string of characters and paste it in place of the INSERT HERE url parentheses

•paste the following into your insanejournal overrides or into your style the same place you would a google font and replace YOUR URL HERE with the link to the neocities page you just created:
<link rel="stylesheet" href="YOUR URL HERE">

special shoutout to koding for teaching me this

where can i find borders, wreaths, and small icons for links?

i've uploaded a lot of wreaths and borders here that you're free to use. i also highly recommend pngtree for basically any transparent layout feature you're looking for. a couple great places to get small icons are flaticon & iconfinder.

how do i create a custom page on neocities?

follow these steps (with pictures if needed):
•create a folder named whatever you want*
•hover over folder and select manage*
•select new file and name it making sure to end this in .html (or .css for a font file)
•hover over created file and select edit
•this is what your page will look like. highlight it and delete it
•replace it with the following skeleton and edit accordingly:
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>TITLE HERE</title>
<link rel="shortcut icon" href="">

<meta name="credit" content="PLACE YOUR CREDIT HERE">

<style>
body{
margin-top:50px;
}
</style>
</head>

<body>
<!--THIS IS WHERE YOUR CONTENT GOES-->
</body>

</html>

*these steps are only for organization and can be skipped. if you do create a folder this folder name will be visible in the page link.

TIME SAVING FUN FACTS

•you do not need to use quotations inside of an a href or username link
•if you're linking within the same site you do not need http://tentacool.insanejournal.com/profile. just /profile will go to the same place. this is also true for neocities styles. https://fontcity.neocities.org/mona.css will work the same as /mona.css within the same neocities account.
•you can define your website text by just pressing space. you don't need an unsightly period in your ui.
•you don't need to fully begin and end a tag if you want a blank screened post. <i></i> works but so does just the <