Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Pages: 1
#1 2006-03-05 16:55:28
- tez
- Member
- Registered: 2006-02-25
- Posts: 22
Easy Kubrick Display
Hi
I’d really appreciate it if somebody could help me to get a new style to display correctly.
I’ve tried adding the Easy Kubrick style and before that The Text Garden to my site.
But I’ve lost my default left, centre and right sidebars that I had with the default TXP style.
Everthing is aligned to the left!
In addition:
‘Go to content’ ‘Go to navigation’ ‘Go to search’ links appear in the top left corner.
I think this is a general problem and dosen’t relate specifically to the new styles.
Just to confirm- I don’t need to get into the backend and edit my textpattern csss, do I?
Once again, I’d really appreciate it if somebody could help out!
Many thanks in advance.
Tez
FYI
I’ve saved easy kubrick in sections
Sections>Site Sections>Default>Uses Style:easy kubrick
Sections>Site Sections>Article>Uses Style:easy kubrick
This is my default page:
<code>
</head>
<body>
<div id=“accessibility”>
<a href=”#content” title=“Go to content”>Go to content</a>
<a href=”#sidebar-1” title=“Go to navigation”>Go to navigation</a>
<a href=”#sidebar-2” title=“Go to search”>Go to search</a>
</div> <!— /accessibility —>
<div id=“container”>
<!— head —>
<div id=“header”>
<h1><txp:link_to_home><img src=“images/3.gif”
width=“740” height=“154” alt=“Pub Paris Header” border=“0” /></txp:link_to_home></h1>
</div>
<!— left —>
<div id=“sidebar-1”>
<txp:recent_articles/>
</div>
<!— right —>
<div id=“sidebar-2”>
<txp:search_input label=“Search” wraptag=“p” />
<txp:popup type=“c” label=“Browse” wraptag=“p” />
<p><txp:feed_link label=“RSS” /> / <txp:feed_link label=“Atom” flavor=“atom” /></p>
<p><img src=“http://blog.pubparis.com/images/26.gif” title=“emerald icon” alt=“emerald icon” width=“32” height=“32” /></p>
<txp:linklist wraptag=“p” />
</div>
<!— center —>
<div id=“content”>
<txp:article sortby=“Title” sortdir=“asc”/>
<txp:if_individual_article>
<p>
<txp:link_to_prev><txp:prev_title /></txp:link_to_prev>
<txp:link_to_next><txp:next_title /></txp:link_to_next>
</p>
</txp:if_individual_article>
<txp:if_article_list>
<p>
<txp:older>Previous</txp:older>
<txp:newer>Next</txp:newer>
</p>
</txp:if_article_list>
</div>
<!— footer —>
<div id=“foot”> </div>
</div>
</body>
</html>
</code>
The Easy Kubrick style:
<code>
/*
Easy-Kubrick for Textpattern
Version : 1.0
Created : 24. Jan 2004 by Sivert (sivni.com)
The original Kubrick Template was
created by Michael Heilemann.
You can get it here: http://binarybonsai.com/kubrick/
*/
body
{
font-size: 62.5%; /* Resets 1em to 10px */
font-family: “Lucida Grande”, Verdana, Arial, Sans-Serif;
background-color: #d5d6d7;
color: #333;
margin: 0;
padding: 0;
}
h1, h2, h3
{
font-family: “Trebuchet MS”, “Lucida Grande”, Verdana, Arial, Sans-Serif;
font-weight: bold;
}
h1
{
font-size: 4em;
padding-top: 70px;
margin: 0;
}
h2
{
font-size: 1.6em;
margin: 30px 0 5px ;
}
h3
{
font-size: 1.3em;
padding: 0;
margin: 30px 0 0;
}
h1, h1 a, h1 a:hover, h1 a:visited
{
text-decoration: none;
color: white;
}
h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited
{
text-decoration: none;
color: #333;
}
small
{
color: #777;
font-family: Arial, Helvetica, Sans-Serif;
font-size: 0.9em;
line-height: 1.5em;
}
code
{
font: 1.1em “Courier New”, Courier, Fixed;
}
blockquote
{
margin: 15px 30px 0 10px;
padding-left: 20px;
border-left: 5px solid #ddd;
}
#right p, #left p
{
line-height: 15px;
font-size: 10px;
}
#left p
{
text-align: right;
}
a, h2 a:hover, h3 a:hover
{
color: #06c;
text-decoration: none;
}
a:hover
{
color: #147;
text-decoration: underline;
}
p a:visited
{
color: #b85b5a;
}
.comments {
text-align: center;
color: #777;
}
#head
{
background-color:#73a0c5;
color:#fff;
text-align: center;
margin:10px;
height: 182px;
}
#container
{
margin: 30px auto;
padding: 0;
width: 740px;
border:1px solid #959596;
background-color:#fff;
padding: 0px;
}
/*
Drop the left div, would you please?
*/
/*
#left
{
float: left;
width: 150px;
margin-right: 5px;
padding-top: 100px;
}*/
#center
{
margin-left: 30px;
margin-right: 215px;
font-size: 1.2em;
line-height: 1.4em;
}
#right
{
float: right;
width: 190px;
margin-left: 5px;
padding-top: 20px;
font: 1em “Lucida Grande”, Verdana, Arial, Sans-Serif;
}
#foot
{
clear: both;
margin-top: 5px;
padding:10px;
text-align: center;
background-color:#eee;
}
</code>
Last edited by tez (2006-03-05 19:06:32)
Offline
Re: Easy Kubrick Display
Is this the complete CSS your using?
Offline
#3 2006-03-05 17:46:33
- tez
- Member
- Registered: 2006-02-25
- Posts: 22
Re: Easy Kubrick Display
Hi Maarten
Thanks for replying!
Yes, as far as I’m aware this is the complete css I’m using.
Does that help?
Tez
Offline
#4 2006-03-05 17:53:42
- els
- Moderator
- From: The Netherlands
- Registered: 2004-06-06
- Posts: 7,458
Re: Easy Kubrick Display
tez, for your information, I deleted your post about this in the ‘How do I…’ forum, as it seemed to be identical ;) If you double post by accident, you can report it through the ‘report’ link at the bottom of each post.
Offline
#5 2006-03-05 17:59:12
- tez
- Member
- Registered: 2006-02-25
- Posts: 22
Re: Easy Kubrick Display
Hi Els
No problem!
I’m a bit of a newbie around here and I’m not always sure of the do’s and dont’s on the TXP forum.
I wasn’t sure which was the best forum to post my query.
Tez
Offline
Re: Easy Kubrick Display
The first thing I’ve noticed is that you use the ID selectors sidebar-1 and sidebar-2 in your default page but they are not in your CSS. If you want to use sidebars there should be something in your stylesheet like:
/* My left sidebar */
#sidebar-1
{
float: left;
width: 150px;
margin-right: 5px;
padding-top: 100px;
}
/* my right sidebar */
#sidebar-2
{
float: right;
width: 190px;
margin-left: 5px;
padding-top: 20px;
}
And your don’t forget the center also :)
Maarten
Offline
#7 2006-03-06 11:27:34
- tez
- Member
- Registered: 2006-02-25
- Posts: 22
Re: Easy Kubrick Display
Hi Maarten
Many thanks for that!
I’ve made the following changes to the easy kubrick stylesheet:
/* My left sidebar */
#sidebar-1
{
float: left;
width: 150px;
margin-right: 5px;
padding-top: 100px;
}
/* my right sidebar */
#sidebar-2
{
float: right;
width: 190px;
margin-left: 5px;
padding-top: 20px;
}
/* My centre content */
#content
{
margin-left: 30px;
margin-right: 215px;
font-size: 1.2em;
line-height: 1.4em;
}
This has made a slight improvement:
The search and browse features are now in the right sidebar.
But besides the initial entries the other entries are still aligned to the left.
And ‘Go to content’ ‘Go to navigation’ ‘Go to search’ still appears at the top left.
I hope that’s clear.
Would really appreciate some more ideas!
Many thanks
Tez
Offline
Pages: 1