'EIGHTY—8' (FANFIC MASTERLIST / FREE)
EIGHTY—8 / FANFICTION MASTERLIST / FREE
LAYOUT CODE \ NEW SLOT CODE \ NEW CATEGORY CODE
THE CHALLENGE: TO CREATE A LAYOUT THAT HAS NO tiny UPPERCASE FONT FOR THE TEXT COMPONENT, INSTEAD THE FONT SIZES WILL BE 12 AND ABOVE.
CHALLENGED BY: DREAMKEEPER_88
features: main title, links, fanfiction slots (16 slots altogether, can add more see tutorial below), categorised fanfiction (4 categories, can add more see tutorial below).
coder's note: what's up guys? here is a free fanfiction masterlist layout. keeper has a preference for large font sizes within layouts but that isn't exactly my style (as you can see). thus, i decided to take up her challege of creating a layout that has a font size no smaller than 12.
*have a layout challenge for me? send me a challenge in the comments below and i'll pick which ones i think i can do! keep note that the purpose of this is not so that you can request a layout for your thread. i pick whichever i think is a fun challenge. just saying. lol.
LAYOUT CODE \ NEW SLOT CODE \ NEW CATEGORY CODE
THE CHALLENGE: TO CREATE A LAYOUT THAT HAS NO tiny UPPERCASE FONT FOR THE TEXT COMPONENT, INSTEAD THE FONT SIZES WILL BE 12 AND ABOVE.
CHALLENGED BY: DREAMKEEPER_88
features: main title, links, fanfiction slots (16 slots altogether, can add more see tutorial below), categorised fanfiction (4 categories, can add more see tutorial below).
coder's note: what's up guys? here is a free fanfiction masterlist layout. keeper has a preference for large font sizes within layouts but that isn't exactly my style (as you can see). thus, i decided to take up her challege of creating a layout that has a font size no smaller than 12.
*have a layout challenge for me? send me a challenge in the comments below and i'll pick which ones i think i can do! keep note that the purpose of this is not so that you can request a layout for your thread. i pick whichever i think is a fun challenge. just saying. lol.
— how to add a new row of blank slots
adding new slots might be a little difficult so it's recommended that you have at least minimal knowledge of coding. if not, that's fine just follow my instructions carefully and you should be fine... hopefully.
this code adds an extra two slots all the time. there is no code for adding just one slot because then this will become more complex to explain.
1 // open the 'new slot code' link above in a new tab.
2 // in the editor where you have the main layout, click 'source' to access the layout code.
3 // press the keys 'ctrl + f' to do a search for the category title that you want to add a new slot in.
4 // once you've found the section for the category, do another 'ctrl + f' search and search for the following code sequence.
style="float:left;width:900px;height:60px;"
as shown in the screencap below.
THERE WILL BE SEVERAL SEARCH RESULTS OF THE SEQUENCE, YOU NEED TO FIND THE SEQUENCE WITHIN THE CATEGORY YOU WANT TO ADD A NEW SLOT TO. A.K.A. YOU'LL FIND THAT IF YOU KEEP SCROLLING UP DIRECTLY FROM THE CODE SEQUENCE ABOVE, YOU WILL COME ACROSS YOUR CATEGORY TITLE. IF THAT CATEGORY TITLE IS NOT THE ONE YOU WANT TO ADD A NEW SLOT IN THEN YOU OBVIOUSLY HAVE THE WRONG CODE SEQUENCE. IN that CASE, SEARCH FOR THE RIGHT CATEGORY TITLE AND SCROLL DOWN A LITTLE WAYS TILL YOU FIND THE CODE SEQUENCE.
5 // go to the 'new slot code' tab and copy the whole code to your clipboard.
6 // paste the code right before one < / div > and above the code sequence in that category mentioned before, like so.
7 // fin. repeat to add more slots.
— how to add a new category section
similarly to adding a new row of slots, it is recommended that you know minimum to moderate skills in html coding so you don't get too lost.
this code adds a new category section with 4 blank slots.
the steps below is similar to the one above but only up till step 6! from step 6 onwards is different so bare with my copy and pasting for the first 5 steps.
1 // open the 'new category code' link above in a new tab.
2 // in the editor where you have the main layout, click 'source' to access the layout code.
3 // press the keys 'ctrl + f' to do a search for the category title that you want to add a new slot in.
4 // once you've found the section for the category, do another 'ctrl + f' search and search for the following code sequence.
style="float:left;width:900px;height:60px;"
as shown in the screencap below.
THERE WILL BE SEVERAL SEARCH RESULTS OF THE SEQUENCE, YOU CAN PICK WHICHEVER CODE SEQUENCE YOU WANT OUT OF THE SEVERAL SEQUENCES IN THE CODE BUT THIS DEPENDS ON WHERE YOU WANT YOUR NEW CATEGORY SECTION TO BE.
5 // go to the 'new category code' tab and copy the whole code to your clipboard.
6 // paste the code right after the code sequence you see above, like so.
7 // fin. repeat to add a new category section.
— HOW TO change accent/background colour
1 // in 'source', press the keys 'ctrl + f' and search for the following hex code.
#00a99d
there will be two search results, you will need to replace them both.
2 // replace '00a99d' with the hex code of your new colour.
3 // fin.
adding new slots might be a little difficult so it's recommended that you have at least minimal knowledge of coding. if not, that's fine just follow my instructions carefully and you should be fine... hopefully.
this code adds an extra two slots all the time. there is no code for adding just one slot because then this will become more complex to explain.
1 // open the 'new slot code' link above in a new tab.
2 // in the editor where you have the main layout, click 'source' to access the layout code.
3 // press the keys 'ctrl + f' to do a search for the category title that you want to add a new slot in.
4 // once you've found the section for the category, do another 'ctrl + f' search and search for the following code sequence.
style="float:left;width:900px;height:60px;"
as shown in the screencap below.
THERE WILL BE SEVERAL SEARCH RESULTS OF THE SEQUENCE, YOU NEED TO FIND THE SEQUENCE WITHIN THE CATEGORY YOU WANT TO ADD A NEW SLOT TO. A.K.A. YOU'LL FIND THAT IF YOU KEEP SCROLLING UP DIRECTLY FROM THE CODE SEQUENCE ABOVE, YOU WILL COME ACROSS YOUR CATEGORY TITLE. IF THAT CATEGORY TITLE IS NOT THE ONE YOU WANT TO ADD A NEW SLOT IN THEN YOU OBVIOUSLY HAVE THE WRONG CODE SEQUENCE. IN that CASE, SEARCH FOR THE RIGHT CATEGORY TITLE AND SCROLL DOWN A LITTLE WAYS TILL YOU FIND THE CODE SEQUENCE.
5 // go to the 'new slot code' tab and copy the whole code to your clipboard.
6 // paste the code right before one < / div > and above the code sequence in that category mentioned before, like so.
7 // fin. repeat to add more slots.
— how to add a new category section
similarly to adding a new row of slots, it is recommended that you know minimum to moderate skills in html coding so you don't get too lost.
this code adds a new category section with 4 blank slots.
the steps below is similar to the one above but only up till step 6! from step 6 onwards is different so bare with my copy and pasting for the first 5 steps.
1 // open the 'new category code' link above in a new tab.
2 // in the editor where you have the main layout, click 'source' to access the layout code.
3 // press the keys 'ctrl + f' to do a search for the category title that you want to add a new slot in.
4 // once you've found the section for the category, do another 'ctrl + f' search and search for the following code sequence.
style="float:left;width:900px;height:60px;"
as shown in the screencap below.
THERE WILL BE SEVERAL SEARCH RESULTS OF THE SEQUENCE, YOU CAN PICK WHICHEVER CODE SEQUENCE YOU WANT OUT OF THE SEVERAL SEQUENCES IN THE CODE BUT THIS DEPENDS ON WHERE YOU WANT YOUR NEW CATEGORY SECTION TO BE.
5 // go to the 'new category code' tab and copy the whole code to your clipboard.
6 // paste the code right after the code sequence you see above, like so.
7 // fin. repeat to add a new category section.
— HOW TO change accent/background colour
1 // in 'source', press the keys 'ctrl + f' and search for the following hex code.
#00a99d
there will be two search results, you will need to replace them both.
2 // replace '00a99d' with the hex code of your new colour.
3 // fin.
Comments