Modify The Theme Part 2

Quick reference

• 00:04 Okay, so we've got our resume working, the template works.
• 00:07 Now we want to kind of modify it a little bit and
• 00:09 the first thing I notice is this picture.
• 00:11 Let's go ahead and get rid of that but first, let's right-click, and
• 00:14 click View image.
• 00:15 And you'll see up here at the top, it's a JPEG that's 500 by 500 pixels.
• 00:20 So if you want something that looks good here,
• 00:23 you're going to want to use an image that's about 500 by 500, or,
• 00:27 proportional 100 by 100, 200 by 200 will probably look okay but
• 00:32 aim for 500 by 500 if you want to be sure, so I'm going to minimize this.
• 00:37 I have an image right here.
• 00:38 So let's head back over to our code and let's go to our static>resume>img folder,
• 00:44 and we can right-click here and there's the image.
• 00:48 And let's right click and Open Containing Folder, and
• 00:51 that opens the folder where this thing is sitting.
• 00:53 So if I minimize this, I can drag this over here.
• 00:57 Now I'm just going to delete this and I'm going to rename this profile because
• 01:01 that's what it was called in the template, okay?
• 01:03 So now we almost are probably good to go, we can see there it is.
• 01:08 You can come back over here and hit reload and it should work, okay, but
• 01:12 if it doesn't, head back over to your terminal and
• 01:14 Ctrl+C to break out of the server, and then just run the server again,
• 01:18 sometimes with images when you add new images you have to restart the server.
• 01:23 Okay, so we've got our image and that's cool.
• 01:25 Click here, click on the image it goes back to the top.
• 01:28 So now we want to start to modify the stuff to make it our own.
• 01:33 So let's head over to our code and go to our resume.html, and
• 01:36 then just come through here and start modifying.
• 01:39 So here's the title.
• 01:41 I might change this to John Elder's resume, whatever.
• 01:48 Come down here and instead of Clarence Taylor, I want it to be John Elder.
• 01:53 And you can change the links on the left hand side if you want,
• 01:58 to say different things.
• 02:00 And here I'm going to go John and Elder and then just,
• 02:06 come through here and modify these things.
• 02:11 So if we look here, you might not want your email or
• 02:13 phone number listed on your resume.
• 02:15 So if not, you could just find the phone number and
• 02:21 the email and delete them.
• 02:24 I live in Las Vegas,
• 02:29 Nevada, 89137.
• 02:34 Let's call this 12345 Elder Street and
• 02:39 just come through here and start changing things.
• 02:44 So I'm going to Ctrl+S to save this.
• 02:47 Now if you have LinkedIn profile, a GitHub profile and a Twitter page, for
• 02:51 instance, you can add links to those right here.
• 02:54 You know, for instance, I have a GitHub account, it's github.com/flatplanet.
• 03:01 No, I don't think the world is flat, I just find it hilarious some people do.
• 03:05 So we can go ahead and save this.
• 03:07 And click reload, now it says John Elder.
• 03:11 If we click on the GitHub thing, it actually goes to my GitHub account.
• 03:15 That's cool.
• 03:16 And that's how you add those things, right?
• 03:18 So just come through here and change these things.
• 03:21 So whatever jobs you've had, just go through here and
• 03:25 eyeball it, and kind of instead of senior web developer,
• 03:28 maybe you were a junior web developer so, change it to junior, whatever.
• 03:32 Maybe you're not a web developer at all, whatever you've done in your resume,
• 03:37 just sort of add these things and notice here are the dates for each thing.
• 03:41 So modify those to put your dates.
• 03:43 Come down here.
• 03:44 The only other thing that's kind of interesting are these programming
• 03:47 language things.
• 03:48 So let's look at that, it's skills I think it's under, yeah.
• 03:51 We have these cool little icons, maybe you don't know these things, so
• 03:54 you want to get rid of those.
• 03:56 You could do that or you could keep them or whatever.
• 03:59 Workflow, different things you can do.
• 04:02 Interests, a little paragraph for that, if you've won some awards,
• 04:06 notice that they each have little trophies next to them.
• 04:09 That's kind of cool.
• 04:10 If we look at that.
• 04:11 These are just icons probably.
• 04:13 Let's see, where are they?
• 04:15 Yeah, these things right here, fa slash trophy.
• 04:19 Where are those icons?
• 04:20 Well, they're sitting somewhere in our static folder,
• 04:25 maybe in vendor> fontawesome>webfonts,
• 04:30 maybe yeah, fa fa maybe it's in there.
• 04:34 Anyway, if you're interested, you can poke around and, and learn that.
• 04:38 So that's very cool.
• 04:38 So we're calling this resume.
• 04:42 If we wanted to make this, the main page of our website, for
• 04:45 instance, we could get rid of our homepage completely.
• 04:49 So let's do that, let's just delete the homepage.
• 04:52 So let's head over to our resume directory or templates, and
• 04:57 then just right click on home and click Delete.
• 05:01 Now we can head over to resume and let's go Rename.
• 05:06 And down here at the bottom of the screen, we could just type in home.html.
• 05:11 That's cool.
• 05:12 Now we can go to our views.py file.
• 05:14 And we don't need to import this stuff anymore.
• 05:19 And we're not passing anything into our context dictionary anymore,
• 05:23 we can get rid of that.
• 05:25 And we don't need this resume function because we just renamed it to home, so
• 05:30 if we save that.
• 05:31 And finally if we come to our urls.py file, we can get rid of this resume URL,
• 05:35 we don't need that anymore.
• 05:37 Come to our new, our old homepage, it becomes this page right here.
• 05:41 Very cool.
• 05:42 Now if you wanted to reference that other about page that we used to have,
• 05:48 you still could, you just go to our home.html and just find our links.
• 05:54 So like right here, for instance.
• 05:56 Now we just copy all of this and add a new one, and
• 06:01 let's just call this About Me 2, all right?
• 06:06 And here, we could just point this to our old about page, like that.
• 06:13 If we save this and back over here and it reload, now we have this About Me 2 link.
• 06:18 If we click on it, it goes to our old about page, remember that one.
• 06:21 I don't think we would really want to do that, but
• 06:23 I just wanted to show you really quickly that we could.
• 06:26 So I'm going to call this done, you can go through here and
• 06:29 customize this however you like it.
• 06:31 I'm just going to leave this stuff as the default because there's no
• 06:34 real need to make you guys watch me manually change all this stuff up,
• 06:37 but that's all there is to it.
• 06:39 In the next section of the course, l'm going to show you how to actually push all
• 06:43 of this up to the internet so that we can make this live and online so
• 06:47 other people can see it and we'll start to look at that in the next video.

Lesson notes are only available for subscribers.