Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Pages: 1
#1 2009-06-02 11:31:00
- feytus
- Member
- Registered: 2009-06-02
- Posts: 43
Help on making custom theme
Hey people! I installed textpattern today, and it looks pretty decent, so I’ve decided to try to build a website with it as a core. Now, I’m pretty new to CSS (I used to design with tables back in the day), and have run into some problems. Basically, I don’t want a header on my site, but I want a graphic header-like thing to be shown to the left of the site (with no margins at all, left nor top). So I removed the header from the html, and edited the css of the leftbar to load my graphic as a background image. Problem now is, I only want the last part of the background image to repeat itself, so I chose to put the image straight into the html (as I don’t know if it will work with two background images in one div, nor how to put one div or box directly under another, css still confuse me a great deal). Now however, the image appears, but with quite huge margins on both top and left, even though I specified margins 0px in sidebar-1’s css, and also in the body-tags css. I look into the html code and see some code I don’t recognize, which through my wisywig html-viewer seems to be the code that fucks up the looks;
<!— accessibility —>
<div id=“accessibility”>
<ul>
<li><a href=”#content”><txp:text item=“go_content” /></a></li>
<li><a href=”#sidebar-1”><txp:text item=“go_nav” /></a></li>
<li><a href=”#sidebar-2”><txp:text item=“go_search” /></a></li>
</ul>
</div>
What exactly does the accessibility-thing do?
Here is a link to how it looks right now;
http://www.marsmelons.com/textpattern/
I basically just want three parts. Leftpart with graphic, middlepart with content, and right part with navigation, and the site to be left-alligned. But I can’t seem to find which kind of code to edit. This is the css-file;
[code]body
{
top-margin: 0px;
left-margin: 0px;
padding: 0;
font-family: Verdana, “Lucida Grande”, Tahoma, Helvetica, sans-serif;
color: #000;
background-color: #fff;
}
blockquote, h3, p, li
{
padding-right: 10px;
padding-left: 10px;
font-size: 0.9em;
line-height: 1.6em;
}
blockquote
{
margin-right: 0;
margin-left: 0px;
}
h1, h2, h3
{
margin: 0 0 15px 0;
padding: 0 10px;
font-weight: normal;
}
h1, h2
{
font-family: Georgia, Times, serif;
}
h1
{
font-size: 1.4em;
}
h2
{
font-size: 1em;
font-style: italic;
}
hr
{
margin: 2em auto;
width: 370px;
height: 1px;
color: #7a7e7d;
background-color: #7a7e7d;
border: none;
}
small, .small
{
font-size: 0.9em;
}
a
{
text-decoration: none;
color: #000;
border-bottom: 1px #000 solid;
}
a img
{
border: none;
}
h1 a, h2 a, h3 a
{
border: none;
}
h3 a
{
font: 1.5em Georgia, Times, serif;
}
#site-name a
{
border: none;
}
#sidebar-2 a, #sidebar-1 a
{
color: #c00;
border: none;
}
#accessibility
{
position: absolute;
top: -10000px;
}
#container
{
margin: 0px;
padding: 0px;
width: 760px;
\width: 770px;
w\idth: 760px;
}
#head
{
text-align: center;
}
#sidebar-1
{
width: 435px;
height: 100%;
margin-right: 5px;
margin-left: 0px;
margin-top: 0px;
float: left;
text-align: right;
}
#sidebar-2
{
margin-left: 5px;
float: right;
}
.section_list
{
margin: 0 0 10px 0;
padding: 0;
list-style-type: none;
}
.section_list ul
{
list-style-type: none;
}
.section_list li
{
margin: 0 10px 2px 0;
padding: 0;
}
#content
{
margin: 0 155px;
padding-top: 30px;
}
#foot
{
margin-top: 5px;
clear: both;
text-align: center;
}
#sidebar-2 p, #sidebar-1 p
{
font-size: 0.8em;
line-height: 1.5em;
}
.caps
{
font-size: 0.9em;
letter-spacing: 0.1em;
}
div.divider
{
margin: 2em 0;
text-align: center;
}
.directory
{
list-style-type: circle;
}
.author
{
font-style: normal;
font-size: 0.8em;
}
.published
{
font-size: 0.8em;
}
.comments_error
{
color: #000;
background-color: #fff4f4;
}
ul.comments_error
{
padding: 0.3em;
list-style-type: circle;
list-style-position: inside;
border: 2px solid #fdd;
}
div#cpreview
{
color: #000;
background-color: #f1f1f1;
border: 2px solid #ddd;
}
form#txpCommentInputForm td
{
vertical-align: top;
}
#comments-help
{
margin: 2px 0 15px 0;
font-size: 0.7em;
}
.error-status
{
font: 1.3em Georgia, Times, serif;
}[/code]
Any help? :)
Offline
Offline
#3 2009-06-02 15:01:58
- feytus
- Member
- Registered: 2009-06-02
- Posts: 43
Re: Help on making custom theme
Thanks, man. It was written in a fog of frustration and confusion, I’ve figured out something that might work now. Many thanks for your reply, though. :)
Offline
Re: Help on making custom theme
One thing I’d recommend is downloading a theme or 2 from textgarden and seeing how they’re put together / how they work. You can learn a lot that way.
~~~~~~~~~~~~~| monolinea.com | pixilate.com | istockphoto.com/kemie |~~~~~~~~~~~~~
Offline
Pages: 1