Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.

Preview

Start a free Basic trial
to watch this video

Sign up for Treehouse

Porting Over Static Template CSS

1:24 with Zac Gordon

In this video we import the CSS from our static template into our style.css file.

  • 0:00

    [MUSIC]

  • 0:04

    Now, that we have our basic files set up, so that we could activate our theme, we're

  • 0:10

    going to look at how to control CSS and JavaScript, using the functions.php file,

  • 0:15

    so that we properly pull in all of our styles and scripts for our site.

  • 0:21

    In the project downloads folder we have the static theme,

  • 0:24

    which was the original HTML, CSS, and

  • 0:27

    JavaScript that our designer gave to us to convert into a WordPress theme.

  • 0:33

    What we're going to do is open up style.css file.

  • 0:38

    And copy all of the content into the bottom of our style.css file,

  • 0:43

    where we have the special Word Press comment at the top.

  • 0:47

    [BLANK_AUDIO]

  • 0:52

    One important thing to mention here is this @import rule.

  • 0:56

    In Word Press the best way to link to either external or additional CSS

  • 1:02

    files is via the functions.php file, which we created earlier.

  • 1:09

    So, what we're going to do is in the next video we'll look at how to properly,

  • 1:13

    from Word Press perspective, link to this CSS file.

  • 1:18

    As well as, to the additional CSS files that come with our static template.

You need to sign up for Treehouse in order to download course files.

Sign up