| Forums > General > "For Blogskinners: Restyling Your Profile" (34 replies)
|
|
|
I apologise for this late reply. 
Okay, as promised, I have come up with the basic codes for blogskinners who wish to obtain an overwritten profile page at blogskins.com. However, do note that the codes may have flaws so you may wish to modify your page anyway you want and I hold no responsibility for this. Before you use these codes, kindly do not remove the default blogskin navigation and links(My Skins, My Comments, etc) from your profile page in due respect of blogskins.com. (unless you really do feel the need to remove, but that would obstruct accessibility to other links at blogskins.com!)
This is the part where you want unnecessary things to be removed so that you can overwrite your content. Insert this part inside your style sheet:
#user_profile_avatar, #user_profile_ad, #user_profile_info, #header_login, .topnav, .navsearch, .logo, .footernav, .footernavright, .footer{display:none}
There are also parts where you may wish to leave alone. All you need to do is to align them accordingly to your layout. They include:
#my_favorites - this is the section about your favourite blogskins
#user_profile_about - this is the section containing your overall content
#friends_skins - this is the section featuring your friends' blogskins
#my_skins - this is the section featuring your own skins
#my_comments - this is the section displaying your comments on other blogskins
An example of how you'd align those parts would appear like this:
#my_skins{overflow:none; width:500px; position:absolute; top:200px; left:120px}
For #user_profile_about, you may only need to shift its position and size. An example of how this would look:
#user_profile_about{width:600px; position:absolute; top:0px; left:0px}
Lastly, you may wish to include an image/banner on your page. Insert this code into your style sheet:
#image{position:absolute; top:0px; left:0px; width:--px; height:--px}
You may choose to rename "image", and do remember to replace "--" with the appropriate measurement of your image. Of course needless to say, measurement is in pixels. In order to make sure your image appears, insert this after your stylesheet(note:not INSIDE it):
img src="url here" id="image"(remember to insert the close and open tags for this)
Basically that's all that is needed to know. Do remember not to leave any spaces in between the codes in your style sheet - make sure everything is placed together(yes, not even a single space, it would look like a chunk of nonsense strung together but that's the way it should be, I think) or else it may not work. If you find that there are better ways to do this/ways to improve, you may wish to notify me.
This post can also be found at my site - http://xavqior.co.nr. (post has been deleted, sorry!) Hope this helps.
------------------------------------------------------------------------ UPDATE: 20TH DECEMBER 2007 ------------------------------------------------------------------------
I understand that some of you do not understand the tutorial and have requested for the basecode so that you'd be able to modify it on your own. However, I would like everyone to understand that the purpose of this tutorial is to allow you to understand and learn how to create your own blogskin profile. If you truly wish to be a blogskinner, you will have to comprehend the fact that it is your own responsibility to learn html and its basics so that you would be able to learn and improve from your mistakes throughout this entire learning process. Everyone puts in effort in his/her own blogskins. Everyone takes pride in his/her own work.
Basically, all you have to do is to copy and paste all those codes under a stylesheet and further modify it on your own. One very simple example is this:
#my_favorites,#user_profile_avatar,#user_profile_ad,#user_profile_info,#header_login,.topnav,.navsearch,.logo,.footernav,.footernavright,.footer{display:none;visibility:hidden}
body,p,font,tr,td,.my_skins,.my_comments,.friends_skins{font:normal 12px georgia; color:#000000}
You just have to embed everything and contain it inside the style tag: (style) and (/style) (replace the brackets with angle brackets). That's what I mean by putting them inside a stylesheet, if you are unsure of what it is.
Hope this helps, and good luck!
Edited 5 months ago. |
| |
|
| |
|
| |
Ahhh this is gonna help much. Thanks! 
|
| |
| |
|
| |
yay!
|
| |
| |
|
| |
gonna give it a try(:
|
| |
| |
|
| |
Hey i love your profile page Xavqior!
|
| |
| |
|
| |
lol thanks XD
|
| |
| |
|
| |
oh please sticky this
|
| |
| |
|
| |
Hey, thanks so much (:
|
| |
| |
|
| |
its gna help, thanks loads, [:
|
| |
| |
|
| |
No problem guys.
|
| |
| |
|
| |
loves man~
|
| |
| |
|
| |
Thank you for a great guide!
|
| |
| |
|
| |
Woots!
|
| |
| |
|
| |
OMG! thank you.
|
| |
| |
|
| |
I wonder if Myles welcome this o.o
Erm, so all these tags is under css right?
Sorry, my coding s****.
|
| |
| |
|
| |
=DD
|
| |
|
| |
|
| |
purpl3d: Hopefully it is allowed as long as we retain its original navigations and features... I guess? Haha. If Myles is against this way of styling our profile page, I guess I'll have to take down this thread. (hopefully not!)
|
| |
| |
|
| |
Oh, ok maybe i'll try out this.
|
| |
| |
|
| |
whoa this helped! thanks!
|
| |
| |
|
| |
this is cool!
|
| |
| |
|
| |
OH MY GOSH YOU ROCK.
|
| |
| |
|
| |
I cant seem to move the 'skins from friends' and 'my favs' part o.o
|
| |
| |
|
| |
I love you and I really do . ♥♥
|
| |
| |
|
| |
You're welcome guys.
To DayBefore!Misery:
#friends_skins - this is the section featuring your friends' blogskins
In order to move that section, the code should be something like this: e.g. #friends_skins{overflow:none; width:--px; position:absolute; top:--px; left:--px}
|
| |
| |
|
| |
Oh damm,this is gonna help loads.Thx
|
| |
| |
|
| |
Thanks! Somehow it worked now ._.
But what about the 'Friends' Section?
I ♥ this tutorial
|
| |
| |
|
| |
DayBefore!Misery:
Well I've mentioned that this coding has flaws, and one of the things that's missing is the 'friends' section. @.@ I can't figure out how to shift that section. So basically the layout overwrites it. I can't find any way to move it. Haha.
|
| |
| |
|
| |
x.x
Haha. ohkay. Thanks anyway.
|
| |
| |
|
| |
Sweet, thanks!
|
| |
| |
|
| |
DayBeforeMisery:
I might be able to find out.
|
| |
| |
|
| |
I took this portion of codes from glen's profile. :
eraseme. has 4 friends, like:
it may help.
P.S. this is from the friends portion, below this portion is where your frens go.
|
| |
|
| |
|
| |
And i have a question. Too.
Can someone put in your codes for your profile page so i can analyze it? i dun really understand where to put and how it applies to what.
|
| |
| |
|
| |
helped alot thanks
|
| |
| |
|
| |
great, i was always wondering how the hell people's pages got so nice.
thanks loads!
|
| |
| |
|
| |
[sacarsm]Well, from some people, ive learnt that all you have to do is to view source and tada; copy, paste, edit, done. [/sacarsm]
|
| Subscribe To This Thread: RSS 2.0 or Atom (?) |
| This thread has been locked, and no new replies can be posted. |
Home | Top Skins | Tags | All Skins | Forums | Contribute |
About
![[DELETED USER]'s icon](http://images.blogskins.com/user_images/393/131/avatar_tn_1205937669.jpg){kind=avatar}
![[DELETED USER]'s icon](http://images.blogskins.com/site_images/generic_face.jpg)
