Social Media Icons2:52 with Ashley Burke
Turn your Social Media Icons into SVGs to get them onto your site in a scalable manner.
Down at the bottom here we want to replace 0:00 these placeholders with actual social media icons. 0:04 So I do have some icons I've downloaded from the Internet. 0:08 I'm gonna open those. 0:11 And you can see we have Facebook, Twitter, and an RSS feed. 0:16 Gonna marquee over all of them to select all. 0:22 Hit Command C, And, so you can see I'll get out of full. 0:26 I'm just going back and forth between these. 0:33 I'm gonna go back into my wire frame, organize layers. 0:35 Okay, so now I will choose my header in the 480 art board. 0:40 Command V to paste. 0:47 And what we want to do now is line these up perfectly with where they're 0:51 at cuz the placement is right, and we also want to confirm they're the same size. 0:57 Which these are clearly bigger at the moment. 1:02 So let's see. 1:04 These are 60 and this is 120 by 120 so 1:09 I am gonna scale this down. 1:15 I'll do the same for these, if I double click it takes me into isolation mode so 1:18 I just need to click once, and 1:24 that's what's happening is sometimes I'll double click on accident. 1:26 So, transform 60 by 60, oops. 1:31 Okay, and then we'll do this last one. 1:43 60 by 60, 1:46 and we'll use our align tools to line these up. 1:51 So I'll select, let's just zoom in a little bit so you can see better. 1:55 Select the Facebook icon and this first. 2:00 Placeholder. 2:03 And then I'll select the placeholder one more time because I want it to 2:06 be the target. 2:10 And then we'll do horizontal align center. 2:14 And vertical align center and you can see that pops right into place, 2:18 that's perfect,that's just what I need. 2:22 I'll do exactly the same thing here, horizontal line,vertical line. 2:24 Select that one more time. 2:35 Okay, great. 2:42 Good job, I am going to repeat these steps on the desktop side and 2:43 I will meet you back and we will move on to type. 2:48
You need to sign up for Treehouse in order to download course files.Sign up