Two-tone Images

First: thread:381
Personal Sandbox Template
Edited: 10 Oct 2016 04:24 by: Joshua Darby
Comments: 0
Tags:

««

« Personal Sandbox Template
« Please, make Gerdami multilingual site a template to be cloned
« book-project
« tracker-template
« Albums Template

Previous: thread:92
Albums Template
Edited: 29 Oct 2009 15:26 by: (user deleted)
Comments: 8
Tags:

Last: thread:8
forum-template.wikidot.com (using installer)
Edited: 25 Aug 2009 07:21 by: leiger
Comments: 3
Tags:

»»

wiki-template.wikidot.com »
CSS changes for the tabview according to rainbow colors? »
scrollbar and order of threads in this forum »
personal-template.wikidot.com »
hammer-template.wikidot.com »
Iron Giant Template Site Help - default-template-v2 »
New Join module »
Copyright and sharing of site sources »
career-template.wikidot.com »
Deprecated arguments and variables »

Next: thread:89
wiki-template.wikidot.com
Edited: 25 Oct 2009 13:47 by: pieterh
Comments: 4
Tags:

Ss_Sins_Insight wrote on 19 Oct 2009 19:15

I how do you create two-tone images such as the one used in the rainbow templates for the topbar? What image editing program? (Any free alternatives?)

I am working on some templates and would like to create elements of my own color preferences, so any help would be much appreciated. Thank you.

Small test added by Steven Heynderickx as an example to the aswer of the above posted question.

no color

Red

green

blue

black

This is the added css

.colorbar, .green, .red, .blue, .black {
   background-image: url(http://projects.wdfiles.com/local--files/thread:78/button.png);
   background-repeat: repeat-x;
   background-position: -3px;}

.colorbar {background-color:transparent;}
.green    {background-color:#00ff00;}
.red       {background-color:#ff0000;}
.blue      {background-color:#0066ff;}
.black     {background-color:#000000;}

Start a new sub-thread

Comments: 5

suef 19 Oct 2009 22:56

Have a read of this thread. I think there's some stuff near the bottom that will help you out.

---

Sue

Last edited on 11 Apr 2010 00:34 by suef Show more

Thx

Ss_Sins_Insight 20 Oct 2009 00:07

Thank you, much appreciated!

Re: Thx

RobElliott 26 Oct 2009 22:29

Any free alternatives?

Yes, Paint.net from http://www.getpaint.net is probably one of the best free graphics program. There are a lot of extra addon effects that don't come with the default program, and multi-colour gradients is one of those add-ons and is what I used in my sig. It can be downloaded from http://paintdotnet.forumer.com/viewtopic.php?f=16&t=23040

---

Rob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.

Are you refering to the colors of the top bar?

Steven Heynderickx 26 Oct 2009 14:22

I made an adjustment for the tabview… but nobody has seen it so far… well no comments so far… I used a PNG image that I droped over a coloured background… so in your CSS just put the color in for background-color:#xxxxxx; and than background-image:url (link to the png-imagefile) you should also set the background-repeat and the offset if you wish.

In this way you don't need to make new images for every color… just change the backgroundcolor in your CSS

Have a look @ http://projects.wikidot.com/thread:87 and http://hackedforum.wikidot.com/tabpage

So I made a gray-shaded png file with transparentcy using photoshop
I'll also post it on this page.

---

A - S I M P L E - P L A N by ARTiZEN a startingpoint for simple wikidot solutions.

Last edited on 26 Oct 2009 14:32 by Steven Heynderickx Show more

Re: Are you refering to the colors of the top bar?

pieterh 26 Oct 2009 17:13

Steven,

Very nice work, I'm going to use this in the standard themes, then. Thanks.

---

Portfolio