Author: * Sak Biyaan ShieldJaguar -
1 Post
on this thread out of
294 Posts
sitewide.
Date: Apr 9, 2004 - 12:00
Since the creation of the MP groups Calakmul and Tahuantinsuyu, I've been playing around with the group entrances to see exactly what we can and cannot do in terms of decorating. (I'm one of those people that just can't seem to not decorate..LOL) I hadn't seen anymore posts in this thread with details regarding this so I thought I'd post my findings and results. *grin* (WARNING: long post ahead..)
First, here are the locations to both groups I'll be referencing:
Tahuantinsuyu
http://www.ancientworlds.net/aw/Group/289691
Calakmul
http://www.ancientworlds.net/aw/Group/289644
With Tahuantinsuyu I kept with the black background since our group image faded nicely into that. I did change almost everything else though. LOL I did all of it through using css/html inserted into the box where the group summary goes (using the html option, of course). I'm not sure how familiar everyone is already with the various css items for changing your homes (ie .community), so if there are any questions, please do let me know! *grin*
One of the first things I changed on Tahuantinsuyu was the default red font color that appears for things like the time/date stamp on posts. That can be changed by defining .dynamicnum and .dynam as follows:
<style type="text/css">
.dynamicnum {color: "silver"}
.dynam {color: "silver"}
</style>
I just chose to only change the color, but you should be able to change the font-face, etc. as well.
The next thing that was changed was the border surrounding the lists of members and the lists of posts. That is changed by defining .gram as follows:
<style type="text/css">
.gram {background-color: "#000000"; border-style: dashed dashed dashed dashed; border-color: "#574458"; border-width: 2px2px2px2px; width: "175"}
</style>
I chose to use a dashed border in that case, but you don't have to define the border style and it will leave it solid. With the above though, you can change the background color within that area and specify the width (which I rather liked since my left column always seems to get rather squirshed).
Next up was the area that contains the list of group boards and topics. I thought having that in a nice little box would look a little better than having everything hangin' loose so I defined .simpleblock as follows:
<style type="text/css">
.simpleblock {background-color: "#000000"; border-style: solid; border-color: "#574458"; border-width: 2px}
</style>
With that I created the border around that list of boards and topics and decided to color the border to match everything else. As with the .gram - you can also designate a background color should you prefer that.
I went a little further with defining those areas that have your "resign", "group profile", etc. options. You can define those areas by using .button as follows:
<style type="text/css">
.button {background-color: "#574458"; border-style: solid solid solid solid; border-color: "#6D8B67"; border-width: 1px1px1px1px}
</style>
In this case I used a different border color and used a color for the background of that area, basically just makes it a little more noticable.
Two more things you can define is the member level title by using .note, as an example, I could chang that to reflect the same design as my .button by doing this:
<style type="text/css">
.note {background-color: "#574458"; border-style: solid solid solid solid; border-color: "#6D8B67"; border-width: 1px1px1px1px}
</style>
I didn't actually do with either Tahuantinsuyu or Calakmul because depending upon what you do, it can make things look a little cluttered. The second thing is the area of text at the top of the page, but under the name of the group. It's the abstract if I remember correctly. You can define that by using .pagetitle as follows:
<style type="text/css">
.pagetitle {font-family: "Copperplate Gothic Light"; font-size: 12pt; line-height: 16pt}
</style>
And that's about it! *grin* Of course, your normal css will work as well as will defining .community which is something I think most do on their homes too. One thing I did run into is disappearing links - that was from the hover effect I was using so you may want to watch out for that, but it can be rectified by adjusting your line-height.
Calakmul was designed along the same steps with a few alterations and is still under construction somewhat. In the areas of .gram and .simpleblock I used a background color instead of black since we have an actual background in use on the group entrance. To add a background to the group entrance just do this:
<style type="text/css">
.community {background-image: url("http://www.ancientworlds.net/aworlds_media/ibase_1/00/03/97/00039764_000.jpg"); background-color: "#144556"}
div#Content,div#maincontent { background-image: url("http://www.ancientworlds.net/aworlds_media/ibase_1/00/03/97/00039764_000.jpg"); background-color: "144556"}
</style>
Just a note on this - on the first attempts I tried to link to an external image to use for the background and after banging my head against the wall, I realized that I had to upload the background to my home here at AW. For one reason or another, it wouldn't utilize the outside image.
That's about it for the group entrance that I've encountered in my pokings and proddings. In the case of Tahuantinsuyu, I took everything a step further and used the same css code that I had used for the front entrance in the announcements area, the board listing areas (those areas that show the description of the board and the list of topics) and the topics areas (where one would find the topic description and list of posts). Unfortunately, you can't seem to do anything about the posts themselves at this time.
One note about the board listings areas and the topics areas - as Calakmul uses a background on the entrance I was going to use a background throughout, however, in those two areas there is an AW image of scrolls with a black background that peeps through. It's rather large and I haven't found a way around it, so I would suggest in those areas sticking with the default black so that image doesn't stick out like a sore thumb.
Hope all of this was helpful and if anyone has any questions, please do let me know! *grin*
|