Two issues with Fjords theme: header and columns
-
Hi folks—
I’m having similar (but not identical) problems to this thread: http://wordpress.org/support/topic/206252 at
http://poeskitchen.wordpress.com
I’m trying to make a four-column theme with a customized header a two-column theme with the same header. (I haven’t bought Custom CSS yet; I’m just using preview.) All I did was delete sidebars 2 and 3 from the below and enlarge the widths of the content and sidebar 1 columns by exactly the number of pixels I’d deleted.
That worked—sort of; what then happened was the right-hand column was really all three sidebars piled on top of each other, and the four parts of the banner were gone from the top, each part alternating instead within the column. What did I do wrong?
Deciding to start over, I just copied the entire original style sheet into my Edit CSS window (because, for some reason, even if I delete everything that’s in that window and close the page, it’s still there when I open it again.)
The original style was restored—*except* for the header. It’s gone; nothing there. Why, any thoughts?
Thanks much!
#content, #sidebar-1, #sidebar-2, #sidebar-3 {
background: #ffffff url(imagenes_qwilm/beach.jpg) no-repeat top left;
overflow: hidden;
}#content {
width: 270px;
text-align: left;
border-top:solid 1px #CED4CA;
border-bottom:solid 3px #CED4CA;
border-left:solid 1px #CED4CA;
border-right:solid 3px #CED4CA;
float: left;
margin: 5px;
padding-top: 0px;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 30px;
}
#sidebar-1 {
width: 170px;
background-position: -300px 0;
}
#sidebar-2 {
width: 170px;
background-position: -500px 0;
}
#sidebar-3 {
width: 170px;
background-position: -700px 0;
}The blog I need help with is: (visible only to logged in users)
-
-
Try copy and pasting this, I cant believe how great this theme looks as a two column. You should definitely get the css upgrade and do it lol
#content, #sidebar-1, { background: #ffffff url(imagenes_qwilm/beach.jpg) no-repeat top left; overflow: hidden; width: 600px; } #content { width: 670px; text-align: left; border-top:solid 1px #CED4CA; border-bottom:solid 3px #CED4CA; border-left:solid 1px #CED4CA; border-right:solid 3px #CED4CA; float: left; margin: 5px; padding-top: 0px; padding-left: 15px; padding-right: 15px; padding-bottom: 30px; } #sidebar-3, #sidebar-2 { clear:both; width:95%; padding-top:3em; } -
in the last class add “display:none” to it, like this,
#sidebar-3, #sidebar-2 { clear:both; width:95%; padding-top:3em; display: none; } -
Also the reason that fjords doesn’t show when you go to appearance > themes is that you are already using it. The theme pages will not show the theme you are already using.
-
Yeah, if you’re able to use this theme then it’s available.
for the header image, go to your media and upload the header image and obtain the url.
enter the url of your header image in the part of the CSS code where it says, “imagenes_qwilm/beach.jpg”background: #ffffff url(imagenes_qwilm/beach.jpg) no-repeat top left; -
-
-
-
One other question—since I did what Word Press’s instructions say not to do and just pasted the original stylesheet into the window to play with it, I’m a little concerned about what could go wrong when I save the changes. The warning WP gives has to do with link breakage, but wouldn’t that only affect the banner, which I’ve already fixed thanks to you?
Also, since I did just paste the whole thing (minus the comments), I assume that means I should hit the “start from scratch” rather than the “add to the existing stylesheet” radio button before I save changes?
Thanks again! I’m more used to working with Typepad, which has a very different setup.
-
Just make sure that you have “Start from scratch and just use this” selected before you click save and everything should be alright.
-
-
-
Uh-oh—help!! I did the start from scratch thing, and now the whole content box and side bar have the pattern, not just the header. Why? Here’s the site:
http://poeskitchen.wordpress.com
Here’s the code (which I’m going to alter slightly just so the text is readable while I’m waiting to fix it back so that the main boxes are white like before).
Thank you!
body {
background-color:#DAA520;
font:12px “Lucida Sans Unicode”, “Lucida Sans”, verdana, arial, helvetica;
color:#000000;
}a,a:hover {
color:#8ab459;
text-decoration:none;
}#wrapper {
padding-left:0;
width:970px;
margin-left:auto;
margin-right:auto;
}#mini-nav {
width:20px;
float:left;
padding-top:30px;
position:fixed;
margin:5px;
}#mini-nav img {
margin:1px;
}#hode {
width:250px;
color:#ffffff;
height:170px;
text-align:left;
clear:both;
background:transparent;
margin:5px;
padding:10px 0 0;
}#content,#sidebar-1, {
background:#ffffff url(‘imagenes_qwilm/beach.jpg’) no-repeat top left;
overflow:hidden;
width:600px;
}#content {
width:670px;
text-align:left;
border-top:solid 1px #CED4CA;
border-bottom:solid 3px #CED4CA;
border-left:solid 1px #CED4CA;
border-right:solid 3px #CED4CA;
float:left;
margin:5px;
padding:0 15px 30px;
}#sidebar-1 {
width:170px;
background-position:-300px 0;
}#sidebar-3,#sidebar-2 {
clear:both;
width:95%;
padding-top:3em;
display:none;
}#logo {
width:140px;
padding:10px;
}.sidebar {
text-align:left;
border-top:solid 1px #CED4CA;
border-bottom:solid 3px #CED4CA;
border-left:solid 1px #CED4CA;
border-right:solid 3px #CED4CA;
float:left;
background:#ffffff;
font-size:.9em;
margin:5px;
padding:220px 15px 30px;
}.post {
border-bottom:solid 1px #DEE4DA;
padding-top:30px;
padding-bottom:0;
}.post-titulo {
color:#ACB200;
margin:0 0 2px;
}.sticky h2 a {
background-color:#63B4CD;
color:white;
display:block;
padding:10px;
}.sticky h2 a:hover {
background-color:transparent;
color:#63B4CD;
}.postmeta {
margin-top:0;
padding-top:1px;
font-size:.9em;
color:#999;
}.comentarios-link {
background:url(‘imagenes_qwilm/commentslink.gif’) no-repeat center left;
padding:0 0 0 17px;
}h1,h2,h3,h4 {
font-family:”Lucida Grande”, Tahoma, Arial, sans-serif;
}h1 {
text-indent:-9000px;
display:none;
margin:0;
}h2 {
margin-top:25px;
margin-bottom:0;
font-size:16px;
}h2 a {
color:#8B0000;
}h3 {
font-size:14px;
color:#666;
}h4 {
font-size:17px;
color:#ffffff;
margin:0;
padding:0;
}h4 a {
color:#ffffff;
}p {
line-height:1.5em;
margin:1.2em 0;
}ol,ul {
line-height:1.5em;
margin:1.2em 0 1.2em 2em;
}ul li,ol li {
margin-bottom:.2em;
}img,a img {
border:0;
}a:hover {
color:#777;
}em {
font-style:normal;
font-weight:bold;
color:#ef6c6c;
}blockquote {
border-left:4px solid #E8E7D0;
font-size:.9em;
margin:0 20px;
padding:0 20px;
}pre {
display:block;
padding-left:.8em;
border-left:1px solid #ccc;
background-color:#eee;
overflow:auto;
margin:1em 1.5em 1em 0;
}code {
font-family:monospace;
font-size:11px;
background-color:#eee;
}pre code {
line-height:1.3em;
}kbd {
background-color:#ddd;
border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
font-size:inherit;
font-family:inherit;
padding:0 3px 2px 4px;
}del,del * {
text-decoration:line-through;
}.small {
font-size:.9em;
color:#999;
}#comment {
width:100%;
}.comentarios {
border:1px solid #DEE4DA;
background-color:#F3F3F3;
margin-top:5px;
margin-bottom:5px;
padding:5px;
}.commentarios li {
border:1px solid #DEE4DA;
background-color:#F3F3F3;
margin-top:5px;
margin-bottom:5px;
padding:5px;
}.commentarios li:hover {
background-color:#fff;
}.comentariosmeta {
margin-top:0;
padding-top:1px;
font-size:.9em;
color:#999;
}.comentariostitulo {
margin:0 0 2px;
}div.comment {
margin-left:1.5em;
}.sidebar h2 {
display:inline;
color:#8B0000;
background:url(‘imagenes_qwilm/arrow.gif’) no-repeat center right;
font-size:1.1em;
margin:1.2em 0 .6em;
padding:0 10px 0 0;
}.sidebar ul {
list-style-type:none;
margin:0;
padding:0;
}.sidebar ul ul {
border-top:1px solid #dee4da;
margin:1em 0 1.5em;
}.sidebar ul ul li {
border-bottom:1px solid #dee4da;
padding:0 0 0 10px;
}.sidebar ul ul li a {
display:block;
margin:0 0 0 -10px;
padding:2px 10px 0;
}.sidebar ul li.widget_twitter ul li a {
display:inline;
margin:0;
padding:0;
}.sidebar ul ul li a:hover {
background-color:#f3f3f3;
}.linkpermanente {
background:url(‘imagenes_qwilm/permalink.gif’) no-repeat center left;
padding:0 0 0 17px;
}input,textarea,select {
border:1px solid #C1C0B5;
background-color:#FAFAF0;
color:#555;
font-size:1em;
font-family:”Lucida Sans Unicode”, Tahoma, Arial, sans-serif;
}#pagina {
border-bottom:solid 1px #DEE4DA;
padding-top:30px;
padding-bottom:0;
}.pagina-titulo {
color:#63B4CD;
margin:0 0 2px;
}.gravatar {
float:right;
}.comentarios-autor {
border:1px solid #B2FF66;
background-color:#95FFCE;
margin-top:5px;
margin-bottom:5px;
padding:5px;
}.comentarios-autor li {
border:1px solid #B2FF66;
background-color:#95FFCE;
margin-top:5px;
margin-bottom:5px;
padding:5px;
}.comentarios-autor li:hover {
background-color:#fff;
}#searchform {
width:100%;
}.avatar {
float:right;
}.wp-smiley {
border:none;
padding:0;
}img.centered,img.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}img.alignright {
display:inline;
margin:0 0 2px 7px;
padding:4px;
}img.alignleft {
display:inline;
margin:0 7px 2px 0;
padding:4px;
}.alignright {
float:right;
}.alignleft {
float:left;
}.aligncenter,div.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}.wp-caption {
border:1px solid #ddd;
text-align:center;
background-color:#f3f3f3;
padding-top:4px;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
margin:10px;
}.wp-caption img {
border:0 none;
margin:0;
padding:0;
}.wp-caption p.wp-caption-text {
font-size:11px;
line-height:17px;
margin:0;
padding:0 4px 5px;
} -
Even weirder—I notice, looking at that, that the change I made yesterday—
Yeah, if you’re able to use this theme then it’s available.
for the header image, go to your media and upload the header image and obtain the url.enter the url of your header image in the part of the CSS code where it says, “imagenes_qwilm/beach.jpg”
background: #ffffff url(imagenes_qwilm/beach.jpg) no-repeat top left;—has reverted itself above, yet the correct pattern appears on the blog!
-
don’t start from scratch, click “Add this to the Fjords04 theme’s CSS stylesheet”
I dont understand the second question, sorry.
-
Oh, I didn’t even try that; I just thought I’d permanently changed the style sheet! Thanks!
The second question I was just curious about—remember yesterday when I’d said my heading had disappeared? You told me to replace the URL that ends “beach.jpg” with my custom header URL. I did, but now it’s back to the beach one, yet the right banner still appears. Baffling.
You’re quite the pro, aw1923, thanks!
- The topic ‘Two issues with Fjords theme: header and columns’ is closed to new replies.
WordPress.com Forums 