1.) Start by clicking your profile image (next to the search bar).
2.) Click on "Edit Proffile" (under "Account Settings")
3.) KEEP ALL of the data you already have in the Editing Box.
4.) Click on the button that says "Source" (at the top left corner of the Editing Box)
5.) The "Source" button will turn blue and the text will change to this font
(which indicates that you are now working with the Source Code).
6.) Click to start typing at the VERY TOP of the page (before all of the original code).
7.) Hit the "Enter" key a few times to make the text easier to seperate from below (this will not affect the code).
8.) Start with typing a tag of <div style="xxx;xxx;xxx;xxx;xxx;">
9.) Replace the first set of three x's (in the quotation marks) with the subset: border: 1px solid dodgerblue
10.) Replace the secondset of three x's with the subset: border-radius: 15px
11.) Replace the third set of three x's with the subset: background-color: lightblue
12.) Replace the fourth set of three x's with the subset: height: 500px
13.) Replace the fifth set of three x's with the subset: width: 700px
14.) You can now play around with the border-radius (like 15 can be changed to 30) this is the roundness of the shape
15.) DON'T change the height or width (not unitl your completely done and want to go back)
16.) You can also change the colors to be in #1a2b3c form OR you can use basic colornames (like red, orange, yellow, green, blue, pink, violet, etc...)
17.) After that, Type: <br /> (which means "line break" and is like hitting "Enter" on a keyboard).
18.) Start with another tag of
<img alt="Any_Text=" src="URL" style="border: 1px solid gold; border-radius: 15px; height: 165px; width: 332px; opacity: 0."/>
19.) Replace the alt tag Any_Text with the new title of your image (just dont use any spaces)
20.) Replace the src ("source") tag URL with the url to the image you want to use (ex. http://www.flickr.com/photos/cubagallery/6149275243/)
21.) DON'T change the height, width, border-radius, or opacity (not unitl your completely done and want to go back)
22.) Type (which is like double spacing twice, or hitting the spacebar 4 times on a keyboard)
23.) Copy and Paste the work you did from steps 18-22.
24.) Type a new title for the copy&pasted image (you just can't have the same title twice)
25.) Copy and Paste a new URL for the second image.
26.) Type: <br /> (which, again, means "line break" and is like hitting "Enter" on a keyboard)
27.) Type another tag of: <span style="font-size: 11px;"/> (lol, dont change anything here....)28.) Type: (which, again, is like double spacing , or hitting the spacebar 2 times on a keyboard)
29.) Then, close this tag by typing: </span>
30.) Type: <br /> (again)
31.) Now start another tag of: <div style="border-radius: 15px; border: 1px solid greenyellow; width: 680px; height: 320px; text-align: justify; overflow: hidden; margin-left: 10px;">
32.) You can change the color ("greenyellow") to any basic colorname or your can use the #00cccc format.
33.) You can change the text allignment from "justify" (which makes the words spread out to fill the box) to "left" or "center" or "right"
34.) You can change the text overflow from "hidden" (which makes the extra words run of behind the text box) to "auto" (which gives you a scroll bar for any extra text.
35.) DON'T change the height, width, border-radius, or margin. (not unitl your completely done and want to go back)
36.) The last tag is: <div style="background-color: white; border: 5px solid white; line-height: 14px; opacity: 0.9;">
37.) You can change the background color by.....lol I think you know what to do now... haha :)
38.) (We're almost done, don't worry!) just type: <br /> (Again lol)
39.) Type: xxxxxxxx
40.) Type: </div></div></div> to close the tags.
41.) Now you can click the "Source" button again
42.) there should be your layout now :)
43.) go back and change the xxxxxxxx to what ever you want your Bio to say
44.) Remember you can use the old layout that you had before for ideas on what to say in your Bio.
45.) Now you can go back and play with the numbers and colors. plus you can delete the old data from your old layout
46.) Rember to hit "Save" :))
I made it :) it's simple because it's like making quotes.
You start with a <div> header and use the "border-radius" function to make the boxes rounded. i can make a quote on how to do it if you want :))
Awh, why thank you, darling!
Honestly, that's my first time making a code from scratch and I'm still not sure how I got it to work :')
Either way, thank you so much! For the follow, too!
And omg the song on your profile!! I love simple plan c:
but i'm pretty sure if we took a poll or something, i'd be right, just saying.
you've seen my face, right?
2.) Click on "Edit Proffile" (under "Account Settings")
3.) KEEP ALL of the data you already have in the Editing Box.
4.) Click on the button that says "Source" (at the top left corner of the Editing Box)
5.) The "Source" button will turn blue and the text will change to this font
(which indicates that you are now working with the Source Code).
6.) Click to start typing at the VERY TOP of the page (before all of the original code).
7.) Hit the "Enter" key a few times to make the text easier to seperate from below (this will not affect the code).
8.) Start with typing a tag of <div style="xxx;xxx;xxx;xxx;xxx;">
9.) Replace the first set of three x's (in the quotation marks) with the subset: border: 1px solid dodgerblue
10.) Replace the secondset of three x's with the subset: border-radius: 15px
11.) Replace the third set of three x's with the subset: background-color: lightblue
12.) Replace the fourth set of three x's with the subset: height: 500px
13.) Replace the fifth set of three x's with the subset: width: 700px
14.) You can now play around with the border-radius (like 15 can be changed to 30) this is the roundness of the shape
15.) DON'T change the height or width (not unitl your completely done and want to go back)
16.) You can also change the colors to be in #1a2b3c form OR you can use basic colornames (like red, orange, yellow, green, blue, pink, violet, etc...)
17.) After that, Type: <br /> (which means "line break" and is like hitting "Enter" on a keyboard).
18.) Start with another tag of
<img alt="Any_Text=" src="URL" style="border: 1px solid gold; border-radius: 15px; height: 165px; width: 332px; opacity: 0."/>
19.) Replace the alt tag Any_Text with the new title of your image (just dont use any spaces)
20.) Replace the src ("source") tag URL with the url to the image you want to use (ex. http://www.flickr.com/photos/cubagallery/6149275243/)
21.) DON'T change the height, width, border-radius, or opacity (not unitl your completely done and want to go back)
22.) Type (which is like double spacing twice, or hitting the spacebar 4 times on a keyboard)
23.) Copy and Paste the work you did from steps 18-22.
24.) Type a new title for the copy&pasted image (you just can't have the same title twice)
25.) Copy and Paste a new URL for the second image.
26.) Type: <br /> (which, again, means "line break" and is like hitting "Enter" on a keyboard)
27.) Type another tag of: <span style="font-size: 11px;"/> (lol, dont change anything here....)28.) Type: (which, again, is like double spacing , or hitting the spacebar 2 times on a keyboard)
29.) Then, close this tag by typing: </span>
30.) Type: <br /> (again)
31.) Now start another tag of: <div style="border-radius: 15px; border: 1px solid greenyellow; width: 680px; height: 320px; text-align: justify; overflow: hidden; margin-left: 10px;">
32.) You can change the color ("greenyellow") to any basic colorname or your can use the #00cccc format.
33.) You can change the text allignment from "justify" (which makes the words spread out to fill the box) to "left" or "center" or "right"
34.) You can change the text overflow from "hidden" (which makes the extra words run of behind the text box) to "auto" (which gives you a scroll bar for any extra text.
35.) DON'T change the height, width, border-radius, or margin. (not unitl your completely done and want to go back)
36.) The last tag is: <div style="background-color: white; border: 5px solid white; line-height: 14px; opacity: 0.9;">
37.) You can change the background color by.....lol I think you know what to do now... haha :)
38.) (We're almost done, don't worry!) just type: <br /> (Again lol)
39.) Type: xxxxxxxx
40.) Type: </div></div></div> to close the tags.
41.) Now you can click the "Source" button again
42.) there should be your layout now :)
43.) go back and change the xxxxxxxx to what ever you want your Bio to say
44.) Remember you can use the old layout that you had before for ideas on what to say in your Bio.
45.) Now you can go back and play with the numbers and colors. plus you can delete the old data from your old layout
46.) Rember to hit "Save" :))
You start with a <div> header and use the "border-radius" function to make the boxes rounded. i can make a quote on how to do it if you want :))
Honestly, that's my first time making a code from scratch and I'm still not sure how I got it to work :')
Either way, thank you so much! For the follow, too!