Jump to content
Stef's Coding Community

Wordpress theme, lost link to css


Recommended Posts

Hi.

 

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

Link to post
Share on other sites

On my made-from-scratch WP site, the code for the link to the stylesheet looks like this:

 

<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?

Link to post
Share on other sites

Looking at the source code to your site, you stylesheet should be here:

 

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.

Link to post
Share on other sites

First, I really appreciate that you're taking the time to look at this. Many thanks for that.

 

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.... :(

Link to post
Share on other sites

Hmmmm - that is odd.

 

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.killersites.com/community/index.php?/topic/3010-cant-open-my-website/page__gopid__16509&&do=findComment&comment=16509

 

This is probably a long shot, but I have no other guesses.

Link to post
Share on other sites

There shouldn't be a .txt, in that case it should be at the end of the index file as well, as both are created with the same text editor (text wrangler)

 

 

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;

}

Link to post
Share on other sites

Your stylesheet looks like it should, so I'm at a loss.

 

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.

Link to post
Share on other sites

Do you recall if you did something out of the ordinary between your CSS last working and not working - like moving your files or folders around?

 

Just another hunch based on Susie's comment re your htaccess)

Link to post
Share on other sites

@Andrea; Nope, didn't change anything in the file structure. But as I mentioned in an earlier post to this thread, it worked (in the very beginning), and then I lost the link.

 

@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

Link to post
Share on other sites

Can you switch to a different theme for a moment, see if the CSS works there, and if so - look at those paths and codes - maybe you find the 'un'common denominator.

 

Just grasping at straws at this point, but something's gotta solve this issue........

Link to post
Share on other sites

the head of my index.php

(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>

Link to post
Share on other sites

the body (if relevant. if not i'll delete this post)

 

 

 

<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>

Link to post
Share on other sites

I haven't checked out the WP videos here, so I'm not sure why you don't have a header.php file. Every theme I've ever created or worked with has always had one. (http://codex.wordpress.org/Theme_Development)

 

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.

Link to post
Share on other sites

goodlord, you people are amazing!

 

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)

Link to post
Share on other sites

Well, the tutor is working locally, while I uploaded the files to my wp setup on my server. If that can be an issue. But if I'm not mistaken, at this point in the tutorial, he too only had these two files in his working folder; index.php and style.css

Link to post
Share on other sites

Well, I logged in and poked around and the only thing that comes to mind is that you need a header.php file. Since you aren't finished with the videos, maybe your theme is incomplete right now.

 

Something I notice when going to the stylesheet link ( http://thorirvidar.com/wp/wp-content/themes/120312_template/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

Edited by Susie
Link to post
Share on other sites

Yes, the only files created at this point in the tutorial, are the index.php, and style.css. No other wp files.

 

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)

Link to post
Share on other sites

Yes, I found it really strange that when going to the css file itself, it brings up the file_not_found page.

 

 

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

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...