Wordpress theme, lost link to css
#1
Posted 12 March 2012 - 05:48 PM
I'm trying to follow along the Wordpress Theme From Scratch video tutorial, and have lost the link to my css file. Everything is uploaded to the wp folder on my server (my_page/wp, which is what the top css comment specifies), and I've stared at the code for over an hour now, and can't spot the error.
The weird thing about it is, that in the very beginning of making the css, the file responded. Then the link between the two got lost. So I'm assuming I must have accidentally changed something in the html that affected this, but I can't spot it (yep, total newbie)
Any idea on how to troubleshoot this?
Best
Th
#2
Posted 12 March 2012 - 05:59 PM
<link rel="stylesheet" href="http://myUrl.com/wp-content/themes/myTheme/style.css" type="text/css" media="screen" />
"myurl" and "myTheme" of course for you should be whatever your domain and your theme name are, but other than that, that's what you need in your code.
And the relevant code in your header.php should be:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
Does that help?
#3
Posted 12 March 2012 - 06:17 PM
As expected, the code for my link is:
<link rel="stylesheet" href="http://myurl.com/wp/wp-content/themes/mytheme/style.css" type="text/css" media="screen" />
(wp is set up in a /wp directory)
The code in my index.php head is just as you typed...
#4
Posted 12 March 2012 - 07:58 PM
Do you have a link to your site?
#5
Posted 13 March 2012 - 03:38 AM
site is at thorirvidar.com/wp/
#6
Posted 13 March 2012 - 05:23 AM
http://thorirvidar.c...plate/style.css
thorirvidar.com/wp/wp-content/themes/120312_template/style.css
But it is not. All I see is your Page-not-Found page.
You need find your style.css and move it into the 120312 template folder per above link.
If it is there for some reason, post whatever you have inside, here.
#7
Posted 13 March 2012 - 05:51 AM
As for the .css file, here is a screenshot.
I hadn't tried typing in the actual .css webadress to look for it, and you're right, it doesn't seem to be there.
But as you see in the screenshot, it is, only it doesn't show up....
#8
Posted 13 March 2012 - 05:52 AM
/*
Theme Name: 120312_template
Theme URI: http://thorirvidar.com/wp/
Description: Simple Wordpress Theme
Version: 1.0
Author: Thorir V
*/
#9
Posted 13 March 2012 - 05:59 AM
#10
Posted 13 March 2012 - 07:04 AM
I have two theories left:
First, please copy and paste the ENTIRE code inside your css file here - maybe there's something strange going on in there.
The second possibility that comes to mind, is that maybe you have a hidden extra extension of .txt on your CSS - (but I tried to open style.css.txt, and that did not work, either) but it's worth a try: Start at post # 6:
http://www.killersit...509
This is probably a long shot, but I have no other guesses.
#11
Posted 13 March 2012 - 07:20 AM
Anyway, here's the .css (at this stage in the course (top level navigation), cause I want to solve this before moving on. It doesn't make much sense to be following the further edits until I can figure out this link issue,.. which brings me to... I'm using the latest version of wordpress, while the tutorial was made while it was in 2.x. Am I correct by assuming that doesn't matter?)
-
/*
Theme Name: 120312_template
Theme URI: http://thorirvidar.com/wp/
Description: Simple Wordpress Theme
Version: 1.0
Author: Thorir V
*/
*
{
padding: 0 0;
margin: 0 0;
font-family: Helvetica, Arial, Sans-serif;
}
body
{
background: #A0cc44;
}
.canvas
{
width: 900px;
margin: 0 auto;
background: #FFFFFF;
}
.header
{
padding: 10px;
padding-left: 0px;
padding-bottom: 0px;
padding-right: 0px;
background: #EEEEEE;
}
.header h1 a
{
text-decoration: none;
color: #000;
}
.header h1 a:hover
{
color: #333;
}
.header h2
{
font-size: 10pt;
padding-bottom: 5px;
}
.content
{
margin-top: 10px;
margin-left: 10px;
}
.post
{
background: #EFEFEF;
padding: 10px;
margin: 10px;
}
.post h1
{
font-size: 13pt;
}
.post h2
{
font-size: 10pt;
font-weight: normal;
top: 10px;
}
/* navigation */
.nav
{
background: #A0AA44;
padding: 5px;
}
.nav li
{
display: inline;
}
.nav li a
{
text-decoration: none;
padding: 5px 15px;
color: #FFF;
font-size: 15pt;
}
.nav li a:hover
{
text-decoration: underline;
background: #FFF;
color: #000;
}
#12
Posted 13 March 2012 - 08:07 AM
The version doesn't matter - I used the same tutorial and had no problems adapting it to newer versions. I'll alert Susie, our WP expert, to see if she has any ideas.
#13
Posted 13 March 2012 - 09:14 AM
... Often times this strategy works. I know from experience.
Stefan
#14
Posted 13 March 2012 - 09:39 AM
Now... afk for a while
#15
Posted 13 March 2012 - 10:14 AM
#16
Posted 13 March 2012 - 10:36 AM
Just another hunch based on Susie's comment re your htaccess)
#17
Posted 13 March 2012 - 01:29 PM
@Susie; the .htaccess file:
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /wp/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /wp/index.php [L]
</IfModule>
# END WordPress
#18
Posted 13 March 2012 - 02:08 PM
Just grasping at straws at this point, but something's gotta solve this issue........
#19
Posted 13 March 2012 - 02:22 PM
<link rel="stylesheet" type="text/css" media="all" href="http://thorirvidar.com/wp/wp-content/themes/twentyten/style.css" />
and it works..
#20
Posted 13 March 2012 - 02:35 PM
#21
Posted 13 March 2012 - 02:41 PM
(i have no header.php file, so i assumed....)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?>" RSS Feed href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<?php wp_head(); ?>
</head>
#22
Posted 13 March 2012 - 02:42 PM
<body>
<div class="canvas">
<div class="header">
<h1><?php bloginfo('name'); ?></h1>
<h2><?php bloginfo('description'); ?></h2>
<div class="nav">
<?php wp_list_pages('title_li='); ?>
</div>
</div>
<div class="content">
<?php if ( have_posts() ) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post">
<h1>
<a href="<?php the_permalink(); ?>">
<?php the_title();?>
</a>
</h1>
<h2><?php the_author();?></h2>
<p>
<?php the_content('Read more...'); ?>
</p>
<?php edit_post_link('edit page', '', ' '); ?>
</div>
<?php endwhile;?>
<div class="navigation">
<div class="alignleft"><?php next_posts_link('< Older entries'); ?></div>
<div class="alignright"><?php previous_posts_link('Newer entries >'); ?></div>
</div>
<?php
else:
?>
<h2>Not Found</h2>
<p>
Sorry, I can't find what you are looking for.
</p>
<?php
endif;
?>
</div>
</div>
</body>
</html>
#23
Posted 13 March 2012 - 02:50 PM
Did the videos specifically tell you not to include one?
If you would like to create a temporary user for me (with admin access) and then PM me with the login, I'd be happy to log in and take a look.
#24
Posted 13 March 2012 - 03:18 PM
#25
Posted 13 March 2012 - 03:21 PM
I was only about halfway through the tutorial when the link broke. At that point we were only working with index.php and a style.css, but I see the project files include a number of other files, including header.php.
(pm sent)
#26
Posted 13 March 2012 - 03:26 PM
#27
Posted 13 March 2012 - 03:37 PM
#28
Posted 13 March 2012 - 03:54 PM
Something I notice when going to the stylesheet link ( http://thorirvidar.c...plate/style.css ) is that you can view the source of the page and see the entire index.php file. You shouldn't be able to do that.
Here's an example of how a properly working WP theme's stylesheet should look when you go straight to the file (it's mine): http://goo.gl/T6yCp
This post has been edited by Susie: 13 March 2012 - 03:55 PM
#29
Posted 13 March 2012 - 03:58 PM
I had been following the code from beginning, and sometimes in the last video or so (top level navigation), he was making changes to his css and was seeing the changes in his browser (working on localhost, which I am not). Then at some point I lost the link to my css, and he carried on, still linking to his css.
(I did realize that a wp theme needs more files, I just expected to be able to follow the code in the tutorial, with my files behaving in the same manner as the tutor's)
#30
Posted 13 March 2012 - 04:05 PM
Well, I think I'll let it rest for a couple of days, then continue with the tutorial and see if I starts to make sense.
In any case, many many thanks for all the input. I greatly appreciate it!
Best
Th

Help















