New
May 1, 2012 7:12 AM
#1
This topic is part of our Tools, Tips, and Feedback section: http://myanimelist.net/forum/?topicid=513201 This is now obsolete. Please consider using http://myanimelist.net/forum/?topicid=1163417 instead. Last program update: 2013.04.01 Important note: if you notice dead links, regenerate the files containing all the covers before regenerating your own files. MAL #more what? After reading the "How to individually customize each anime title on your list!" tutorial I thought maybe some people would want a background picture for every single title on their list but that they wouldn't want to manually make a CSS with background links for like 500 titles. So I decided to code a generator that would do that for them =3 (for both anime- and mangalists) It generates 2 kinds of CSS: 1° The #more id It works by giving a background image to every #more id of your list. Explanation of what an id is: http://www.w3schools.com/cssref/sel_id.asp And it so happens that every entry of your list has a different id, beginning by #more, so the idea is to give each of them a different background image link. 2° The .animetitle class It works by giving a background image to the .animetitle class narrowed by the [attribute*=value] selector Explanation of what a class is: http://www.w3schools.com/cssref/sel_class.asp .animetitle[href*="anime/1/"] selects Cowboy Bebop because "anime/1/" is in the url of it's page: http://myanimelist.net/anime/1/Cowboy_Bebop Example of layout made using this generator: For beginners (or people making premade layouts) You can use the following CSSes that contain the background links for all the animes and mangas on MAL: 1° The #more id For anime list: http://dl.dropbox.com/u/49469857/MAL/premade/anime.css For manga list: http://dl.dropbox.com/u/49469857/MAL/premade/manga.css 2° The .animetitle class For anime list: http://dl.dropbox.com/u/49469857/MAL/premade/animetitle.css For manga list: http://dl.dropbox.com/u/49469857/MAL/premade/mangatitle.css I'll keep these 4 files updated. Here is the code to add at the very top of your list's code: 1° The #more id For anime list:For manga list: 2° The .animetitle class For anime list:For manga list: For more advanced users Here is how to use the generator so that you are sure every entry on your list gets a picture. First you need the Java JRE which can be found here: http://java.com/en/download/manual.jsp Then you can download the generator: http://dl.dropbox.com/u/49469857/MAL/premade/MALmoreCSSgenerator.zip Unzip it. There's 3 files in it: To generate your list, run the .exe (or the .bat if the .exe doesn't work). You can either generate the covers for all the animes/mangas on MAL or generate only your own covers. Generating your own file will be way faster if you generate all the covers before because it'll just extract the needed covers. Once it's done, you'll automatically get 2 files. One ending by _anime (or _manga) that you should use fore a #more id layout. The other one ending by _animetitle (or _mangatitle) that you should use for a .animetitle class layout. You will need to upload the CSS file you want to use and @import it in your list's code. I recommend Dropbox. Here is a tutorial about @import: http://myanimelist.net/forum/?topicid=411779#msg13730983 Don't forget to make your list public before running the generator. Shishio-kun made another tutorial, check it if you didn't understand some steps: http://myanimelist.net/forum/?topicid=609907 Let me know if there's any bug! Thanks. |
u531355May 1, 2014 8:52 AM
May 1, 2012 11:35 PM
#2
I have Java, and installed it again to be safe, and I get this screen when I try to run the generator It didn't make any CSS file as far as I can see: http://i47.tinypic.com/1zqvm04.jpg Also I get this screen when I try to open the executable jar file: http://i50.tinypic.com/2ziycxy.jpg |
Shishio-kunMay 17, 2012 11:01 PM
May 2, 2012 12:43 AM
#3
Ok, thanks for reporting, I'll check that this afternoon when I'm home Nice icons btw ^^ EDIT: program updated It was a problem of version, I had compiled it with Java 1.7 and gave a download link for Java 1.6 =o Now it's compiled in Java 1.3 so it should work =) |
u531355May 2, 2012 7:42 AM
May 4, 2012 9:35 PM
#4
Wow it really works! I'll looking into making a premade layout with this! |
May 14, 2012 12:15 AM
#5
Update: it now works for lists with more than 1500 entries. Also I added a .bat which is the same than the .exe just without the MAL icon. The .exe didn't work for a friend (I really don't know why ...) that's why I added .bat. |
May 17, 2012 10:47 PM
#6
I added the generated CSS to the list but it didn't work. I thought they got removed or something so I checked with my firebug. It showed that the generated CSS are still a part of the main one but they were not displayed. Possible errors and solutions? Also I checked Hahaido's list, the way the pics of the animes scrolled as one hovers over the name is classic! How can I do the same with my list? |
May 18, 2012 6:54 AM
#7
It's not something you can just add to your list. #more ids are in display: none, by default so you must first give another display on .hide, which is the class of every #more id. I see it's what you did on your list but you should really clean your code ... 1700 lines of CSS for your layout is just plain ridiculous. Rather than cleaning it I think it would be faster to start a new layout from scratch. If you don't feel capable of doing one yourself wait for Shishio-kun to finish his premade layout. I'm planning on doing one too so you'll have some choice ^^ Hahaido's list is not using the #more id to associate background images. It's using .animetitle:hover |
May 18, 2012 7:19 AM
#8
Any example of what you said. I'm still bad at getting the technical things. But I don't want to trouble or depend upon someone else for my work. |
May 19, 2012 3:23 AM
#9
u531355 said: If you don't feel capable of doing one yourself wait for Shishio-kun to finish his premade layout. I'm planning on doing one too so you'll have some choice ^^ Yeah there needs to be many versions of poster-style (what I'm calling these kinda of layouts) premade layouts that can use your #more generator. Is yours going to be the one you have on your list now?? |
May 20, 2012 2:26 AM
#10
It'll be this one but with a few different color schemes |
May 22, 2012 2:18 PM
#11
u531355 said: It'll be this one but with a few different color schemes Wow awesome can't wait to see, I'll definitely feature it in our premade layouts and probably use a Fairy Tale (Lucy) background. It would be really beneficial to have a Fairy Tale layout like that! |
May 24, 2012 7:38 AM
#12
New version 3 new features: 1) It now creates 2 files automatically: one with the #more id and the other one with the .animetitle class like Hahaido's generator 2) Enables you to create a CSS with links for the 4500 most popular anime/manga 3) Program is now blazing fast even the first time you generate your list. It takes around 15 seconds for a 500 entries-long list. Better than 13 minutes as it was before. It's because it reloads the generated links from the CSS with popular entries. So it only needs to generate links for entries that are on your list but that are not among the 4500 most popular anime/manga of the site. |
May 24, 2012 3:13 PM
#13
Wow this is a ridiculously huge improvement! It changes how I have to do my tutorial tho, but I can manage that. This will be better in the end. One thing that would help with the noob understanding process alot: Can you change the document thats made for #more CSS to say "shishio-kun_anime_#moreCSS" rather than "shishio-kun_anime" please? Also "shishio-kun_animetitle" could be "shishio-kun_animetitleCSS", but these are really small things. It would help tutorial go a little more smoothly tho, for someone who is new to all this. |
Shishio-kunMay 24, 2012 3:23 PM
May 24, 2012 3:25 PM
#14
hmm disregard any file name changes, it doesn't become any more clear when you mark them as #more CSS or not since there so much text then and the "title" at the end will differentiate the different files. |
Feb 6, 2013 2:33 AM
#15
I'm sure ill figure this out later but I was just wonder say you generate your list and you want to combined it with the other 4500's list. How would u go about at doing this? Could you just copy and paste over or what? or do you regenerate after you generate your list or something? Thanks in advance for answering my question. |
Feb 6, 2013 4:02 AM
#16
Mikenzb said: I'm sure ill figure this out later but I was just wonder say you generate your list and you want to combined it with the other 4500's list. How would u go about at doing this? Could you just copy and paste over or what? or do you regenerate after you generate your list or something? Thanks in advance for answering my question. Regenerating would be faster. You could copy and paste over or write it all yourself. From the start, you could do what this program does by hand without the program. It just automates the process for you, making it faster. |
Feb 6, 2013 6:01 AM
#17
Mikenzb said: I'm sure ill figure this out later but I was just wonder say you generate your list and you want to combined it with the other 4500's list. How would u go about at doing this? Could you just copy and paste over or what? or do you regenerate after you generate your list or something? Thanks in advance for answering my question. I'm not sure what you're talking about, if you're talking about using both the 4500 pre-generated and your personal CSS, so that you don't need to update your personal CSS all the time but only when an anime you add to your list isn't in the 4500 most popular animes. It's simple, just @import the 2 files. If you are talking about generating your own CSS from the 4500 most popular animes, it's done automatically as long as the anime.css file exists in the same directory as the program. If it generates dead links, delete that anime.css. Same goes for your personal CSS file. You should delete it if it generates dead links and regenerate it all. |
Feb 6, 2013 5:21 PM
#18
Feb 12, 2013 10:01 AM
#19
I made a clone in PHP btw; demo url: http://ks3099534.kimsufi.com/hans/projects/myanimelist_css/MyAnimeListCSSgen.php github: https://github.com/divinity76/MyAnimeListCSSgenPHP although i would be happy if som1 else could host it, i don't really want to host it on my crappy 1gb ram/crapCPU VPS server :/ also: this could be done a lot nicer, more robust, and faster, if MyAnimeList.net could provide list, image, name, about-page url, etc, via an API... *hint to admins* :p if they did, i wouldn't even need PHP, just plain old HTML+Javascript+Ajax /XMLHttpRequest would suffice |
hanshenrikFeb 12, 2013 10:45 AM
Feb 15, 2013 11:17 AM
#20
hanshenrik said: I made a clone in PHP btw; demo url: http://ks3099534.kimsufi.com/hans/projects/myanimelist_css/MyAnimeListCSSgen.php github: https://github.com/divinity76/MyAnimeListCSSgenPHP although i would be happy if som1 else could host it, i don't really want to host it on my crappy 1gb ram/crapCPU VPS server :/ also: this could be done a lot nicer, more robust, and faster, if MyAnimeList.net could provide list, image, name, about-page url, etc, via an API... *hint to admins* :p if they did, i wouldn't even need PHP, just plain old HTML+Javascript+Ajax /XMLHttpRequest would suffice Did you try http://www.000webhost.com/ ? I've been using them to host a randomizing script for a while. On the other stuff, you'd have to request that in the official forums. But between us its unlikely they would cuz they don't seem interested/able to add any new features at all from what it seems. They haven't even gotten to fixing the tags system after like 2 years and apparently redirect ppl to a userscript to fix it for themselves.. |
Feb 15, 2013 11:18 PM
#21
Shishio-kun said: hanshenrik said: ... Did you try http://www.000webhost.com/ ? I've been using them to host a randomizing script for a while. yea, i did use 000webhost for a while, and they automatically kill any script that use more than... 10? seconds to load, you can't even work around it by set_time_limit() / ini_set(); on a list with 350 entries, the script, on my (crappy) VPS takes about 1 minute and 30 seconds. (specifically, NagisaDango's anime list) tl;dr: the script is too slow for 000webhost.com . (i used 000webhost until they deleted my account because of my PhpBB forum used "too much resources on the MySQL server"/"slow queries" -.- well, at least i got a warning like 1 week before they deleted it.. ) Shishio-kun said: On the other stuff, you'd have to request that in the official forums. ok, i thought so Shishio-kun said: But between us its unlikely they would cuz they don't seem interested/able to add any new features at all from what it seems. They haven't even gotten to fixing the tags system after like 2 years and apparently redirect ppl to a userscript to fix it for themselves.. that's sad.. and very bad trategy-wise, if they wish to stay ahead of competitiors like AnimeNewsNetwork/AniDB/whatever.. but then again, maybe they don't want to, or maybe they just don't care enough, idk.. also on a related note, it seems my script (version mtime(1360692382770)) is bugged :s it fails on at least 1 anime list, i guess i should fix that.. (specifically it fails on "Shishio-kun" :o ) |
Feb 16, 2013 12:22 AM
#22
hanshenrik said: Shishio-kun said: hanshenrik said: ... Did you try http://www.000webhost.com/ ? I've been using them to host a randomizing script for a while. yea, i did use 000webhost for a while, and they automatically kill any script that use more than... 10? seconds to load, you can't even work around it by set_time_limit() / ini_set(); on a list with 350 entries, the script, on my (crappy) VPS takes about 1 minute and 30 seconds. (specifically, NagisaDango's anime list) tl;dr: the script is too slow for 000webhost.com . (i used 000webhost until they deleted my account because of my PhpBB forum used "too much resources on the MySQL server"/"slow queries" -.- well, at least i got a warning like 1 week before they deleted it.. ) Shishio-kun said: On the other stuff, you'd have to request that in the official forums. ok, i thought so Shishio-kun said: But between us its unlikely they would cuz they don't seem interested/able to add any new features at all from what it seems. They haven't even gotten to fixing the tags system after like 2 years and apparently redirect ppl to a userscript to fix it for themselves.. that's sad.. and very bad trategy-wise, if they wish to stay ahead of competitiors like AnimeNewsNetwork/AniDB/whatever.. but then again, maybe they don't want to, or maybe they just don't care enough, idk.. also on a related note, it seems my script (version mtime(1360692382770)) is bugged :s it fails on at least 1 anime list, i guess i should fix that.. (specifically it fails on "Shishio-kun" :o ) What does your script do that it needs that much time to load? |
Feb 16, 2013 5:38 AM
#23
Shishio-kun said: What does your script do that it needs that much time to load? currently, it loads every info page for every entry on the list, in order to find the image url, and that's what takes like ~99% of the time. (like on NagisaDango , it have to load all these pages before it can generate the list: http://pastebin.com/raw.php?i=vX2XFqrv ) and since it currently does no caching/whatever-its-called, see the part about speed here: u531355 said: New version ... 3) Program is now blazing fast even the first time you generate your list. It takes around 15 seconds for a 500 entries-long list. Better than 13 minutes as it was before. It's because it reloads the generated links from the CSS with popular entries. So it only needs to generate links for entries that are on your list but that are not among the 4500 most popular anime/manga of the site. the php script currently doesn't do anything like that, while the java program have a pre-generated list here http://azurah.freehostia.com/animetitles.css (it does use multithreading to load several pages at once though) |
hanshenrikFeb 16, 2013 5:48 AM
Mar 31, 2013 4:10 PM
#24
Program updated! You can now generate covers for all animes/mangas on MAL, not only the 4500 most popular. Btw it's already done in the files on my dropbox. Also it's 30x faster than before because that was done in a stupid way ^^ |
u531355Mar 31, 2013 4:19 PM
Sep 17, 2013 8:36 AM
#25
I would like to change one or two covers in Edit Advanced CSS File itself, and to keep all others as they are in predame/anime.css. Is it possible? |
Sep 17, 2013 9:37 AM
#26
1) You have to generate all the list. 2) Host you picture somewhere. 3) After that find ID of the anime that you want to change. (You can find them on the address bar of the selected anime. For example ID of Bleach is 269 http://myanimelist.net/anime/269/Bleach . 4) Find that ID in the generated CSS #more269 { background-image: url("http://cdn.myanimelist.net/images/anime/3/20349.jpg"); 5) Replace the image link #more269 { background-image: url("http://example.net/bleach.jpg"); 6) Rehost the list. |
AndruhaSep 17, 2013 9:42 AM
(•_•) DEAL ( •_•)>⌐■-■ WITH IT(⌐■_■) YEAAAAAAAAAAHHHHHHHH |
Sep 17, 2013 10:32 AM
#27
I've thought about this way, but it would require that I myself generate new lists in the course of time, when new animes are released, wouldn’t it? Anyway, would be nice if I could write few lines about the covers above the bigger list, and the system could understand that those lines have preference. |
Sep 17, 2013 10:38 AM
#28
Haran said: Yes it would require to update the cover list once in a few months. You can add comments to any CSS code by using /* */ tags.I've thought about this way, but it would require that I myself generate new lists in the course of time, when new animes are released, wouldn’t it? Anyway, would be nice if I could write few lines about the covers above the bigger list, and the system could understand that those lines have preference. For example: #more269 {background-image: url("http://example.net/bleach.jpg);} /* I have changed the cover of this anime*/ |
AndruhaSep 17, 2013 10:45 AM
(•_•) DEAL ( •_•)>⌐■-■ WITH IT(⌐■_■) YEAAAAAAAAAAHHHHHHHH |
Sep 17, 2013 10:53 AM
#29
Haran said: I've thought about this way, but it would require that I myself generate new lists in the course of time, when new animes are released, wouldn’t it? Anyway, would be nice if I could write few lines about the covers above the bigger list, and the system could understand that those lines have preference. If you just add #more269 {background-image: url("http://example.net/bleach.jpg);} after the @imports it should have priority. You might add !important just to be sure though. |
Sep 17, 2013 10:59 AM
#30
dzikibambus said: Haven't though about that. And this is much easier than my method. :DHaran said: I've thought about this way, but it would require that I myself generate new lists in the course of time, when new animes are released, wouldn’t it? Anyway, would be nice if I could write few lines about the covers above the bigger list, and the system could understand that those lines have preference. If you just add #more269 {background-image: url("http://example.net/bleach.jpg);} after the @imports it should have priority. You might add !important just to be sure though. |
(•_•) DEAL ( •_•)>⌐■-■ WITH IT(⌐■_■) YEAAAAAAAAAAHHHHHHHH |
Sep 17, 2013 1:45 PM
#31
dzikibambus said: Haran said: I've thought about this way, but it would require that I myself generate new lists in the course of time, when new animes are released, wouldn’t it? Anyway, would be nice if I could write few lines about the covers above the bigger list, and the system could understand that those lines have preference. If you just add #more269 {background-image: url("http://example.net/bleach.jpg);} after the @imports it should have priority. You might add !important just to be sure though. I tried this option, but the list breaks down: http://myanimelist.net/animelist/Haran |
Sep 17, 2013 1:48 PM
#32
Haran said: I tried this option, but the list breaks down: http://myanimelist.net/animelist/Haran You have to add this after all of the @imports |
Sep 17, 2013 1:55 PM
#33
dzikibambus said: Haran said: I tried this option, but the list breaks down: http://myanimelist.net/animelist/Haran You have to add this after all of the @imports Thank you! I add it on the end of the list and it worked. |
Oct 29, 2013 4:49 PM
#34
it's been working fine til recently but then suddenly it's giving me this java exception error or something, says something about 403 and it can't reach the server for my name, then right after that I'll try again and it'll say done without actually generating a list... I would attach a picture of the error it's giving me but I can't seem to get it to stop doing the thing where it generates an empty list |
Oct 29, 2013 6:27 PM
#35
It looks like Xinil is increasing the security on MAL: http://myanimelist.net/forum/?topicid=639987 I'll see what I can do about it |
Nov 28, 2013 5:09 AM
#36
So whats up? Any updates? Tried to use it today and looks like it isn't generating any links and I can see why. when they added the extra captcha to the site it looks like it broke the api. any updates on when there might be a fix for it? |
Dec 5, 2013 6:11 PM
#37
i think there are some mistakes on the http://dl.dropbox.com/u/49469857/MAL/premade/animetitle.css list. i wanted to have the "hover to preview" add-on by Shishio-kun and one 1 particular anime series there's no image picture. that anime is "Yuusha ni Narenakatta Ore wa Shibushibu Shuushoku wo Ketsui Shimashita" (http://myanimelist.net/anime/18677/Yuusha_ni_Narenakatta_Ore_wa_Shibushibu_Shuushoku_wo_Ketsui_Shimashita./pic&pid=54389). while the code of the anime is 18677, the picture attached next to it on the list, is from another anime called "Nodame". the thing is that i've found more than 3 same pics for the OVA of the same anime and idk what to do! one of the pics was misplaced on the reference of "Yuusha ni Narenakatta Ore wa Shibushibu Shuushoku wo Ketsui Shimashita". anyone help? |
Jan 7, 2014 1:57 PM
#38
AvalonBright said: I noticed the Square layout hasn't updated new covers in awhile so I finally decided to break down and generate my own cover css. But for some reason even though the generator seems to suggest it created a file fine, the .css files are both completely blank. Any idea why..? This generator is blocked awaiting approval by Crave/MAL since their security changes in the fall. They broke every third-party ap. You have to use Hahaido's until then. I also have an updated anime cover CSS, not guaranteeing it will cover all yours but its the top 5000 @import "http://dl.dropbox.com/u/49469857/MAL/premade/anime.css"; Can also read under "Site problems you need to know" on front club page for more info Update! Use this instead, its for your list personally @import url(https://dl.dropboxusercontent.com/u/78340470/Club%20layouts/Users/AvalonBright172014.css); |
Shishio-kunJan 7, 2014 2:31 PM
Jul 30, 2014 11:03 AM
#39
Jul 30, 2014 9:37 PM
#40
@naruutto Do you have a combined Anime + Manga list? You are supposed to generate two different files, because it uses number-based system that MAL uses itself. E.g. http://myanimelist.net/anime/269 - anime #269 is Bleach http://myanimelist.net/manga/269 - manga #269 is Crescent Moon. In your lists link to Bleach and Crescent Moon would be indistinguishable for CSS generator produces - it's the same code for these two covers. |
Jul 31, 2014 12:49 AM
#41
Jul 31, 2014 10:51 AM
#42
I don't understand you. You can't have combined anime-manga list. You can't have combined more (inc. before/after variations) selectors with covers. You can have combined covers file for animetitle, but it will only increase your loading time |
Aug 16, 2014 6:36 PM
#43
You have to set diferent styles in your anime list than your manga list, thay can't use the same style with covers. You must have 2 files, one file for anime covers and another for manga covers. and change that in the styles. The only way to use the same style is that you have a PHP script that check for the page if it is anime or manga list and then sed the right file of covers, but it's easy to have 2 styles and change only the covers file. |
More topics from this board
» [BBCode] Font Awesome Guidehideso - Dec 25, 2023 |
6 |
by Shishio-kun
»»
Nov 26, 12:26 AM |
|
Sticky: » 💚 [REPAIR STICKY] Repair/speed up a design + Request a layout fixShishio-kun - Nov 17, 2023 |
33 |
by Shishio-kun
»»
Nov 25, 11:42 PM |
|
» [CSS - Modern] 🛠️ Tweaks for lists -- Horizontal tags, descriptions, category-coloured text, accent colour, and more.Valerio_Lyndon - Oct 24, 2019 |
20 |
by IridescentJaune
»»
Nov 22, 10:58 PM |
|
» ✳️ Bunkasai 2024 List Design and Graphic Design contests are OPENShishio-kun - Nov 18 |
2 |
by Shishio-kun
»»
Nov 18, 5:01 AM |
|
Sticky: » [ SIGNATURES ~ PROFILES] All guides, generators, and templatesShishio-kun - Feb 16, 2023 |
29 |
by floral_sacrifice
»»
Nov 15, 10:24 AM |