Username:
Password:
Remember me:
Register

Back to forum: Profile Design (3DSPlaza BBCode and BBCode CSS)


Search forums via Google


1 Users appreciate this thread.

Profile help
Started by CrypticTAWOG
(2017-09-30 16:23:20)
CrypticTAWOG (2017-09-30 16:23:20)
This is the Profile coding help part of our center! we have organized codes to help you get your codes faster!

Backgrounds show

[style ]body{background:Color Here;}[/ style]
This codes sets a color for your outer background

[style ]body{background:url('Image url here');}[/ style]
This code sets an image for your outer background

[style ].content{background:Color Here;}[/ style]
This code sets a color for your main background

[style ].content{background:url('Image Url Here');}[/ style]
This code sets an image for your main background

[style ]div{background:url('Image Url Here');}[/ style]
This code sets an image as your ENTIRE background

[style ]div.content{opacity:0.65;}[/ style]
This code is a little advanced; This code makes your profile transparent so you can see the background image, setting the opacity to 0.0 will make your profile invisible

[style ]body{background:color here; background-image:color here; opacity:0.7;}[/ style]
This code sets can set a image AND a color, it also works with opacity too, but if you want it to be a image change the 'color here' and put a URL there too.

NOTE THE [style] AND [/style] DO NOT REQUIRE SPACES! DO NOT USE SPACES IN YOUR CODES AT ALL!! plus! Add 'quotes' in your URLs at start and end or elae they won't work! plusplus! ADD [style] AND [/style] TO THESE CODES OR ELSE THEY WILL NOT WORK!!

Members Menu show

div.members_menu{color:lime; background:black;border:2px double lime;}
This allows you to personalize the members login menu

div.members_menu{background-image:url(Image url here);}
This code sets an Image URL to the members login menu

.members_menu:before{color:green; content:'Words you want to say here';}
This code can add words to the members menu, if you want words AFTER the text you have to change 'before' to 'after'

Back to the Menu show


div.menu{color:black;background:green; border:5px ridge silver;}
This code lets you design the 'Back to the Menu' button however you like with colors!

div.menu{background-image:url(Image Url Here);}
This code sets a image to the 'Back to the Menu' button

div.menu:after{color:lime;content:'Words you would like to say here';}
This code allows you to add words around the 'Back to the Menu' button. if you want words BEFORE the Text, change the 'after' to 'before'
REMEMBER! YOU CANNOT REMOVE THE 'Back to the Menu' TEXT SO YOU HAVE TO WORK AROUND IT!!

Profile Header 2 show

h2{background:black;color:lime;font-weight:bold;border:8px double lime;}
This code allows you to set a color and border around your profile

h2 {content: url('URL here');width:200px;height:200px;border-radius:50%;}
This code sets an image for your profile picture, setting the radius to 0% makes the image square

h2:before{content:'Words you'd like to say here';color:blue;}
This code adds words to your profile

h2{content:url(url);}
This code adds a Gif to your profile, BUT REMEMBER! BOOKMARK YOUR EDIT PROFILE PAGE OR ELSE YOU'LL NEVER BE ABLE TO EDIT YOUR PROFILE AGAIN!!!

Title Box show

div.titlebox:before{color:red;content:'Words you want to say here';}
This code sets words before or after [depending on what you set for either 'before' or 'after'] the 'Comments' part

.titlebox{background-image:none !important; background-color:black !important;color:white !important;}
This code is advanced; it allows you to set an image OR a color to the title boxes

Comment Boxes show

.commentbox_1{color:lime;background-image:url(Image Url here);}
This code sets a color to text AND a image for your first comment box

.commentbox_2{color:green;background-image:url(Url Here);}
This code sets a color to text AND a image for your second comment box

.commentbox_1{color:white;background-color:Color Here;}
This code is advanced; it sets the background to any color and the text to any color as well

.post_comment{background:Color Here;}
This code sets a background for the 'Post' Box

.post_comment{background-image:url(Image Url Here);}
This code sets an image for the 'Post' button

.post_comment textarea{background-image:url(Image Url Here);}
This code is advanced; This code sets a image for your text box

.post comment textarea{border:5px double green;}
This code sets a border around the textarea

.edit_warning:before(or after){content:'Text inserted here.';color:#173B0B;}
This code is advanced; This code sets text to a edit warning AND you have to use HEX coding ['#11ffcc'] to change the color

.edit_warning{display:none;}
This code makes the edit warning go away

input{background-color:black;color:lime;}
This code in advanced; This code changes the post comment button and the view users profile bar

Links and Hovers show

a:link{color:Color Here;}
This code shanges the color of a link

a:visited{color:Color Here;}
This code changes a visited links color

a:link{text-decoration:none;}
This code gets rid of an underline on a link

a:visited{text-decoration:none;}
This code gets rid of underlining on a visited link

a:hover{text-transform:uppercase;}
This code changes a link hover text to uppercase

a:hover{background-image:url(Image url here);}
This code adds a image to a link you hover over

a:hover{border:2px ridge lime;}
This code adds a border arround all links on your profile

body, a:hover{cursor:url(Url Here), progress!important;}
This code changes your mouse cursor to ANYTHING!!

Profile Text show

.content{color:Color Here;}
This code sets the main color for the text on your profile.

.content{color:yellow;font-weight:bold;text-decoration:underline;}
This code does some advance designing to your profile text.

.content{text-align:center;}
This code centers the text on your profile.

.content{font-family:Type of font you want;}
This code changes the font on your profile to any font you'd like. However, please note it's only visible on the pc, and not all fonts work.

body{background-color:none!important; color:Color here;text-shadow:1px 1px Color here, -1px -1px White; font-family:none;font-weight:bold;font-size:15px ;}
This is a very advanced code that applies shadowing to your text on the computer. Personally, I think it's very hard on the eyes.

.content{text-shadow: 5px 5px 5px #FF0000;}
This code is actually a much more simple way to add shaded text to your profile if you want more than just the body to have shading.

.content{font-size: 40px;}
This code allows you to resize the text of your profile. The higher the px, the larger the text will be.

Text at the top and bottom of your profile show

.content:before{color:lime;content:'Words you want to say here';}
This code will put words ABOVE your profile name.

.content:after{color:red;content:'Words you want to say here';}
This will put words at the bottom of your profile and if you're on a 3ds, it'll also put these words just above your friend list.

Borders show

div.page_container{border:10px outset green;}
This code puts a border of your choice around your profile. If you increase the 10px to a larger number like 15px, the border size increases. Decrease it, well you get the picture.

There are other kinds of styles too:
1. solid
2. double
3. dashed
4. dotted
5. ridge
6. groove
7. inset
8. outset

Signatures show

.signature:before{color:lime;content:'Words you want to say here';}
This code lets you write something before the signatures(or after if you change the word 'before' to 'after').

.signature img{display:none;}
This code is awesome because it removes any pictures in the signatures. Saves your profile from taking forever to load.

Friends List show

a.friend_links:after{color:green; content:'Words you want to say here';}
This code lets you put words after your friend list. (or before if you change the word 'after' to the word 'before')

a.friend_links:before{content:url('Image Url Here';}
This code allows you to put an image before your friends in your friend list. (or after if you change the word 'before' to 'after')

.friends_spoiler_full{background-color:color Here!important; color:Color Here!important; border:10px double black!important;}
This code lets you style the friend list spoiler.

Profile header show

img.header{height:0px;} div.header{height:200px; background-image:url(Image Url Here);}
This code puts an image in the header. Leave the first height at 0px. It makes the 3dsplaza header disappear. The second height: 200px adjusts the size of your new image. Feel free to adjust the 200px to the size you like.

img#header{display:none;}.header{height: 160px; background-repeat:no-repeat!important;background:url(Image url here);background-size: 100% 80%;}#navbar{margin-top:100px;}
This code allows you to change your header on the computer. I encourage you to adjust the sizes to your liking, although please remember it will also effect the appearance of your 3ds header.


div.header:before{color:green;content:'Words you want to say here';}
This puts text up in the header. There is no difference between putting the text before or after.

Spoilers show

[ spoiler =Name of the Spoiler Here ] Text and images you want to write, here. you can use the return key, that's totally fine. Put this at the end [/ spoiler ]
That above code is the example for a spoiler. Make sure you omit the space between the spoiler and the =, and the spoiler and the /

[ cspoiler =Name of title here ] Text and images go here. [ / cspoiler ]
This above code makes a clear spoiler. Again, remember to omit the spaces.

[ spoiler = [green ]use[/ green] this [ red]to[/ red][ blue] color[/ blue] [ orange] spoiler titles[ / orange] ] Make sure to put both brackets after your color[/ spoiler ]
You can use this code to color your spoiler titles with any color you want.

div.spoiler_content{background:green; border:5px grey;color:lime;}
This code designs the spoiler with backgrounds, text color and such. Please note that this code does not work on clear spoilers.


Colors and Hex Coding show

Whats a profile without colors? with these codes you can style your profile and spice it up!

[green ]green[/ green]
This makes Text green
Here is the list of colors!
red
orange
yellow
lime
blue
purple
pink

There are also some other colors as well:
[ color= maroon] Text [/ color]
there are teal, tan, violet, cyan, and gray


Shortcuts show

[center ]This code centers text[/ center]
For Example


[u ]This code underlines text[/ u]
For Example

[b ]This code makes text bold[/ b]
For Example

[i ]This code italicizes text[/ i]
For Example

[s ]This code Strikes out text[/ s]
For Example

[hl ]This code highlights text[/ hl]
But it's only in yellow

[line =Number here%]
Makes a line of any size you want




[img ]Image url Here[/ img]
This code puts an image on your profile.

[img =WidthxHeight]Image URL[/ img]
This code lets you manually size an image.

[link ]URL here[/ link]
This makes a link

[link =URL here]Words here[/ link]
This allows you to name your link

[link =URL here][img ]Image URL here[/ img][/ link]
If you want to make an image link, use this.

[forum =Words here]ID here[/ forum]
This is very useful if you want to send people to a certain forum because it automatically puts people on the right forum for their device.

Have you ever wanted to post a youtube video? Here's how.
[youtube ]Video id [/ youtube]

[ detect= device here]Words here[/ detect]
Useful for detecting devices like 3DS, DSi, Computer, ETC.

Extra Codes show

.signature{dispaly:none;}
This code removes the signatures from your comments.

div{border-radius:25px;}
This code should curve the borders of anything on your profile.

Bordering words you write in menus.
Yes, when you insert text in the menu button and anywhere else, you can actually border the text. Just add {border:10px dotted green;} or any style of border that you like.

img{border:5px inset black;}
This code borders all images on your profile.

[simg ]Url Here[ /simg]
This lets you put an image anywhere you want on your profile. (omit spaces) This code makes these images GIGANTIC!!!!

div.header{display:none;}
This code removes the header all together.

.content{background:url('Image Url Here');background-repeat:no-repeat;}
This code makes the background a single picture instead of repeating across the page.


How to use the codes: show

On your profile, go to your 'About me' section when you go to 'Edit' and copy and paste the codes there!


Schematic Tags show
Schematic tags allow you to color your repbar or Allow you to make it like you left 3DSPlaza

left3dsplaza='Reason'
This shows others that you've left plaza








<Back to The Help Center

This post has been edited one or more times, the last time was:
2017-10-06 22:06:14


You don't know what we've been through.
ChampionLeake (2017-10-12 10:56:29)
Thanks for copying and pasting ilia's thread.
I'm a web developer, a game developer, a digital artist, musician, and a reverse engineer. A weird mix right?
My Twitter
 

This topic is closed, so you can not post a comment.

This topic's ID: 83551

Back to forum: Profile Design (3DSPlaza BBCode and BBCode CSS)




Total registered users: 7652
New registered users today: 0
Newest registered user: AnnaQueen

©  Copyright 2018 3DSPlaza. All Rights Reserved