This layout is custom CSS. If you don't know how to install it, use the easy starter tutorial:
Beginner's Tutorial
For more layouts check the
Full list of Premade Layouts.
More useful topics:
All CSS tutorials * Fixing or changing covers * Changing headers
@\import "
https://malscraper.azurewebsites.net/covers/anime/SpaceCowboy/presets/more";
@\import "
https://dl.dropboxusercontent.com/s/u9g7toc75n415k1/Animation.css";
@\import "
https://dl.dropboxusercontent.com/s/x11zs76iin6vhyh/CategoryMenu.css";
@\import "
https://dl.dropboxusercontent.com/s/y90eox1n4ct1d8t/Reviews.css";
@\import "
https://dl.dropboxusercontent.com/s/rpuekdh94kbmkk7/Style.css";
@\import "
https://dl.dropboxusercontent.com/s/ypgsd1f2yv4ja3i/TabContent.css";
@\import "
https://dl.dropboxusercontent.com/s/0wwdofscwx5ve0i/TopMenu.css";
.status_selected a, .status_not_selected a {
background-image: url(
https://i.imgur.com/NnMeSix.png);
}
#list_surround:before {
background-image: url(
https://i.imgur.com/702OVZ2.png);
background-size: 100% 100%;
z-index: -1;
}
#list_surround:after {
background-image: url(
https://i.imgur.com/WdjNmmU.png);
background-size: 100% 100%;
}
.header_cw span:before, .header_completed span:before, .header_onhold span:before, .header_dropped span:before, .header_ptw span:before {
position: absolute;
display: block;
content: '';
margin-top: 118px;
margin-left: 57px;
width: 350px;
height: 40px;
background-image: url(
https://i.imgur.com/Nh9kYVA.png);
background-repeat: no-repeat;
background-size: 100% 100%;
z-index: -1;
}
/* CURRENTLY WATCHING BACKGROUND */
.status_selected:first-child {
background-image: url(
https://i.imgur.com/7YeSE5a.jpg);
}
/* COMPLETED BACKGROUND */
.status_selected:nth-child(2) {
background-image: url(
https://i.imgur.com/MWYe6Io.jpg);
}
/* ON-HOLD BACKGROUND */
.status_selected:nth-child(3) {
background-image: url(
https://i.imgur.com/yqbYxOA.jpg);
}
/* DROPPED BACKGROUND */
.status_selected:nth-child(4) {
background-image: url(
https://i.imgur.com/nSckyoq.jpg);
}
/* PLANNED BACKGROUND */
.status_selected:nth-child(5) {
background-image: url(
https://i.imgur.com/7tt7rHP.jpg);
}
/* ALL BACKGROUND */
.status_selected:last-child {
background-image: url(
https://i.imgur.com/iFfvL2Y.jpg);
}
#grand_totals:before, .category_totals:before, #copyright:before {
pointer-events: none;
display: block;
content: '';
margin-left: -6px;
margin-top: -8px;
width: 493px;
height: 40px;
background-image: url(
https://i.imgur.com/3TA3Kre.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
#inlineContent:before {
right: 134px;
margin-top: -390px;
width: 597px;
height: 772px;
background-image: url(
https://i.imgur.com/UPdCcbs.png);
background-size: 100% 100%;
}
#inlineContent:after {
left: 4px;
bottom: 4px;
width: 450px;
height: 226px;
background-image: url(
https://i.imgur.com/kAx0VMR.png);
}
@media only screen and (max-width: 1366px) {
.status_selected a, .status_not_selected a {
background-image: url(
https://i.imgur.com/bI98BeS.png);
}
.header_cw span, .header_completed span, .header_onhold span, .header_dropped span, .header_ptw span {
background-image: url(
https://i.imgur.com/2o1QNBU.png);
}
}
For a better display, it's recommended you lower the number of list columns to better accommodate the layout table:
https://myanimelist.net/editprofile.php?go=listpreferences
You can also start the layout on Currently Watching or Reading rather than a larger category (go to Default Status Selected) to help speed up the load time. Save when done.
To further speed up the loading time of the list, you can delete any malscraper imports (these are for preview pics) and then use part B from this page:
https://myanimelist.net/forum/?topicid=439897
Paste the correct malscraper import from part B into your code (use the "more" import). You also need to switch the username SpaceCowboy with your own username. This can significantly speed up your lists.
If you are using this design on manga lists, you can add the matching manga import from part B and do the same. Switch DateYutaka with your own username.