Join This Group
Sharing the Love
Created Sep 28, 2007
11,293
Colors
14,746
Palettes
39,680
Patterns
279
Conversations
2,165
Lovers
The un-official FAQ - A group for sharing information about the COLOURlovers - tips and tricks, instructions, questions and answers of all kinds. If you dont know where to start, look in the "index" conversation.
Phreestyle
How do I change the background and colour of text?
Great question. I'm glad I asked.
Just enclose your text inside div tags and use CSS to style the contents.
Eg.
<div style="background:#aea703;color: #fff; padding:0.5em;">YOUR TEXT HERE</div>
background = background colour
color = text colour
padding = the space between your text and the edges of the background
Phreestyle
How do I make different sized text?
Easy peasey
Simply use the paragraph tag
Eg.
<p style="font-size:1.5em;">YOUR TEXT HERE</p>
font-size = You guessed it. The size of the font. (em is the size of a standard letter 'm'). A bigger number makes bigger text. Check it out.
ms
Phreestyle
So Mr. smarty pants coding guy, how do I put borders around stuff?
I'm glad you asked, 'cause I've just prepared this border tutorial.
Just add some border attributes to your divs
Eg.
<div style="border: 0.2em solid #F4A600;">blah blah blah</div>
0.2em = width of your border
solid = border style. Other styles include double, ridge, groove, inset, dashed
#F4A600 = colour of the border
Phreestyle
This left aligned text is kinda boring. Any tips?
How about right aligned?
Center aligned is cool
Backward is even more cool
Eg.
<p style="text-align:right;">YADDA_YADDA</p>
text-align = Go on, see if you can guess.
You can use left, center or right. I reckon, I'll leave backward text for another post.
onebreath
Also, I love your idea of using colors - seriously, it's brilliant - but would you consider using more accessible color schemes? The one about borders is a bit hard to read, imo.
Phreestyle
onebreath
Phreestyle
I know of a really cool site. How do I link to it from my profile page?
You mean like this?
Okey dokely. All you need to do is add the url of the target site to a simple line of code and give it a title.
Eg.
<a href="TARGET_URL">LINK_TITLE</a>
You might want to give it some colour to make it stand out. Just style it like we did the div and paragraph tags.
Eg.
<a style="color:#f3f4f5;" href="TARGET_URL">LINK_TITLE</a>
Pretty simple, hey. Give it a go.
webseitler
Phreestyle
Woah. How do I add one those?
First you have to make your header. Use photoshop or whatever graphics package you like. Save to a hosting service. I use Photobucket. It's free.
Just make sure it is not more than 500px wide.
Then add this code to your profile.
<img style="border:0.2em outset #AC4A14;" src="IMAGE_SOURCE_HERE" alt="IMAGE_NAME_HERE" /a>How easy was that? Hey, go crazy.
Phreestyle
So, what now?
What you do now is up to you. Hopefully, I've provided you with a good set of tools you can use to personalise your profile page. All of these techniques can be combined to create a unique and colourful frontend to your COLOURloving world.
Here's a complete layout. Feel free to change any/all parts to suit your purposes.
Have fun.
Questions? I'll try my best to answer them
Say Hi
ms
Phreestyle
They are pretty well set up as tags that you can cut and paste as required. They just need to be modified to suit - ie, colour, background, widths, etc
Let me know what you need and I'll do my best.
ms
Phreestyle
I tried to style up a tag on one of my colours, but to no avail. It now has a pretty weird set of tags.
You can use them to leave comments on a lover, colour or palette page, however.
I use them to write inspiration descriptions on my palette pages. An example is here
bunigrl33
What I have right now:
[p style="fFONT SIZE;" ]MY TEXT HERE [a href=" TARGET URL/" target="_blank"]LINK TITLE[/a][/p]
(had to change all the < to [ to keep it from being formatted here. but it works properly on my bio page)
What I want to do is have part of the text colored, but not all of it. I tried following the above instructions for adding color to the link but it just made my text disappear.
Phreestyle
Good question. This is relatively simple to do. All you have to do is encase the desired text inside <span> tags. And, then style up the tags appropriately.
Here's an example
<p style="color:#000;
font-size:1.5em;
line-height:1.4em;">
"What I want to do is have part of the <span style="color:#d10000;">text colored</span>, but not all of it. I tried following the above instructions for <span style="color:#df8c14;">adding color</span> to the link but it just made my text disappear."
</p>
bunigrl33
bunigrl33
never mind, I think I figured it out.
it was this nifty style piece: line-height:1.4em;