The_65 said: Did you write this code yourself? I'm assuming the original picture is actually in the @ import .CSS so you need !important; to force the ruleI very recently got MAL for the first time and delved pretty much immediately into learning how to customize my profile. After lurking around a bit and stealing a template to customize a bit, I ran into an issue that I cant figure out for the life of me what is going on. As an example for the image that I want to replace, I will be using this: In my Advanced CSS options I was able to locate the url of the image that was being used by default, from the user that created the template. I created a correctly scaled image that I wanted to use (Image earlier) This change can be clearly located right here:  However, despite the change that I made, it continues to use the default image from the users template, and I cant for the life of me find out why or how to change it. Seen here;  If anyone has any idea whats going on or maybe some alternative way to fix it, It would be greatly appreciated. Full Advanced CSS Here:  #mal_cs_pic a[href="/"],
#mal_cs_links a[href="/"] { /*Topbar Character*/
background-image: url("http://i.imgur.com/ELKmJeV.png")!important;
background-repeat: no-repeat;
} |
[/size]Did you write this code yourself? I'm assuming the original picture is actually in the @ import .CSS so you need !important; to force the rule#mal_cs_pic a[href="/"],
#mal_cs_links a[href="/"] { /*Topbar Character*/
background-image: url("http://i.imgur.com/ELKmJeV.png")!important;
background-repeat: no-repeat;
}I didn't write the code myself, I kinda ripped it from a template and messed around with it. I know very little about coding so this was a huge help and it fixed my problem. Thanks a bunch. |
The_65 said: Did you write this code yourself? I'm assuming the original picture is actually in the @ import .CSS so you need !important; to force the rule #mal_cs_pic a[href="/"],
#mal_cs_links a[href="/"] { /*Topbar Character*/
background-image: url("http://i.imgur.com/ELKmJeV.png")!important;
background-repeat: no-repeat;
}I didn't write the code myself, I kinda ripped it from a template and messed around with it. I know very little about coding so this was a huge help and it fixed my problem. Thanks a bunch. No problems ^^ by the way, your weed smoking yui pictures makes my nose smell smoke @ _ @ '' |
Tomato said: The_65 said: Did you write this code yourself? I'm assuming the original picture is actually in the @ import .CSS so you need !important; to force the rule #mal_cs_pic a[href="/"],
#mal_cs_links a[href="/"] { /*Topbar Character*/
background-image: url("http://i.imgur.com/ELKmJeV.png")!important;
background-repeat: no-repeat;
}I didn't write the code myself, I kinda ripped it from a template and messed around with it. I know very little about coding so this was a huge help and it fixed my problem. Thanks a bunch. No problems ^^ by the way, your weed smoking yui pictures makes my nose smell smoke @ _ @ '' Working as intended. It's always good to smell that good good. |
| Don't really know where to post this, i am using one of those public layouts everybody has and recently it started messing up and looking like this: http://i.imgur.com/gPlgO5L.jpg Can you guys help me? :D |
GuillaumeFDR said: Hello, I don't know why, but my custom CSS has been reinitialized, and I can't find again how to have anime covers in HD (it's for a modern-based css). Anyone have an idea? Thanks! Try these lines of code at the top of your CSS (one at a time) @import url(https://malcat-gen.appspot.com/series?preset=datatitle); @import url(https://malcat-gen.appspot.com/series?preset=datatitlebefore); @import url(https://malcat-gen.appspot.com/series?preset=dataimagelink); @import url(https://malcat-gen.appspot.com/series?preset=dataimagelinkbefore); Gaporigo said: Don't really know where to post this, i am using one of those public layouts everybody has and recently it started messing up and looking like this: http://i.imgur.com/gPlgO5L.jpg Can you guys help me? :D The dropbox link in the CSS was cut off. The person who made the layout has to give you a new import link to that CSS on their dropbox |
Hey, I want to put an image as a preview in my anime/manga list, like in this one: How can I do that? |
| Hey guys, how can I make the Currently Watching table (only that table) to be ordered alphabetically by the Tags column? |
 |
Cazador75 said: Unfortunately this is not possible. Tags are not sortable in that way (you can only search by tag, not sort), and there is no way to auto-sort a table on page load for every visitor.Hey guys, how can I make the Currently Watching table (only that table) to be ordered alphabetically by the Tags column? |
| Hello, guys, is there any easy way to make my anime list design more cute or atleast likable? I mean, now its convenient, but i feel like its a bit dull |
| “All men are jealous idiots. And women are stupid too, to feel happy about it. It's true, there are idiots everywhere!” “I know it's difficult to look past my brilliant tail, brain and looks, but I also have excellent ears and eyes.” “I need to have a drink, and I need one soon!” “I am Holo the Wise Wolf so you shut up!” |
| I wrote a tutorial on this https://myanimelist.net/forum/?topicid=563993 follow instructions on moving the pic where you want it, and I would suggest to update the covers with MALcat https://myanimelist.net/forum/?topicid=443333 Mamokaru said: Hello, guys, is there any easy way to make my anime list design more cute or atleast likable? I mean, now its convenient, but i feel like its a bit dull Dunno what you mean by cute or likable, that's a matter of preference. Use a premade layout and give it a cute background? https://myanimelist.net/forum/?topicid=1499058 |
Matuquicas said: So I already put the cover preview on my AnimeList. Thanks for the links. However, when I started editing the layout (made by isaychris) a few months ago, I deleted the More button on the CSS. Now I want to get it back. I don't remember the code and I don't find it. If I don't remember correctly, @Shishio-kun, I read once that if you put the cover preview, the More button won't work. Maybe that's why I deleted it. Is there any code to make it work? Help appreciated, ty. Probably, that style of covers can't use the more button. There is no code I know of to make the More button work all of a sudden with it. There's a way to use similar covers that do allow the more button but it's complicated and would require a lot of changes and personal research |
| I use layot code made by nobluesky and i wanna change the style of titles (All Anime, Currently Watching, and so on). They're italicized now, how can i make them bold or smth like that? |
| “All men are jealous idiots. And women are stupid too, to feel happy about it. It's true, there are idiots everywhere!” “I know it's difficult to look past my brilliant tail, brain and looks, but I also have excellent ears and eyes.” “I need to have a drink, and I need one soon!” “I am Holo the Wise Wolf so you shut up!” |
Mamokaru said: I use layot code made by nobluesky and i wanna change the style of titles (All Anime, Currently Watching, and so on). They're italicized now, how can i make them bold or smth like that? Probably .list-unit .list-status-title .text { font-style: bold !important; } |
| @Shishio-kun That worked out well. Thank you very much. |
| “All men are jealous idiots. And women are stupid too, to feel happy about it. It's true, there are idiots everywhere!” “I know it's difficult to look past my brilliant tail, brain and looks, but I also have excellent ears and eyes.” “I need to have a drink, and I need one soon!” “I am Holo the Wise Wolf so you shut up!” |
| I need help to make my list transparent so I can see my background and the tab that has quick add,anime list,etc is just sitting on the screen. |
AnimeDash said: I need help to make my list transparent so I can see my background and the tab that has quick add,anime list,etc is just sitting on the screen.  Using an RGBA colour code should do what you want. Your items have white backgrounds so that's 255 RGB, and the last number (the 0.5) is the transparency in decimal form. So 0.5 is 50%, 0.45 is 45%, etcetera..list-menu-float .icon-menu {
background: rgba(255,255,255,0.5);
} |
| I did that and nothing changed unless I'm in the wrong spot http://prntscr.com/glca51 |
AnimeDash said: Ah, it might be my bad, the !important shouldn't be in quotes. So it should look like the !important used above on the width statement.I did that and nothing changed unless I'm in the wrong spot http://prntscr.com/glca51 background-color: rgba(255,255,255,0.5) !important; Also, just want to make sure you know that this background is only applying when you hover the mouse over it with the code you are currently using. |
| I fixed that now. Now how do I make the blue box background on my list transparent so I can see my whole actual background. |
AnimeDash said: Hmm, well that appears to use a gradient. Essentially it's the same deal though, just use RGBA and choose the transparency you want.I fixed that now. Now how do I make the blue box background on my list transparent so I can see my whole actual background. This is what it looks like normally (after having removed a lot of unnecessary other text): .list-unit {
background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(36,66,145,1));
}So what's going on here is really just the same as what we did before, but with a two colour gradient. So you would just change that last number to a decimal number of whatever percentage you wanted. So let's just do 50% once again, it would become this: background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(36,66,145,0.5)); Side note You may also see some lines that look like this: (same thing as before but prefixed with "-o-" or "-webkit-" etc) background: -webkit-linear-gradient(rgba(0,0,0,.4), transparent); background: -o-linear-gradient(rgba(0,0,0,.4), transparent); background: -moz-linear-gradient(rgba(0,0,0,.4), transparent); |
| One last thing, Is it possible to make it completely invisible. |
AnimeDash said: Yep, if you want it totally invisible just set the transparency value to 0. So a totally invisible background would look like this:One last thing, Is it possible to make it completely invisible. rgba(255,255,255,0) Or for the shortest amount of text (since the actual colour doesn't matter) you could set it to this (which is my preferred method). rgba(0,0,0,0) As long as the end number (the number that controls transparency) is set to 0, it will be fully see-through. |
| Thanks for all the help :D |
AnimeDash said: Glad to have been of assistance. :3Thanks for all the help :D |
Valerio_LyndonMay 6, 2018 4:22 AM
NAZMUS_SHADAT said: Hey there, I recorded a short video instead of pictures. Hope it fixes it for you. :)The anime covers or thumbnails are missing in my classic css animelist.how to fix it?Please help with picures.i am not good with written tutorials.. Here is the line for copy-paste (watch video for reference on how to use): @\import "https://malscraper.azurewebsites.net/covers/auto/presets/more"; |
| Is there a way to change the color of a Modern list? Changing the blue for gray in the Dark Blue theme for example (Only that color in text, covers, titles, etc) Thanks :) |
 |
JoaquinBobxD said: I made some code to do this a while back, you could give it a shot. :) Just add it underneath the "Add Custom CSS" header on your style. I set the colours to a light grey already, but to change it just check out the top of the code. There's commented instructions there for various options, including the banner.Is there a way to change the color of a Modern list? Changing the blue for gray in the Dark Blue theme for example (Only that color in text, covers, titles, etc) Thanks :) |
| I need help. I use the classic style for my lists. I want to change the colors on my anime list, like I had done with my manga list. Thing is, I customized my manga list years ago. So I can't remember how I did it. I just want to switch around the colors. I checked it out on the list tab in the settings, but there's numbers and other codes I don't understand at all. I literally don't remember how I did it. |
  |
toastyschoolgirl said: I'm new to MAL. I tried following a tutorial for changing my themes and I copy and pasted a CSS link into my box to change my lists. It completely ruined my pages and I can't fix them. I can't even find a settings icon on my lists. Even if I follow a guide that has a link to the editing profile settings and try to reset everything, it doesn't work. I don't know what to do. I don't even know If this message will get anywhere. Can you describe what you are seeing, maybe a screenshot? What box did you post the CSS codes to (link what page it was on)? And what pages are you referring to that got ruined- just the list pages or is it the forum too? This is what I see on your lists, it looks normal.  |
Shishio-kunOct 26, 2019 12:52 PM
Liaeves said: I need help. I use the classic style for my lists. I want to change the colors on my anime list, like I had done with my manga list. Thing is, I customized my manga list years ago. So I can't remember how I did it. I just want to switch around the colors. I checked it out on the list tab in the settings, but there's numbers and other codes I don't understand at all. I literally don't remember how I did it. You can go to your CSS and you see /* // Determines the positioning of your list */ #list_surround { margin: 0 auto; width: 920px; } You can add on a new line under width:920px; with this code background-color: red; that would change the list to red. You can choose the color instead of red tho, like blue, green or an HTML color which is way more specific and will be a number code instead of a color name (Google for a HTML color picker). Then there's like other sections under that section with their own lines of code. You can add background-color: red; to those sections and change the colors for them too. It's hard to say what the section is for and where the color will show up, you just have to experiment and add colors and save until you color the sections you want. But see in your CSS /* // Alternating row color 1 */ .td1 { color: #000000; border-width: 0px 1px 1px 0px; border-style: solid; border-color: #ABABAB; padding: 2px; background-color: #FFFFFF; } /* // Alternating row color 2 */ .td2 { color: #000000; border-width: 0px 1px 1px 0px; border-style: solid; border-color: #ABABAB; padding: 2px; background-color: #F1F1F1; } is where the background-color codes for the anime list rows are. You can adjust those colors there. Just delete the old color code and replace it with a new one. They're already using HTML color codes, it seems :D |
| So I'm wondering if I some how did something or if it's just my computer, but no mater what I do to try and edit my anime and manga lists I keep getting the "wheel of death" that wont go away no mater how long I wait. |
MelissaWolf said: Seems to be happening to everyone. Or at least, everyone I've heard from. There's an ongoing thread about it in the support forum.So I'm wondering if I some how did something or if it's just my computer, but no mater what I do to try and edit my anime and manga lists I keep getting the "wheel of death" that wont go away no mater how long I wait. |
MachioSenpai said: To completely reset your changes to default (image banner, background image, CSS), click "Reset to Default" at the bottom of the customization section.I recently made some changes to my list style settings that i'm having trouble undo, is there any way of completely resetting all of it?  If you're trying to do something more precise, such as revert a custom CSS design, then you'll have to be a bit more specific (and share your code). |
You could achieve something like this with a ::before or ::after "pseudo element", or by re-purposing one of the elements already on the page by giving it a background-image. What method is best depends on what image you're trying to use and where you're trying to place it. As an example of adding in an image, here's some code to add an image in this spot: .list-table {
display: flow-root;
padding-top: 250px;
border: none;
}
.list-table-header::before {
content: "";
display: block;
width: 100%;
height: 250px;
background-image: url(https://placeholder.com/wp-content/uploads/2019/06/lorem-ipsum.png);
background-size: auto 100%;
background-position: left center;
background-repeat: no-repeat;
} |
Valerio_Lyndon said: You could achieve something like this with a ::before or ::after "pseudo element", or by re-purposing one of the elements already on the page by giving it a background-image. What method is best depends on what image you're trying to use and where you're trying to place it. As an example of adding in an image, here's some code to add an image in this spot: .list-table {
display: flow-root;
padding-top: 250px;
border: none;
}
.list-table-header::before {
content: "";
display: block;
width: 100%;
height: 250px;
background-image: url(https://placeholder.com/wp-content/uploads/2019/06/lorem-ipsum.png);
background-size: auto 100%;
background-position: left center;
background-repeat: no-repeat;
}Ok, I took that code and used it. Now, I tried to insert a line to set background opacity, but I couldn't. I saved the code with the image so that you can get the idea of what I would like to do |
EverettDucklair said: No, you wouldn't be able to change the background directly, since the white background you see is actually not from the "::before" element, but its parent. So, you would have to change the background of its parent. But, this is why I said there are various methods depending on how you wish for it to look and where you want the image placed. For instance, an example of the image being placed above the entire list, so that it could have its own background.Ok, I took that code and used it. Now, I tried to insert a line to set background opacity, but I couldn't. I saved the code with the image so that you can get the idea of what I would like to do  .list-block::before {
content: "";
display: block;
width: 1424px;
max-width: calc(81% + 64px);
height: 250px;
background-color: rgba(0,0,0,0.2);
background-image: url(https://placeholder.com/wp-content/uploads/2019/06/lorem-ipsum.png);
background-size: contain;
background-position: left center;
background-repeat: no-repeat;
margin: 96px auto -96px;
}If you want something more specific than that, you'll have to describe what it is. |
| Posts from another thread merged into this one. |
 |
It might come back by itself, but if it doesn't or you want an instant fix, you can replace this line:@\import "https://malscraper.azurewebsites.net/covers/auto/presets/more"; With this line: @\import "https://dl.dropboxusercontent.com/s/r89y41zqmt8waaz/animelist_more.css"; I recommend waiting a day or two to see if the cover generator repairs itself, but this fix will be there either way. |
How to remove the black strip background for the headers (shown in red line) |
StahpTouchinMeh said: How to remove the black strip background for the headers (shown in red line) https://i.imgur.com/hmZrZhL.png You can either: Go to line 108 and delete the "background-color: #000000;" text. Image Example Or add this to the bottom of your CSS: table[class^=header] { background: none; } |
More topics from this board
» Protect or punish?DollzchanAi - Apr 18 |
4 |
by DollzchanAi
»»
3 minutes ago |
|
» BL reference in Tomodachi LifeKinspie13 - 11 hours ago |
4 |
by Kinspie13
»»
9 hours ago |
|
» How to Export/Backup Your Anime List Automatically! (TamperMonkey Script)hacker09 - May 18, 2020 |
3 |
by Vapor_AU
»»
10 hours ago |
|
» advice for someone returning to artCrystepsi - Apr 4 |
5 |
by haaku-san
»»
Yesterday, 4:21 PM |
|
» Share an ai anime picNowOldCow - Dec 6, 2023 |
19 |
by loligoth666
»»
Yesterday, 9:23 AM |