[attr="class","ninecodes"]
[attr="class","ninecodestop"]
[attr="class","ninecodestopleft"]waste it on me
[attr="class","ninecodestopright"][HASH]jcink [HASH]skin [HASH]rainbow [HASH]pastel [HASH]gradients[break]
live preview[attr="class","ninecodesbody"]
features
- 1200px wide forum with a carousel-type header
- Comes with forum-specific images (will require some finagling)
- Rainbow pastel colors theme geared towards entertainment rp sites
- Full custom HTML including mini profiles
- 200x400 Mini Profile hovers
- HoneyBee IconFont by ThemeHive
[attr="class","ninecodesbody"]
how to install
- Download the XML file attachment titled "Waste it on Me.xml"
- Log into your Jcink Admin Panel
- Navigate to Skins & Templates then select Manage Skin Sets
- Navigate to the section titled Create New Skin Set and find the option: Choose a skin XML file to one-click install a new skin. Upload the XML attachment you've downloaded. Hit "Create New Skin Set".
- Once you have uploaded the file, you will see a new skin installed in that section that operates as an overview of all the skins currently installed. You can use the links in that menu to quickly navigate to access the wrappers, style sheets, HTML templates, and macros.
- Next, go to back to the System Settings category and then select Topics, Posts & Polls. In the first section titled "Topics", find the last entry "Number of topics to show in 'Recent Topic Activity' display?" and set that field to "1" to enable the most recent post/topic in the Board Statistic.
[attr="class","ninecodesbody"]
customizing
- Remember to set up your Custom Fields first before plugging them in/editing the HTML Templates. Be sure to write down the Custom Field #s down so you can plug them in accordingly where it corresponds in the skin.
- The board images can be edited by adding new div classes called "#b1" with the number "1" corresponding to the forum id number. If you don't know what the forum id number is, simply click on a forum and look at the last digit in the url address. So this means you'll need a new div id class for each board image you want to customize. You can always change the default board image by finding ".boardimg" in the css.
- The discord and affiliates sections are actually located in the Board Statistics HTML Template; simply locate Skins & Templates, then select HTML Templates, hit "Edit" for the "Waste it on Me" skin, then modify Board Stats (it should be the very first one in the list).
- Be sure to go in every HTML Template to see what needs to be customized/revised according to your needs!
[attr="class","ninecodesbody"]
terms of service
- Due to this skin utilizing a lot of gradients, you'll need to be careful on how you change the colors, etc. if you want to keep the skin looking consistent. If you're having trouble editing the gradients, I would suggest ColorZilla as a quick and simple gradient css generator.
- General coding troubleshooting should be done in the Coding Help board but any questions or feedback are welcome in this thread. I'll try my best to assist you should you run into problems.
- As always, please leave my credit/copyright intact!
[googlefont="Roboto"]
[googlefont="Roboto Mono:100,300,400,500,700"]
[newclass=".ninecodes"]font-family: Roboto Mono; width: 500px; margin: 30px auto; background: white; box-sizing: border-box; color: #8d929c;[/newclass]
[newclass=".ninecodes a"]font-family: Roboto; color: #f2426e; letter-spacing: 0px;[/newclass]
[newclass=".ninecodestop"]position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; padding: 60px 30px; background-color: rgba(51, 34, 47, 0.85); background-image: url(https://image.ibb.co/gDKatL/image.png); background-size: cover; background-blend-mode: darken;[/newclass]
[newclass=".ninecodestop:before"]content: " "; width: 260px; height: 220px; position: absolute; -webkit-clip-path: polygon(0 0, 100% 0%, 85% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0%, 85% 100%, 0% 100%); background: rgba(242, 66, 110,0.25); left: 0px; z-index: 1;[/newclass]
[newclass=".ninecodestopleft"]width: 50%; font-weight: 100; font-size: 40px; line-height: 30px; text-align: right; padding: 20px; color: #FFFFFF; position: relative; z-index: 1;[/newclass]
[newclass=".ninecodestopright"]width: 50%; font-size: 10px; position: relative; z-index: 1;text-align:left;[/newclass]
[newclass=".ninecodestopright a"]font-family:Roboto Mono;text-decoration: none; color: white; background: #ec6789; padding: 2px 4px; line-height: 220%;[/newclass]
[newclass=".ninecodestopright a:last-child]background: #56b8ff;[/newclass]
[newclass=".ninecodesbody"]padding: 30px; font-family: Roboto; font-size: 11px; border-bottom: 1px solid #efefef;[/newclass]
[newclass=".ninecodesbody:last-child"]border-bottom: 0px solid white;[/newclass]
[newclass=".ninecodesbody b"]color: #ec6789;[/newclass]
[newclass=".ninecodes h1"]font-family: Roboto Mono; font-weight: 300; word-spacing: -4px; text-transform: lowercase; font-size: 22px; margin: 0px; padding: 0px; margin-bottom: 10px;[/newclass]
[newclass=".ninecodes h1:before"]content: "//"; color: #f2426e; font-weight: 300; font-size: 26px; margin-right: 5px;[/newclass]
[newclass=".ninecodes li"]padding: 4px 40px 4px 0px;line-height:150%;[/newclass]
[newclass=".here"]here[/newclass]
[newclass=".here"]here[/newclass]
[newclass=".here"]here[/newclass]
[newclass=".here"]here[/newclass]
[newclass=".here"]here[/newclass]