Register - Login
Views: 99823894
Main - Memberlist - Active users - Calendar - Wiki - IRC Chat - Online users
Ranks - Rules/FAQ - Stats - Latest Posts - Color Chart - Smilies
05-03-22 07:38:02 PM
Jul - Meta - How to make custom layouts?? New poll - New thread - New reply
Next newer thread | Next older thread
Termingamer2-JD
Telling people to kill themselves is no way to be, son.

Level: 15


Posts: 19/43
EXP: 14053
For next: 2331

Since: 07-15-15

From: Lost

Since last post: 6.7 years
Last activity: 1.3 years

Posted on 08-09-15 04:54:24 PM Link | Quote
As you can see I have a broken layout here.

How do I implement the font-family and color attributes so that they work correctly in Jul? Both are present in my layout code but don't work. (and that's the only time I use american spellings, in my own account).

Also, is it at all possible to create a layout with the div classes instead of div styling? The code irritates me when it's all clumped up in one line of code.

____________________

If you trust me, you're trusting a guy who uses IE6.
Xkeeper

Level: 263


Posts: 21535/25353
EXP: 297155406
For next: 1805047

Since: 07-03-07

Pronouns: they/them/????????

Since last post: 3 days
Last activity: 12 hours

Posted on 08-09-15 07:51:59 PM Link | Quote
You need to use inline styles, not CSS*.


<div style='font-family: Verdana, sans-serif; color: #fff; background: #000; padding: 1em;'>

...
</div>





* Technically you can add a style tag to your layout as well, but it still has some quirks you need to watch out for.

____________________
dotUser
From the Grave
Level: 91


Posts: 2110/2357
EXP: 7428072
For next: 40840

Since: 10-20-10

Pronouns: she/her
From: a particularly peculiar tiny store's back shelf

Since last post: 34 days
Last activity: 6 days

Posted on 08-09-15 07:55:58 PM Link | Quote
When using inline style tags you do not use {} to bracket them. Even a small thing like that literally disables the entirety of your CSS or HTML.

And for font family tags you'd want to use ' as the quotes so there's no conflict with the style quotation marks. (Otherwise you will end up with the style tag terminating partway through reading, making things break as well).

Originally posted by header
<div style="background-color: maroon;margin: 50px;text-size: 15px;font-family: 'sans-serif';color: black;text-align: center;">

Originally posted by sig
</div><div style="background-color: navy;margin: 50px;text-size: 15px;font-family: 'sans-serif';color: black;text-align: center">If you trust me, you're trusting a guy who uses IE6.</div>


(Ninja'd by Xk but eh..)

____________________
Join me for Splatoon in #Inkopolis on badnikIRC | Web | Twitter | Tumblr
dotUser
From the Grave
Level: 91


Posts: 2111/2357
EXP: 7428072
For next: 40840

Since: 10-20-10

Pronouns: she/her
From: a particularly peculiar tiny store's back shelf

Since last post: 34 days
Last activity: 6 days

Posted on 08-09-15 08:09:27 PM Link | Quote
Double-Posting for separation of info; as Xk said you could always add in a CSS style tag, but it would largely change how you need to set up the header and sig of your post.

Using some of the info from your style setup I'd probably do it like this:

Originally posted by header
<style type="text/css">#terminPost{background-color:maroon; padding:50px; font-size:15px; font-family:sans-serif; color:#fff; text-align:center;} #terminSig{background-color:navy; padding:50px; font-size:15px; font-family:sans-serif; color:#fff; text-align:center;}</style><div id="terminPost">

Originally posted by sig
</div><div id="terminSig">If you trust me, you're trusting a guy who uses IE6.</div>


Which would come out looking like this:



Sample text.

Originally posted by fhqwhgads
A sample quote, with a link, for testing your layout.


This is how your post will appear.
If you trust me, you're trusting a guy who uses IE6.




But tbh that entire colour scheme is pretty terrible, heh. And would probably get you a lot of flack.
Xkeeper

Level: 263


Posts: 21536/25353
EXP: 297155406
For next: 1805047

Since: 07-03-07

Pronouns: they/them/????????

Since last post: 3 days
Last activity: 12 hours

Posted on 08-09-15 08:15:43 PM Link | Quote
Centering text is usually pretty bad, too, since it makes reading posts a lot more difficult than it should be

____________________
Sanqui
2060
💛🤍💜🖤🦉
Level: 87


Posts: 1360/2066
EXP: 6311628
For next: 81146

Since: 12-20-09

Pronouns: any ✨
From: Czechia | Estonia

Since last post: 15 days
Last activity: 1 day

Posted on 08-09-15 08:23:34 PM Link | Quote


*Sanky flops.

level 65

exp 2275517

exppct 50.5%

numposts 1360

 
If you're using <style> tag in your layout, you can't have newlines in, because they get replaced with <br>, which breaks your code. Alternatively "escape" the newlines with /* */. That's what I do.

____________________
In our brief lives,  •  we've managed to meet.  •  Treasure this gift,  •  this precious time that we have.        
Xkeeper

Level: 263


Posts: 21540/25353
EXP: 297155406
For next: 1805047

Since: 07-03-07

Pronouns: they/them/????????

Since last post: 3 days
Last activity: 12 hours

Posted on 08-09-15 08:26:14 PM Link | Quote
Originally posted by Sanky
If you're using <style> tag in your layout, you can't have newlines in, because they get replaced with <br>, which breaks your code. Alternatively "escape" the newlines with /* */. That's what I do.

You should add this as an issue on github and I'll go "fix" it later. table tags currently disable all br tags not inside tds, so I can probably wrangle the same thing for style

____________________
Termingamer2-JD
Telling people to kill themselves is no way to be, son.

Level: 15


Posts: 21/43
EXP: 14053
For next: 2331

Since: 07-15-15

From: Lost

Since last post: 6.7 years
Last activity: 1.3 years

Posted on 08-10-15 10:46:35 AM Link | Quote
Originally posted by dotUser
When using inline style tags you do not use {} to bracket them. Even a small thing like that literally disables the entirety of your CSS or HTML.

And for font family tags you'd want to use ' as the quotes so there's no conflict with the style quotation marks. (Otherwise you will end up with the style tag terminating partway through reading, making things break as well).

Originally posted by header
<div style="background-color: maroon;margin: 50px;text-size: 15px;font-family: 'sans-serif';color: black;text-align: center;">

Originally posted by sig
</div><div style="background-color: navy;margin: 50px;text-size: 15px;font-family: 'sans-serif';color: black;text-align: center">If you trust me, you're trusting a guy who uses IE6.</div>


(Ninja'd by Xk but eh..)


Thanks.
I'll also have a look into my kafuka layout also, and fix it. Also how do I implement a custom image URL? If I do it using the background tag it doesn't seem to work.

____________________

If you trust me, you're trusting a guy who uses IE6.
dotUser
From the Grave
Level: 91


Posts: 2120/2357
EXP: 7428072
For next: 40840

Since: 10-20-10

Pronouns: she/her
From: a particularly peculiar tiny store's back shelf

Since last post: 34 days
Last activity: 6 days

Posted on 08-10-15 10:56:13 AM Link | Quote
To add a background image, if using inline, you add the following into the style="" set of tags.


background: url(url-to-image-here);


That will usually just auto-tile though, so if you want to change how the image behaves you can use properties like no-repeat, top, left, right, bottom, etc. in the background:; tag. There's also background-size for making it behave specifically, which is a separate tag.

____________________
Join me for Splatoon in #Inkopolis on badnikIRC | Web | Twitter | Tumblr
Termingamer2-JD
Telling people to kill themselves is no way to be, son.

Level: 15


Posts: 22/43
EXP: 14053
For next: 2331

Since: 07-15-15

From: Lost

Since last post: 6.7 years
Last activity: 1.3 years

Posted on 08-10-15 11:00:26 AM (last edited by Termingamer2-JD at 08-10-15 11:03:38 AM) Link | Quote
Thanks again.

Also, I wrote a border part to my post layout, which is fine in the sample post but doesn't seem to display elsewhere, which makes no sense. Should I try resizing the boxes?

the data is: 1em ridge #FFA500;

hang on it's working now...

____________________
If you trust me, you're trusting a guy who uses IE6. Thanks to dotUser for fixing the code for me.
dotUser
From the Grave
Level: 91


Posts: 2121/2357
EXP: 7428072
For next: 40840

Since: 10-20-10

Pronouns: she/her
From: a particularly peculiar tiny store's back shelf

Since last post: 34 days
Last activity: 6 days

Posted on 08-10-15 11:04:59 AM Link | Quote
I'm seeing the borders just fine on my end. If you're using IE6 you probably wont see a lot of newer CSS behaviours due to it not supporting most CSS3+ tag behaviours.

____________________
Join me for Splatoon in #Inkopolis on badnikIRC | Web | Twitter | Tumblr
Termingamer2-JD
Telling people to kill themselves is no way to be, son.

Level: 15


Posts: 25/43
EXP: 14053
For next: 2331

Since: 07-15-15

From: Lost

Since last post: 6.7 years
Last activity: 1.3 years

Posted on 08-10-15 11:07:36 AM (last edited by Termingamer2-JD at 08-10-15 12:19:18 PM) Link | Quote
Originally posted by dotUser
I'm seeing the borders just fine on my end. If you're using IE6 you probably wont see a lot of newer CSS behaviours due to it not supporting most CSS3+ tag behaviours.

I realised the error is that this site doesn't update the old posts, I don't think, because it's fine on all the posts I made after that one, for some reason.

I know a bit about ABXD Layouts, but not Jul AcmlmBoard Layouts, that's why I made the thread. Thanks for the new code also, it works (besides the font which might be a browser issue).

Layout is done! It is basically look like ABXD Gold from ABXD.

____________________
If you trust me, you're trusting a guy who uses IE6. Thanks to dotUser for fixing the code for me.
Next newer thread | Next older thread
Jul - Meta - How to make custom layouts?? New poll - New thread - New reply


Rusted Logic

Acmlmboard - commit 47be4dc [2021-08-23]
©2000-2022 Acmlm, Xkeeper, Kaito Sinclaire, et al.

27 database queries.
Query execution time: 0.087550 seconds
Script execution time: 0.024233 seconds
Total render time: 0.111783 seconds