Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
forum_css [2023/09/07 03:36] – [Theme Selectors.] kallisteroforum_css [2025/08/26 19:49] (current) – [How to access MelonLand's forum profile customization?] centered image ribose
Line 1: Line 1:
-__WIP - A list of tips and snippets for customizing MelonLand forum profile CSS.__+For Guild CSS Edits, see [[guild_css|this page]]!
  
 ====== How to access MelonLand's forum profile customization? ====== ====== How to access MelonLand's forum profile customization? ======
  
-From your main profile view, go to //Modify Profile// category > //Ultimate Profile// > Scroll down to //Customization// text field.+From your main profile view, go to //Modify Profile// category > //[[https://forum.melonland.net/index.php?action=profile;area=customized|About Me / Profile]]// > Scroll down to //Customization// text field.
  
-[[https://i.imgur.com/99JAnek.png|Image Example]]+{{ https://i.imgur.com/99JAnek.png?725 |Profile customization area}}
  
 ===== How do I start? ===== ===== How do I start? =====
Line 30: Line 30:
 The easiest way to give your MelonLand profile some unique, fun individuality, is by adding custom category and text colors! The easiest way to give your MelonLand profile some unique, fun individuality, is by adding custom category and text colors!
  
-[[https://i.imgur.com/VsNMhAR.png|Image Example]] +{{https://i.imgur.com/VsNMhAR.png|Color example}}
  
 Between your //style// tags, insert the following lines: Between your //style// tags, insert the following lines:
Line 63: Line 63:
 Make your profile visitors feel as if they just landed in another world! Make your profile visitors feel as if they just landed in another world!
  
-[[https://i.imgur.com/kwSvdVm.png|Image Example]]   +{{https://i.imgur.com/kwSvdVm.png|Background example}} 
  
 The MelonLand forum background is made up of different layers. Specifically: The MelonLand forum background is made up of different layers. Specifically:
Line 93: Line 93:
 The cherry on top! The cherry on top!
  
-[[https://i.imgur.com/RMy2Ojl.png|Image Example]]+{{https://i.imgur.com/RMy2Ojl.png|Extra image example}}
  
 We will start by defining our own custom element, using the //div// tags to contain our new image. We will start by defining our own custom element, using the //div// tags to contain our new image.
Line 139: Line 139:
 Because empty space should not go to waste! Because empty space should not go to waste!
  
-[[https://i.imgur.com/QHWwEBd.jpg|Image Example]]+{{https://i.imgur.com/QHWwEBd.jpg|Extra image example 2}}
  
 Between your //style// tags, insert the following lines and fill the //MISSING//: Between your //style// tags, insert the following lines and fill the //MISSING//:
Line 273: Line 273:
   * **#melonland-surf-club + p** - The holster for the forum links at the top (Home, Entrance, Wiki, etc.)   * **#melonland-surf-club + p** - The holster for the forum links at the top (Home, Entrance, Wiki, etc.)
   * **#melonland-surf-club + p a** - All individual forum links at the top   * **#melonland-surf-club + p a** - All individual forum links at the top
-  * **#melonland-surf-club + p a:first-child** - "Home" link +  * **#melonland-surf-club + p a:first-child** - "Entrance" link 
-  * **#melonland-surf-club + p a:first-child img** - "Home" link image +  * **#melonland-surf-club + p a:first-child img** - "Entrance" link image 
-  * **#melonland-surf-club + p a:nth-child(2)** - "Entrance" link +  * **#melonland-surf-club + p a:nth-child(2)** - "Events" link 
-  * **#melonland-surf-club + p a:nth-child(2) img** - "Entrance" link image +  * **#melonland-surf-club + p a:nth-child(2) img** - "Events" link image 
-  * **#melonland-surf-club + p a:nth-child(3)** - "Wiki" link +  * **#melonland-surf-club + p a:nth-child(3)** - "Profile" link 
-  * **#melonland-surf-club + p a:nth-child(3) img** - "Wiki" link image +  * **#melonland-surf-club + p a:nth-child(3) img** - "Profile" link image 
-  * **#melonland-surf-club + p a:nth-child(4)** - "Search" link +  * **#melonland-surf-club + p a:nth-child(4)** - "Chat" link 
-  * **#melonland-surf-club + p a:nth-child(4) img** - "Search" link image +  * **#melonland-surf-club + p a:nth-child(4) img** - "Chat" link image 
-  * **#melonland-surf-club + p a:nth-child(5)** - "Profile" link +  * **#melonland-surf-club + p a:nth-child(5)** - "Art" link 
-  * **#melonland-surf-club + p a:nth-child(5) img** - "Profile" link image +  * **#melonland-surf-club + p a:nth-child(5) img** - "Art" link image 
-  * **#melonland-surf-club + p a:nth-child(6)** - "Logout" link +  * **#melonland-surf-club + p a:nth-child(6)** - "Search" link 
-  * **#melonland-surf-club + p a:nth-child(6) img** - "Logout" link image+  * **#melonland-surf-club + p a:nth-child(6) img** - "Search" link image 
 +etc etc for each link...
  
 ---- ----