Warning: Undefined array key "HTTP_ACCEPT_LANGUAGE" in /var/www/minitokyo/www/includes/common.inc.php on line 360 Userpage Customization Tips and Tricks - Minitokyo

Userpage Customization Tips and Tricks

This thread is pinned.

page 1 of 3 1 2 3 Next » 71 total items

Sheqel

Administrator

Sheqel

This thread is to post CSS bits that you can copy/paste into your advanced CSS field to improve userpage customization :)
Colors are supposed to be the color codes found in photoshop color picker or Minitokyo color picker.

remove blue search bar
#search-form * { display: none; }

remove blue background from posts
#posts, #posts dd ul:last-child { background: none; }

color dropdown menu background
#nav-bar li ul, #sections li ul, #login-form { background-color: #xxx; }

color small links in posts:
#posts dd li a { color: #xxx }

form element coloring (will also apply to the 'hide ads' button)
textarea, form input[type=text], #ad-toggle { background-color: #xxx; color: #xxx; }

user links color (username, #notes)
#nav-bar > ul > li > a { color: #xxx; }

tab link color
#tabs a { color: #xxx; }

Requests can be made in this thread, and I (or other mods) can update this post with more tricks~
Happy customizing!

Alenas

Retired Moderator

Alenas

Gone.

Woo, this is really helpful! Thanks! Will try it out in the near future, lol! XD

Signature Image

I agree , this is very helpful .. thx! :)

KUWAIT! <3

Yamibou-Eve

Tagger

Yamibou-Eve

brace yourselves

I agree too~
yay more magical codes! X3
Thanks!

Tags don't fix themselves or disappear just bc you removed them >> Report@Tag Administration | Tagging Practices | Tagging Guidelines
my-maidenclamp-a-holictag-liciousSignature Image

EevaLeena

EevaLeena

KameDa Shipper!

Awesome! >_< Me myself were trying to figure things out.. but failed ^^ So, thanks for this!

Signature Image
“Touching people’s butts is bad. If it escalates, you’ll get a Red Card.” - Ueda Tatsuya to Kamenashi Kazuya
"There was no need to tell everyone about that..!!" - Kamenashi Kazuya
LOL.. perverted Kame-chan and his lonely hands. Poor Tat-chan...

Yay, thank you so much, this is a great help!

Um, I would really love it if someone would post how they got their header's height so tall without messing up everything, I keep failing at it. >.<

I have a question, how can I change the hover links?

Signature Image A little birdy told you to .... FOLLOW ME ON TWITTER!

ArtificialRaindrop

ArtificialRaindrop

We're All Mad Here.

Thanks for the codes! Those are extremely helpful :)

I know very little about CSS, so I'm sorry if I ask stupid things. Anyways, I noticed that my menu bar doesn't tile all the way to the end of the page where my username is, instead it stops right before the number of notes. Is there any way to make it stretch farther?

My next question: is there any way at all to make the top image longer?

Signature ImageYou can't live without the fire, it's the heat that makes you strong ~ Within Temptation, "Iron"
KHDownloads <-- Butterfly Chaser referred!

sailorchiron

sailorchiron

Memories of Eliteness

at some point we need to beg Maplerose for her mad CSS skills, have you guys checked out her page?

Ripping walls? You're headed to Banned-ville.
Signature Image

I know there are others better than me at this but this is what I have so far. Don't yell at me if it isn't 100 percent correct okay lol.

/* To customized the <h1> headers in only your profile content try this.*/
#content h1{ font-size: 15px; color: #xxx;}

/* To change the fonts in your content and etc.*/
#content {font-size: 10px; background-color: #xxxxxx;}


- For those like me who still have the OLD <h2> header codes in your profile content and want to keep it customized, add this to your CSS.
#old_h2 {font-size: 11px; color: #xxx; margin-left: 27px; margin-top: -11px; letter-spacing: 2px; }

and in your profile content change the <h2> to <div id="old_h2">

it should resemble the old look as much as possible. The code should look like this <div id="old_h2"> words here </div>


And a tip for some, make sure the left side of your background image is a solid color or else it will most likely tile over/drag on the right side of your screen.

Signature Image A little birdy told you to .... FOLLOW ME ON TWITTER!

nikko3

nikko3

The Little Princess is here...

I have a request to make. I want to create a dark layout. Totally black background for everything. And I couldn't find the right code for the rest of my layout. I'm referring to these parts in my userpage:

http://img230.imageshack.us/img230/513/csscode2a.jpg
AND
http://img29.imageshack.us/img29/2293/csscode3a.jpg

How can I change the color for the 2 buttons (Send PM & Edit Style) on the menu, the Shout Box content, the background color for my profile contents and everything around the comment box.


Hope someone can help me with these. Thanks. niko.

Signature ImageMerry Christmas Aqi-chan, Trofi-chan and Chrisp-san! Hope you all have a warm Christmas day! Thanks for your kind wishes and cards! >:D
Spectacular, stunning. Just look at my Mukuro avatar and Hibari signature image, they are made just for me by chrisp-san.
Mukuro, mukuro, mukurou-chan [Oya?]
Hibird, hibird, namimori~ [Sa!]

aqiaqua

aqiaqua

last men standing!

I'm no mod, but I've found a few more codes as well which may be useful.

/*them little buttons under your avvie that say send pm, etc*/
#profile-actions a{background-color:#xxxxx;}
#profile-actions a:hover{background-color:#xxxxxx; color:#xxxxx;}

/*that bit where it says "minitokyo >> members >> country >> user"*/
#nav a{color:#xxxxx;}
#nav a:hover{color:#xxxxx;}

EDIT: and more codes...

/*member since, pageviews thing*/
#menu dt {
color:#d19dda;}

/*stats related to above code*/
#menu dd, #menu * {
color:#a9ff8f;
text-align:right;}

/*post date in gb posts*/
.post-stamp, .post-stamp * { color:#f56f6f;}

[see my userpage for example of search bar]

/*search form*/
#search-form input.text {
background:#xxxxxx; /*where you type in your search term*/
border:medium none;
color:#xxxxxx;}

#search-form span {
background:#xxxxxx no-repeat scroll -200px 0; /*where it says tags*/
color:#xxxxxx;}

#nav-bar input.submit {
background: #xxxxxx repeat scroll -310px 0; /*the search button*/
color:#xxxxxx;}

#search-form label {
background:transparent no-repeat scroll 40px 0;
color:#xxxxxx; /*the text that says "search"*/
}

I've pretty much customized almost everything on my page 8).

Signature Image
min min for the win :D

I noticed that nav-bar doesn't line up perfectly like in the pic here, so yeah, for these add the height to however many pixels until it lines up:
http://i15.photobucket.com/albums/a369/0oDarthTofuo0/Snapshot2009-10-0917-48-11.jpg
#nav-bar { height: 50px; }
#nav-bar ul { height: 50px; }

THERE ARE SECRETS WHERE FAIRIES DON'T LIVE.
Saltici Comics : Salty: the Misunderstood Spider (updates every Monday)

sailorchiron

sailorchiron

Memories of Eliteness

To change the mouse-over color on the little links in the guestbook use:

#posts dd li:hover a {color:#xxxxxx }

Ripping walls? You're headed to Banned-ville.
Signature Image

Aqi you rule, thanks! *hugs times 10000* XD


Edited: Adding some more codes. P.S.: I am so exhausted after slaving over these codes for hours and hours...bed time for me ^-^.

/*CONTENT*/

/*Customize the border at the top of the content, background color, and fonts etc.*/
#content {background: #xxxxxx; font-size: 10px; border-top: #xxxxxx solid 1px;}

/*MENU*/

/* To change the border at the top of it and background color */
#menu { background-color: #xxxxxx; border-top: #xxxxxx solid 1px;}

/*The link for "More Information" */
#menu .more { background-color: #xxxxxx; }

/*To Change the color of the menu's bullets */
#menu li {color: #xxxxxx;}

/*Menu headers*/
#menu h2 {color: #xxxxxx;}

/* I don't know about alot of people but after coping the tutorial's codes I lost my menu's very bottom background color somehow so if others get lost like I did here it is. */

/*whole menu's background color*/
#body {background-color: #xxxxxx;}

/*TABS*/

/*The numbers next to the tab links example:(42)*/
#tabs span {color:#xxxxxx;}

/*NAVIGATION --- FRIENDS ONLINE, NOTES, YOUR NAME*/[/u]

/*the main link text*/
#nav-bar a { color: #xxxxxx; background: transparent!important;} /* IF YOU WANT IT TO NOT HAVE A BOX BACKGROUND*/

/*NAVIGATION --- The Tag Me, Tags, Walls, Indy Art, Scans, Forum, Reviews, Groups*/

/*the main link text*/
#sections a { color: #xxxxxx; background: #xxxxxx;}

/*EXTRAS*/

/*Your username written in big letters at top left above your content*/
#backbone h1 {color: #xxxxxx;}

Signature Image A little birdy told you to .... FOLLOW ME ON TWITTER!

Davo

Davo

I'll kill you

another Extra if you don't like the username covers your background you can hide it with this:

#backbone h1 { font-size: 0 pt; }

Signature Image
DAVO THE ECCHIMAKER :"If a demon stands in my way, I will cut him apart. If a saint stands in my way, I will cut him apart"

Kagally

Kagally

?purple | hibari?

Quote by SheqelThis thread is to post CSS bits that you can copy/paste into your advanced CSS field to improve userpage customization :)
Colors are supposed to be the color codes found in photoshop color picker or Minitokyo color picker.

remove blue search bar
#search-form * { display: none; }

remove blue background from posts
#posts, #posts dd ul:last-child { background: none; }

color dropdown menu background
#nav-bar li ul, #sections li ul, #login-form { background-color: #xxx; }

color small links in posts:
#posts dd li a { color: #xxx }

form element coloring (will also apply to the 'hide ads' button)
textarea, form input[type=text], #ad-toggle { background-color: #xxx; color: #xxx; }

user links color (username, #notes)
#nav-bar > ul > li > a { color: #xxx; }

tab link color
#tabs a { color: #xxx; }

Requests can be made in this thread, and I (or other mods) can update this post with more tricks~
Happy customizing!

urm, may i know.. all these code.... we have to remove it from where? from the maplerose's tutorial?
pardon for my bad english -_-''.....

"Nature is the BEST! Why did we need to change everything?"
Signature Image
My Latest Submission: [Under da Sunlight]

Quote by Kagallyurm, may i know.. all these code.... we have to remove it from where? from the maplerose's tutorial?
pardon for my bad english -_-''.....

MapleRose covers all of sheqel's tips but these two things. You can add these on to your CSS like this (the /* won't hurt the code):

/*remove blue search bar*/
#search-form * { display: none; }

/*form element coloring */
textarea, form input[type=text] { background-color: #xxx; color: #xxx; }

merged: 10-18-2009 ~ 09:35am
In your EDIT STYLE, after you edit your Advanced CSS tab, do not go back and edit your Color tab. It will rewrite/rearrange/erase some of your custom CSS fields.

After helping Ryo with some stuff, I realized that I should maybe say this for others since it's really a pain when you lose the info, like I have many times.

Signature Image A little birdy told you to .... FOLLOW ME ON TWITTER!

Davo

Davo

I'll kill you

Quote by PinkPrincessLacus


merged: 10-18-2009 ~ 09:35am
In your EDIT STYLE, after you edit your Advanced CSS tab, do not go back and edit your Color tab. It will rewrite/rearrange/erase some of your custom CSS fields.

After helping Ryo with some stuff, I realized that I should maybe say this for others since it's really a pain when you lose the info, like I have many times.

umm... well for avoid this nasty things , a notepad with all our css code must be used like a back up... personally this method is very useful

Signature Image
DAVO THE ECCHIMAKER :"If a demon stands in my way, I will cut him apart. If a saint stands in my way, I will cut him apart"

Yeah I know I keep like two back up files, default and my custom XD. It's just that some people don't do that, and think the color tab is harmless.

Signature Image A little birdy told you to .... FOLLOW ME ON TWITTER!

sailorchiron

sailorchiron

Memories of Eliteness

Hey, I need some help...what do I alter for the bg color when you're hovering over links in the drop downs? At some point I made it the same color as the bg of the box, and can't figure out what to change.

Ripping walls? You're headed to Banned-ville.
Signature Image

Quote by sailorchironHey, I need some help...what do I alter for the bg color when you're hovering over links in the drop downs? At some point I made it the same color as the bg of the box, and can't figure out what to change.

/*friends online, notes, your name nav*/
/*top dropdown background and text colors when you hover-over*/
#nav-bar li ul li:hover, #nav-bar li ul a:hover, #nav-bar li:hover {
background-color: #xxxxxx;
color:#xxxxxx;
}

/*The Tag Me, Tags, Walls etc nav*/
/*top dropdown background and text colors when you hover-over*/
#sections li ul li:hover, #sections li ul a:hover, #sections li:hover {
background-color: #xxxxxx;
color:#xxxxxx;
}

This should be it, if not working still write me.

Signature Image A little birdy told you to .... FOLLOW ME ON TWITTER!

fluke

fluke

What once was good enough...

Quote by Sheqel
remove blue search bar
#search-form * { display: none; }

This doesn't seem to work properly, while it removes the search bar it also removes any background that might appear behind it and leaves a semi circle outline in its place.

Davo

Davo

I'll kill you

Quote by fluke

Quote by Sheqel
remove blue search bar
#search-form * { display: none; }

This doesn't seem to work properly, while it removes the search bar it also removes any background that might appear behind it and leaves a semi circle outline in its place.

mmm... i see what is the problem ...you're confunding this tag : #search-form * with this #search-form ...
#search-form is different tag this have the funtion to control one part of background layout and the size of the search bar so when you put {display: none;} you are indicate to don't show this part of background, and #search-form * controls the visual attributes of search bar and have only effects in the visual part of search bar not in the background... so you need to put {display: none;} in the right place who is: #search-form *

Signature Image
DAVO THE ECCHIMAKER :"If a demon stands in my way, I will cut him apart. If a saint stands in my way, I will cut him apart"

fluke

fluke

What once was good enough...

Quote by Davo

Quote by fluke

Quote by Sheqel
remove blue search bar
#search-form * { display: none; }

This doesn't seem to work properly, while it removes the search bar it also removes any background that might appear behind it and leaves a semi circle outline in its place.

mmm... i see what is the problem ...you're confunding this tag : #search-form * with this #search-form ...
#search-form is different tag this have the funtion to control one part of background layout and the size of the search bar so when you put {display: none;} you are indicate to don't show this part of background, and #search-form * controls the visual attributes of search bar and have only effects in the visual part of search bar not in the background... so you need to put {display: none;} in the right place who is: #search-form *

I have no idea what you said, you wrote #search-form twice and I think you were trying to say we "confused" it?

page 1 of 3 1 2 3 Next » 71 total items

Back to Userpage Customization | Active Threads | Forum Index

Only members can post replies, please register.

Warning: Undefined array key "cookienotice" in /var/www/minitokyo/www/html2/footer.html on line 73
This site uses cookies. By continuing to browse the site you are agreeing to our use of cookies. Read more.