Home | Top Skins | Tags | All Skins | Forums | Contribute | About

BlogSkins.com Forums

Forums > General > "Styling Your New Profile Page" (22 replies)
if-ever's icon Author: if-ever
Posted: 2.4 years ago
(link)
I was playing with the CSS of our new profile page (thanks alot Myles, for the work). I thought the thumbnails would make browsing much easier for people seeking blogskins, but I still love to style them. Check out my profile page to see how it roughly looks like after styling on your own.

I'm not sure if Myles is still going to edit the page further but yea, I'm playing with the codings for now. If there's updates, I'd probably update this thread too.

Mainly, you just have to add CSS codes.

#user_profile_avatar {float: left; padding: 5px;}
Your Avatar: So it looks like how it used to look, your details will be on the right of the image.

.nickname { font: tahoma; font-size: 14px; color: #767956; font-weight: bold; padding: 2px; letter-spacing: 1px; text-transform: lowercase; }
Your Big Username: There isn't much explaining to do here, you can change it to suit your own preference but leave the PADDING alone. It is to space out from the avatar.

h1, h3 { font-family: tahoma; font-weight: normal; font-size: 15pt; text-transform: lowercase; color: #595b3e; letter-spacing: 2px }
... Has # Friends like: , My Skins, Skins From Friends, Fav. Skins: If you had noticed, Has # Friends like is actually a small heading but I made it big so it looks equal with the other headings. Otherwise, it seems to be like a sub-section of ABOUT ME.

#profile_skins a {color: #FFF}
#profile_skins img { position: relative; display: inline; background-color: #F1F1F1; border: 1px solid #d8d7cb; padding: 2px 2px 4px 2px;}

Thumbnails: I love borders, do you? I set the color of the links to white (same as my page BG color) cause I think it is neater without the skin names, since it is cut-off halfway anyways.

#my_comments {display: none}
#user_profile_ad {display: none}

Remove Comments and the Big Ad I'm not sure if Myles allow this but the ad (around the About Me section) is really too big for now. Comments are quite useless to me so I had it removed. It's up to your preference.

Alright, done with this long post. Hope it helps some who loves editing your own profile page.
 
 
's icon Author:
Posted: 2.4 years ago
(link)
  cool! it's helpful (:
 
 
heroine's icon Author: heroine
Posted: 2.4 years ago
(link)
  Thanks! this is going help a lot.
 
 
simplicity*'s icon Author: simplicity*
Posted: 2.4 years ago
(link)
  AHAHA THANKS DAMIEN.
yay we love you! :D
 
 
Jiawen-4ever's icon Author: Jiawen-4ever
Posted: 2.4 years ago
(link)
  thx!! it really helped me!! btw, i hv a question: if i do NOT want to remove the comments and big ad what should i do? put {display:yes} or.. what? sry i do not really know abt css.
 
 
burgercrazz's icon Author: burgercrazz
Posted: 2.4 years ago
(link)
  hey thanks a lot!
 
 
twix0rz's icon Author: twix0rz
Posted: 2.4 years ago
(link)
  You are freaking amazing!! Haha. Thanks a lot.
 
 
[DELETED USER]'s icon Author: [DELETED USER]
Posted: 2.4 years ago
(link)
  hey, thanks for this!
 
 
unriven/}'s icon Author: unriven/}
Posted: 2.4 years ago
(link)
  im using this.
but erm everything you type here just throw in the about me section right?
 
 
unriven/}'s icon Author: unriven/}
Posted: 2.4 years ago
(link)
  yay done. thnx! :D:D:D:D:D:D:D:D:D:D:D
 
 
STYLED.'s icon Author: STYLED.
Posted: 2.4 years ago
(link)
  i like your profile!
very simple!
 
 
myles's icon Author: myles
Posted: 2.4 years ago
(link)
  Nice work. I'm tempted to incorporate some of your suggestions into the defaults.

Obviously, I would prefer that you didn't turn off ads, but I understand it can make things a little cluttered. Would a smaller ad in that space be better?
 
 
enex's icon Author: enex
Posted: 2.4 years ago
(link)
  :D YAY
 
 
starry7star's icon Author: starry7star
Posted: 2.4 years ago
(link)
  THANKS ALOT AND LOT.
 
 
if-ever's icon Author: if-ever
Posted: 2.4 years ago
(link)
  Sorry Myles, I have removed the "turn off ads" on my page. Everyone please don't remove the ads too ^ ^
 
 
wwei's icon Author: wwei
Posted: 2.4 years ago
(link)
  My account has problem. =X
It doesn't show my skins as well as I can't find the save button in my settings. I can't edit my profile and css. *sob*
 
 
lynda12798's icon Author: lynda12798
Posted: 2.4 years ago
(link)
  OMG THANK YOU SO SO SO MUCH I'VE BEEN WONDERING HOW TO DO THIS FOREVER YAY YAY YAY YAY
oops hee:D
my profile page aint gonna be plain no more!!!whee:D
 
 
lynda12798's icon Author: lynda12798
Posted: 2.4 years ago
(link)
  oh crap.mine still doesnt work.how do u add those into the profile page? is there any other codes i have to put in front or at the back?
 
 
illusioNATION's icon Author: illusioNATION
Posted: 2.4 years ago
(link)
  sticky +1
 
 
Wanehh's icon Author: Wanehh
Posted: 2.4 years ago
(link)
  Mine doesn't work too.
I suck. -.-
 
 
if-ever's icon Author: if-ever
Posted: 2.4 years ago
(link)
  Don't work? It has to look something like this...

#user_profile_avatar {float: left; padding: 5px;} .nickname { font: tahoma; font-size: 14px; color: #767956; font-weight: bold; padding: 2px; letter-spacing: 1px; text-transform: lowercase; }

If I'm not wrong, making a new line for each element will make your user-lookup weird.
 
 
if-ever's icon Author: if-ever
Posted: 2.4 years ago
(link)
  Oops, I forgot.

#user_profile_avatar {float: left; padding: 5px;} .nickname { font: tahoma; font-size: 14px; color: #767956; font-weight: bold; padding: 2px; letter-spacing: 1px; text-transform: lowercase; }

Remove the spaces. Something like this.
 
 
{lolilovee/:D}'s icon Author: {lolilovee/:D}
Posted: 2.4 years ago
(link)
  thanks a whole lot! :D
Subscribe To This Thread: RSS 2.0 or Atom (?)
This thread has been locked, and no new replies can be posted.


Site

- Home
- About
- Feeds
- Privacy Policy
- Contact Us

Skins

- Tags
- Search Skins
- All Skins
- Random Skin
- Skin Of The Day
- Contribute

Forums

- General
- Tips & Tricks
- Help!
- Suggestions
- Skin Requests
- Blogging Software
- Web Hosting

Account

- Log In
- Register
</BlogSkins>

Warning! Do not follow this link! It is a trap for poorly-behaved bots. If you follow this link, you will be banned from accessing this site and several others. I will not have mercy on you. Do not follow this link!