Forum Settings
Forums

suffix's MAL Themes [updated for new layout]

Pages (3) [1] 2 3 »
Post New Reply
#1
Oct 7, 2009 10:16 AM

Offline
Joined: Jun 2009
Posts: 115
Original Topic | MAL Theme Club

Here are some updated themes that should work fine, I borrowed some code from Zealotus' updated Night Theme for the "@-moz-document" stuff, and the navigation area is pretty much ripped straight from kimatg's theme. :P

For those interested, the Death Note Theme will be updated very soon, and it will have a similar navigation as the themes below, that is, if it meets your approval. If the majority don't like this navigation, then I'll change it. I think it looks good though. :) Kudos to kimatg. After all that, I'll get back to working on new themes.

Clannad Theme
Preview

Download:
http://userstyles.org/styles/22475
Kanon Theme
Preview

Download:
http://userstyles.org/styles/22476
Air Theme
Preview

Download:
http://userstyles.org/styles/22477
Planned themes
+ Kara no Kyoukai, Chobits (Chii), K-ON!, Ef
- Full Metal Panic!, Haruhi Suzumiya, Lucky ☆ Star, School Rumble

+ = higher priority
- = lower priority / "maybe"

No ETA on anything, I work as I please, when I please.
Copyright & credits
What copyright? :D That means, you can do as you wish with these themes, edit them, make your own ones and release them, I don't really mind. But I do like to be credited and complimented, it gives me a warm and fuzzy feeling. ;)
Ads
Although you can't see the ads in the previews, my themes will never disable/hide the ads on MAL, because MAL needs the revenue from those ads in order to run. But you may use another style/script or browser addon designed for disabling ads with my themes, if you so choose.
Resources
Looking to make your own theme, similar to mine? Here you can find the Photoshop PSD for my Clannad theme (old version), feel free to use it as a template. :)
http://myanimelist.net/forum/?topicid=131249
Modified by suffix, Jan 17, 2010 10:11 PM
 
#2
Oct 7, 2009 1:31 PM

Offline
Joined: Jan 2009
Posts: 1330
o_O i didnt know you can put mal themes, or is this a new idea?
Needs more Drill Hair.
 
#3
Oct 7, 2009 2:05 PM

Offline
Joined: Jun 2009
Posts: 115
Nah it's nothing new, it's done via user scripts. Basically, once applied, user scripts allow you to edit any website's appearance and even functions to a degree. There are a few themes and scripts for mal that I've found.

To edit a website's CSS requires only a little snippet of code and then it's just like normal CSS, so it's almost exactly like anime/manga list styling. And with some more coding you can even add HTML elements too like I've added that youtube video as an example. Of course these changes will only show to people who've installed and enabled the user script.

Firefox requires an addon called Greasemonkey for user scripts (and there's an addon called "Stylish" but I've coded my theme to work on Greasemonkey, haven't tested on Stylish), Opera has built-in support, don't know about other browsers... except that IE can support it too.
Modified by suffix, Oct 7, 2009 2:10 PM
 
#4
Oct 7, 2009 3:08 PM

Offline
Joined: Jul 2009
Posts: 1004
that is so awesome man
 
#5
Oct 7, 2009 4:04 PM

Offline
Joined: Nov 2007
Posts: 3404
Nicely done suffix, it looks great.
 
#6
Oct 7, 2009 4:15 PM

Offline
Joined: Jul 2007
Posts: 2340
One thing about all of these user scripts, if we are going to be doing a lot of them as a MAL community, I would like to try and figure out a way that can allow our scripts to all remain compatible while being easy to maintain.

In order to prevent site changes from making a big difference, I think it would be a good idea for greasemonkey coders to create a "DOM" level script that will run prior to other scripts and will modify the DOM so that it remains compatible and, in some cases, is easier for userscript writers to work with.

I'm not sure about the performance implications of this. But, if possible, I would like to reach some consensus here so that people will be able to use multiple different userscripts without issue.

(I personally plan on releasing a userscript in the future that will allow users to modify settings of the site easily. It will take on an object oriented approach and is planned to alter the DOM to make it more friendly for userscripts.)

Oh, and by the way, your kanon theme looks pretty spectacular. :)

Edit - Also, I just noticed the theme club on MAL, perhaps I'll mention this there as well.
Modified by asandari, Oct 7, 2009 4:20 PM
 
#7
Oct 7, 2009 4:20 PM

Offline
Joined: Jun 2009
Posts: 13899
LaiLidE said:
o_O i didnt know you can put mal themes, or is this a new idea?


I didn't know either

Skaters hearts are as fragile as glass. If their hearts are so fragile....
 
#8
Oct 7, 2009 4:59 PM

Offline
Joined: Jun 2009
Posts: 115
Damn, it is ridiculously easy to edit... I just did this one for Clannad in like 30 minutes (most of that time spent on the background graphics). Not finished... I want to work on the right side and top more. But the left side looks cool doesn't it? ^^

Preview


Oh yeah and I should mention that these themes are meant for 1600x(?) resolutions or higher, they do work on lower resolutions but the background will get cut off and they don't look as pretty. :/ The background image is exactly 1600px wide. I made it so the background fades to white in the end, if you have a higher resolution, so it looks fine. :)

-----
Arigatou gozaimasu, for the compliments everyone ^^

/me loves being complimented
-----

Btw kudos to the people behind MALs frontend code, it's very clean and easy to edit. :) I joined MAL instead of some other anime database site, only because this layout is so simple yet elegant.


asandari said:
I'm not sure about the performance implications of this. But, if possible, I would like to reach some consensus here so that people will be able to use multiple different userscripts without issue.
I'm not very advanced in coding in general... but my theme is really simple, it only overwrites certain CSS for the backgrounds and colors. But when I get around to releasing these themes, anyone is free to improve them, and if there are some bugs/compatibility issues (or MAL site updates) I'll update the code myself. :)

Btw asandari since you seem to be a Mai fan, I might be making another (blue) Kanon theme with Mai and perhaps Nayuki and/or Shiori. I just couldn't fit any other girls in this design, I wanted Mai because I'm also a bit of a fan of hers! ^^ Or I might somehow find a way to fit more characters in this design without making it look too crowded.
Modified by suffix, Oct 7, 2009 5:55 PM
 
#9
Oct 7, 2009 5:18 PM

Offline
Joined: Mar 2008
Posts: 2252
If this works out nicely, it would be very nice. The previews look great and well-themed.
 
Oct 8, 2009 1:51 AM

Offline
Joined: Mar 2008
Posts: 1626
I'd prefer seeing Kyou in Clannad theme ;P
 
Oct 8, 2009 1:59 AM

Offline
Joined: Jan 2009
Posts: 1330
LOL YAY I SEE MYSELF IN THE PREVIEW WOOOOOOOOO.

are the OP's neccessary? i hate streaming content that automatically starts and lags/wastes my usage unless it doesnt do that then its all good.
Needs more Drill Hair.
 
Oct 8, 2009 2:00 AM

Offline
Joined: May 2008
Posts: 1459
Its looks really nice,
but my guess is that your monitor needs to be big no?
looking at the space you have at the sides etc.

btw nice seeing my kanon layout in the screenshot 8D
 
Oct 8, 2009 4:42 AM

Offline
Joined: Jul 2007
Posts: 2340
suffix said:

Btw asandari since you seem to be a Mai fan, I might be making another (blue) Kanon theme with Mai and perhaps Nayuki and/or Shiori. I just couldn't fit any other girls in this design, I wanted Mai because I'm also a bit of a fan of hers! ^^ Or I might somehow find a way to fit more characters in this design without making it look too crowded.


That would be pretty awesome. Though I'm not sure if I would actually use it, as I'm a default kind of person, but it would be nice to see the Mai love spread <3

I just wish there were more unique source photos for mai. They always seem in short supply ;.;
 
Oct 8, 2009 4:53 AM

Offline
Joined: Mar 2009
Posts: 65256
A Death Note one would be cool.
 
Oct 8, 2009 7:22 AM

Offline
Joined: Jun 2009
Posts: 115
viesiu said:
I'd prefer seeing Kyou in Clannad theme ;P
Me too, that's why I will either make room for all the girls or make more themes with different girls. :)

LaiLidE said:
are the OP's neccessary? i hate streaming content that automatically starts and lags/wastes my usage unless it doesnt do that then its all good.
Well it's not on autostart so it doesn't waste bandwidth... but it was only a test, I will take it off. I'll try to place links for Kanon's info and fanclub (with permission) pages on the top instead, same for all the themes I would do.

Fabrice said:
Its looks really nice,
but my guess is that your monitor needs to be big no?
looking at the space you have at the sides etc.
Min 1600px resolution width (19" screen or bigger) or the backgrounds won't show completely. :/ I don't know how many users here use bigger resolutions, but if it turns out that there are many people still stuck with smaller resolutions, I could make low-res versions of the themes and resize the backgrounds to fit their screens too.

AlexisSolitaire said:
A Death Note one would be cool.
Thinking about making a Death Note theme by Halloween. :)
Modified by suffix, Oct 8, 2009 4:35 PM
 
Oct 8, 2009 4:07 PM

Offline
Joined: Jun 2009
Posts: 115
Sorry about the double post, if I keep editing my old post it would become too long for anyone to read lol. :P

Worked on the Clannad theme a little more, now features Kyou ^^ and of course "the girl" and garbage doll.
Thinking about maybe placing Fuko in the footer area :D
Clannad fanclub (graphics by Fabrice, again :D) looks amazing on it! *_* perfect fit.
Preview (and another version, better imo)

A question remains: How can everyone be smiling while kotomi is playing the violin? x)

-----------------------------

Also updated the Kanon theme a bit. Can't fit any more characters in this design, I think it works fine like this though. Makoto and Ayu were kind of the most "main" heroines anyway, if I'd have to pick just two.
(Kanon has a bit ugly logo doesn't it? Might have to remove it, doesn't fit there imo)
Preview


Clear your browsers cache (CTRL+F5) if you're still seeing the old pictures (I replaced the old ones)
Modified by suffix, Oct 8, 2009 5:46 PM
 
Oct 9, 2009 12:24 AM

Offline
Joined: Jan 2009
Posts: 1330
Ooh nice. I wouldn't call it a double post since its neccessary and long, but if it were something like

post 1: blahgsdahgjas
post 2: gld lasf kgj

then yeh lol.
Needs more Drill Hair.
 
Oct 9, 2009 12:35 AM

Offline
Joined: Nov 2007
Posts: 3404
suffix said:
now features Kyou ^^

You're on the right track. Now just replace all those other nobodies with more Kyou.

Kidding. I like it quite a bit. Any ETA for a full release?
 
Oct 9, 2009 5:50 AM

Offline
Joined: Jun 2009
Posts: 115
Xjellocross said:
suffix said:
now features Kyou ^^

You're on the right track. Now just replace all those other nobodies with more Kyou.

Kidding. I like it quite a bit. Any ETA for a full release?
Nothing wrong with making a theme about one character only. :P I won't be making one myself, but if anyone wants to, they're free to do so (it's not hard at all, as long as you know how to make graphics). :>

ETA for release, a couple of days I'd wager... just gotta complete and clean my code and obsess over the details a bit more.

After the Kanon and Clannad themes are done, I've decided to do a little darker themes for Code Geass and Death Note. The content background will still be white though, so they'll be similar to the other themes in that way. And Air is still on my to-do list, just not as a priority.

edit: typo
Modified by suffix, Oct 9, 2009 6:36 AM
 
Oct 9, 2009 6:35 AM

Offline
Joined: Apr 2009
Posts: 386
wow i cant wait, im now like Totally obsessed with your themes :D
 
Oct 9, 2009 6:37 AM

Offline
Joined: Sep 2009
Posts: 200
ur a GOD!!!!!! xD

nice themes :O


 
Oct 9, 2009 12:47 PM

Offline
Joined: Nov 2007
Posts: 3404
suffix said:
Xjellocross said:
suffix said:
now features Kyou ^^

You're on the right track. Now just replace all those other nobodies with more Kyou.

Kidding. I like it quite a bit. Any ETA for a full release?
Nothing wrong with making a theme about one character only. :P I won't be making one myself, but if anyone wants to, they're free to do so (it's not hard at all, as long as you know how to make graphics). :>

ETA for release, a couple of days I'd wager... just gotta complete and clean my code and obsess over the details a bit more.

Yea, I was already planning to edit the source for my own use after your release :P

Great, I'm looking forward to it.
 
Oct 9, 2009 12:52 PM

Offline
Joined: Jun 2009
Posts: 115
Ahem. Okey, I'll probably release BETA versions of the Kanon and Clannad themes tomorrow... I'll need people to test different pages of MAL with different browsers and report all bugs, it'll be faster that way than doing it by myself. I hope at least a couple of people would be up to it...

Also, I'm quite new at this theming business and I'm sure my code can be improved, so I welcome any fixes and suggestions.

The themes are fully functional as far as I can tell, on Firefox + Greasemonkey, but what do I know, I haven't been through all the corners of MAL ;P
 
Oct 9, 2009 6:57 PM

Offline
Joined: Jan 2009
Posts: 1330
so how do you start making the theme, do you screenshot mal then like cut around the edges and replace with your own picture?
Needs more Drill Hair.
 
Oct 9, 2009 7:13 PM

Offline
Joined: Jun 2009
Posts: 115
LaiLidE said:
so how do you start making the theme, do you screenshot mal then like cut around the edges and replace with your own picture?

For this kind of a theme, first you create a blank white image (my backgrounds are 1600x900px), then do your magic, and in the end place a big-a$$ white box/shape in the exact center of it, where you want the content area to be. :P I can upload my PSDs somewhere so you can get started easier.

I cleaned the code of my themes a lot now, even added variables for the 6 colors and for the 3 images (body background, header left and right side) that I changed (yeah, that's all I did basically). Should be as easy as editing those variables to your own liking to make your own themes, unless you want to change more stuff.
 
Oct 9, 2009 8:45 PM

Offline
Joined: Jun 2009
Posts: 115
Ok, here we go!

Read before asking: "Uguu! How do I use these themes?"

Clannad Theme BETA
Preview:

Download:
http://userscripts.org/scripts/show/59458

Kanon Theme BETA
Preview:

Download:
http://userscripts.org/scripts/show/59459

Notes:
- Tested on Firefox v3.5.3 + Greasemonkey, Opera
- NOT final versions
Modified by suffix, Oct 10, 2009 8:51 AM
 
Oct 9, 2009 10:09 PM

Offline
Joined: Apr 2009
Posts: 386
WOOOOOOOOOOOOOOOO, IT WORKS:D:D:D

installed firefox and greasemonkey, then clicked the link clickedpressed "install" and now i have the theme :D!

AWSOME ^^


:3 <3 <3 <3
 
Oct 9, 2009 10:16 PM

Offline
Joined: Jan 2009
Posts: 1330
yeh if you had the psd that would make things easier, but doesnt the big white box have to be somewhere in the middle or i can even have it at the left/right
Needs more Drill Hair.
 
Oct 9, 2009 10:32 PM

Offline
Joined: Jun 2009
Posts: 115
LaiLidE said:
yeh if you had the psd that would make things easier, but doesnt the big white box have to be somewhere in the middle or i can even have it at the left/right
I'll clean up the PSDs and upload them when I get around to it. Of course the content area doesn't have to be centered, you can do pretty much anything you can imagine with CSS. :>It's just that, most people surely prefer it to be centered as they would want it to be like the original layout. Which is why I didn't do any major cosmetic changes besides moving the layout slightly lower, and changing the colors.

There are a few little things that need to be done that I'm aware of now, graphics for the Login page, forum icons and info bubbles at least.

I would like an IE user to let me know if these themes run on their browser.

I hope the code of the themes is comprehensible... I'm sure it can be improved a lot. If anyone's wondering why I didn't make the skins with the Stylish addon/code, well that's because I've never used it before and am too lazy to learn all its quirks.


Off to bed now,
Nyuu~
Modified by suffix, Oct 9, 2009 10:37 PM
 
Oct 10, 2009 2:35 AM

Offline
Joined: Jun 2009
Posts: 4931
I installed, it works but i don't have background image o.O
I'm using FF3.5.5=Greasmonkey.

EDIT:
Restarted FF and it works well.
Great job ^^
Modified by OrochiPL, Oct 10, 2009 2:39 AM
レッツゴー ED イケイケゴーゴー
 
Oct 10, 2009 2:53 AM
Anime Moderator
Offline
Joined: Jul 2007
Posts: 2748
It works perfectly. I use the Clannad theme and i love it :)

Since you said you are open for requests then:
I would love a Kara no Kyoukai or Fate/Stay night them (or both if you can :P )
 
Oct 10, 2009 4:11 AM

Offline
Joined: Jun 2007
Posts: 1112
Good work, looks interesting for a first attempt.
You seem to be heading in a nice direction.

You might want to check out the MAL Themes Club where you can find other people, who attempted at creating Themes via Stylish or Greasemonkey before, like the Dark Theme and it's more popular spin-off the Night Theme as well as other more themed ones.
 
Oct 10, 2009 4:13 AM

Offline
Joined: Apr 2008
Posts: 787
OMG looks awsome!!! is it okay if i edit these scripts around to suit my needs? :) and maybe you can add a footer image :P
Modified by huyyy, Oct 10, 2009 4:26 AM
 
Oct 10, 2009 4:57 AM

Offline
Joined: Feb 2008
Posts: 4300
suffix said:
- Tested ONLY on Firefox v3.5.3 + Greasemonkey
I tested it on Opera using user javascripts, works like you'd expect them to; i.e. they load after everything else has been loaded but they do work.
 
Oct 10, 2009 8:58 AM

Offline
Joined: Jun 2009
Posts: 115
Mathes said:
You might want to check out the MAL Themes Club
Thanks I'll drop by there.

huyyy said:
OMG looks awsome!!! is it okay if i edit these scripts around to suit my needs? :) and maybe you can add a footer image :P
Go ahead, but I reserve the right to use any ideas and code improvements myself that others come up with. x) Yep the footer could use some touching up, I'm planning to put Fuko there in the Clannad theme, as soon as I find a good pic like that. :P

kuroshiroi said:
I tested it on Opera using user javascripts, works like you'd expect them to; i.e. they load after everything else has been loaded but they do work.
Thanks, good to know that works too. Greasemonkey works the same way, everything gets loaded after the page itself, which is kind of annoying because sometimes you see the original layout for a while and then *poof* it changes. :P
 
Oct 10, 2009 10:30 AM

Offline
Joined: Jun 2008
Posts: 1167
Yeah for this! Currently using the Kanon theme, and I am loving it. Thanks!
 
Oct 10, 2009 11:44 AM

Offline
Joined: May 2007
Posts: 3951
Idea behind this is pretty nice, not a fan of having anime-themed interface, though.

It's a sad thing I do not like Clannad or Kanon even a bit.

Planning on releasing something darker (not as in evil, but as in black/dark MAL theme)? I mean white backgrounds are a little...
 
Oct 10, 2009 11:54 AM

Offline
Joined: Jun 2009
Posts: 115
ZoiQ said:
Idea behind this is pretty nice, not a fan of having anime-themed interface, though.

It's a sad thing I do not like Clannad or Kanon even a bit.

Planning on releasing something darker (not as in evil, but as in black/dark MAL theme)? I mean white backgrounds are a little...
I'll only be making themes based around anime myself, but someone else could work on "general" color themes. It's just a matter of erasing and changing a few lines of code in my themes... :)

DON'T LIKE CLANNAD OR KANON?


The themes for Death Note and Code Geass that I will start working on next will have dark colors, but whether the content area itself will be dark, haven't decided yet. I'd actually like to hear what people would prefer. I'll do as the majority likes.

Edit: oh and yeah, just updated my first post in the topic.
Modified by suffix, Oct 10, 2009 11:58 AM
 
Oct 10, 2009 12:14 PM

Offline
Joined: Nov 2007
Posts: 3404
Just installed the Clannad theme and it looks fantastic.

I'll probably get to working on my own themes sooner or later. Thanks for all your hard work.
suffix said:
kuroshiroi said:
I tested it on Opera using user javascripts, works like you'd expect them to; i.e. they load after everything else has been loaded but they do work.
Thanks, good to know that works too. Greasemonkey works the same way, everything gets loaded after the page itself, which is kind of annoying because sometimes you see the original layout for a while and then *poof* it changes. :P

So far I've only been getting this on My Panel so it's not too big a deal. Minor aesthetic thing that happens with most Greasemonkey scripts.
 
Oct 10, 2009 12:18 PM

Offline
Joined: Jul 2009
Posts: 1004
i think you already know but when im in my home laptop the screen fits perfectly but in my school computer coz the monitor is smaller it cuts it of at the side

isit possible to fix or something lol
 
Oct 10, 2009 1:01 PM

Offline
Joined: Jun 2009
Posts: 115
silver2k9 said:
i think you already know but when im in my home laptop the screen fits perfectly but in my school computer coz the monitor is smaller it cuts it of at the side

isit possible to fix or something lol
You want to use it even at school? Wow that is kind of touching. :P Yes, by resizing the background I think I could make them fit within 1280px but any smaller than that... then the site fills almost 100% of the screen anyway, so no point really...

Anyway, I will make "low-res" versions of the themes with 1280px backgrounds "soon", since it's not as if it's a difficult thing to do. :) And I'll clean and upload the PSDs while I'm at it.
 
Oct 10, 2009 1:36 PM

Offline
Joined: Jul 2009
Posts: 1004
lol fanks :)
 
Oct 10, 2009 1:47 PM

Offline
Joined: Dec 2008
Posts: 1006
dang nice themes... :D i want one.. d.gray-man lol... so ill just wait..
::: (\(\
*: (=' :') :*
•.. (,('')('')¤°﹒‧°‧° ☆.(¯`•.•´¯)
.°☆ ‧°‧°☆∴° ☆ ¤º… `•.¸.•´ ☆™
 
Oct 10, 2009 2:00 PM

Offline
Joined: Jul 2008
Posts: 3407
Didn't really catch my interest until I saw that FMP! was on the planned themes.

It would be awesome(and much appreciated >_<) if you added that.
Modified by Defiance, Oct 10, 2009 2:04 PM
 
Oct 10, 2009 2:26 PM
Mahou Shoujo

Offline
Joined: Mar 2008
Posts: 3143
Using the Kanon theme, it's great! :D
 
Oct 10, 2009 3:00 PM

Offline
Joined: Nov 2008
Posts: 103
suffix said:
Anyway, I will make "low-res" versions of the themes with 1280px backgrounds "soon", since it's not as if it's a difficult thing to do. :) And I'll clean and upload the PSDs while I'm at it.
Apparently trying to do this myself is much harder than it looks.

Also, requesting 1440px width.
Modified by Joe4evr, Oct 10, 2009 3:24 PM
 
Oct 10, 2009 3:45 PM

Offline
Joined: Jun 2009
Posts: 4931
Found something:

Can it be fixed?
Modified by OrochiPL, Oct 11, 2009 4:32 AM
レッツゴー ED イケイケゴーゴー
 
Oct 10, 2009 3:54 PM

Offline
Joined: Jun 2009
Posts: 115
OrochiPL: Please put the pic in a spoiler or something. :P

Fix for ads: put the following url in the Excluded Pages of the script:
http://*myanimelist.net/includes/ads/*

(Right click the GM icon -> Manage User Scripts)

Forgot completely about ads as I have them blocked ;D I'll add this url in the the script itself when I next update it.
 
Oct 10, 2009 5:09 PM

Offline
Joined: May 2008
Posts: 4066
these themes are quite nice... I think I will be using them for a while. :)

really looking forward to the death note one.
 
Oct 10, 2009 5:13 PM

Offline
Joined: Jun 2009
Posts: 115
I suck at making darker themes so I'm struggling right now... and re-watching the finale for Code Geass for some inspiration, had the exact opposite effect. Now I feel like "how the hell can I do justice to THAT?". :|

Edit: saka, your spoon is too big. Thanks for the thanks.
Modified by suffix, Oct 10, 2009 5:38 PM
 
Pages (3) [1] 2 3 »