MasonSklut.com | The Macintosh Weblog

Changing Mac OS X Archive Preferences

A Nice feature that is conveniently built in with Mac OS X is the Archive feature. It allows you to compress files to reasonable sizes that are more manageable. If you deal with lots of archives and prefer to keep your Mac as organized as possible, you may be glad to hear that you can change the Archive preferences.

1. Open Finder
2. Go to Macintosh HD > System > Library > CoreServices
3. In CoreServices, right-click on Archive Utility and select Show Package Contents.
4. In Contents > Resources, locate Archives.prefPane
5. Double-click on the file and you will be prompted to install it in System Preferences. 
6. In System Preferences, click on Archives.
7. The “Save expanded files” field affects the files in the archive you open up. 
8. The “After expanding” field allows you to choose a location to put the archive after it expands.
9. The other options should be left with their default settings, unless you want to change them.
10. If you don’t want to keep it System Preferences, just follow steps 1-3 (excluding Show Package Contents) and open up the Archive Utility. From there, go the Archive Utility menu > Preferences.

Screenshots: 1-3, 4, 5, and 7-8.

Make Your Own Album Covers For Genres In iTunes 8

With the new version of iTunes, version 8, you now have the capability to use Grid View as a more organized music selection. One feature in particular that bothered me was the genre section in Grid View because it’s not very customizable for the user. Mostly for me, it’s just that you can’t edit the genre album covers with one of your own. There is a way to use existing album covers from your iTunes library, but still not a way to place your own cover as the default genre cover. With a little creativity and Photoshop, this can be done.

1. Open up iTunes.
2. Go to Grid View and select Genres.
3. Now look for any genres you want to replace with your own cover.
4. Open up Photoshop, and make a 256 x 256px image for the album cover.
5. Save it as “genre-80’s.jpg” or whatever genre name you want, to the Desktop.
6. Right-click on iTunes in Finder and choose Show Package Contents.
7. Put the album cover in the iTunes > Resources folder.
8. Browse through Contents > Resources > genres.plist and open it up with a text editor (ex. Coda).
9. Type in the following code for the genres you want to add album covers for:

                  <dict>
   			<key>matchString</key><string>80's</string>
   			<key>resourceFile</key><string>genre-80's.jpg</string>
                 </dict>
   

10. Now quit iTunes and open it back up.
11. You should see the new album covers you made.

Screenshots: 2, 4, 6, 7, 8, 9, and 15.

How To Move Your Files From Windows To Mac

Surprisingly, one of the easiest things when moving to the Mac, is getting all of your previous files from the PC moved over. It’s actually something a lot of newcomers have questions about. Here’s how to do it:

1. On your Mac, open up System Preferences.
2. In System Preferences, click on the Sharing icon.
3. Near the top of the window, change your Computer Name to something else, preferably with one name (i.e. Mason).
4. Now, check the File Sharing service in the left pane.
5. Once you’ve done that, click on the Options button located in the bottom right.
6. Check the “Share files and folders using SMB”. Make sure you check the Account name right below too.
7. Quit System Preferences and go to your Windows PC now.
8. From the Start menu, go to Run.
9. Type in \\mason\Mason (i.e. mason is my Mac’s admin name, and Mason is my Computer Name).
10. Then a window will prompt you for your username and password. Type in the same username and password you do on your Mac.
11. After doing that, you will see all of your Mac’s folders in a new window.
12. I recommend just dragging the files you want directly onto the corresponding Mac folder.
13. It can take a while depending on your file sizes.
14. That’s it!

Screenshots: 1, 2, 3-5, 6, 8, 9, 10, 11, and 12.

Taking Advantage With Photoshop Actions

I use Photoshop for a lot of the design work I do. When I take screenshots for The Macintosh Weblog, I always use a red arrow to point to something in the screenshot that corresponds with the step in the tutorial. The arrow consists of using the line tool and layer styles. That’s it. But the thing is, I use it so often, having to re-do the arrow everytime wastes time. I’ll show you how to save that “valuable” time by using Photoshop Actions:

1. Open up Photoshop and make a new document (⌘ + N).
2. I’m using the default settings: 7 x 5 inches.
3. Go to Window > Actions and the Actions palette will appear.
4. Click on the “dog-eared” paper icon in the bottom corner of the palette.
5. Type a title for your action and choose a keyboard hotkey to activate it.
6. Click “Record” and start making the action.
7. When you’re done with recording the action, click on the stop button (square icon) in the Actions palette.
8. Now you have a simple (or complicated) action that you can easily activate when you use Photoshop.

Screenshots: 1-2, 3, 4, 5-6, and 7.

Customizing Effects In Keynote Presentations

Apple’s Keynote packs quite a punch when it comes to making your presentation’s smooth. Most of Keynote’s hidden features are within the Effects. In this tutorial, I’ll point out how you can tweak each of your slides with one or more of Keynote’s effects.

Add Effects And Actions To Text

1. Choose a theme for your Keynote presentation.
2. After you’ve picked a theme, feel free to throw some images (click on Media button) in a slide along with a title and some text.
3. To add effects to the titles and text, select the text and go to the Inspector.
4. In the Inspector window, click on the yellow diamond icon.
5. From one of the three sub-sections (Build In, Build Out, and Action), you can pick any one of the effects from the Effects drop-down menu.
6. To make an effect follow a path, click on the Action tab. Choose Move and you position the red path where you want the text to go. Choose a type of Acceleration depending on how you want it to appear.
7. The beauty with Actions is you can add as many as you want and customize them as much as you want with the “Add Actions” and “More Options” buttons on the bottom of the Inspector window.

Screenshots: 1, 3, 4-5, 6, and 7.

Add Smooth Transitions To Images

1. To add serious effects to images, click on the Smart Builds button in the Formatting bar.
2. Select one of the many options from the drop-down menu.
3. When the build appears, you need to insert some pictures in there (using the Media button).
4. If you want, you can add shadows, frames, and reflections to your pictures too (click on the icon right of the “T”).
5. Now that you’ve got your pictures setup, go to the Action pane in Inspector and tweak the settings to your liking.
6. To put some sweet intro transitions with the images, click on Build In and pick out something like Flame.
7. To add an exit transition with the images, just click on the Build Out tab and choose an Effect like Confetti. Make sure you choose which order to make the transition run, by choosing a number from the Order drop-down menu.
8. To ensure that the presentation runs smoothly, choose “Automatically after transition” in the Smart Build drawer.

Screenshots: 1, 3, 4, 5, and 6-8.

How To Code Websites With Coda

I’ll be honest, I’ve tried using Dreamweaver once before. Being oblivious to what the current web standards were (table-less), I didn’t know that much, so I figured what I was doing, or for that sake what Dreamweaver was doing behind the scenes was fine. I was wrong. Dreamweaver inserts a lot of bloat code which takes time to go back and take out. The whole process of using Dreamweaver was a terrible experience even for a novice like me. Even the built-in FTP program stinks. While reading a Mac blog (other than my own), I noticed Panic released Coda. I must say, they spent a lot of time putting this beautiful piece of software together. When Coda came out, I was really interested in web development, even more than before. So, I decided to learn how to “hand-code” websites using XHTML and CSS. Let me say, it’s been a wonderful experience learning how to code websites by hand — you have so much more control over what you’re doing. The best part is, it’s easier for you to maintain later on, since you wrote it yourself. After using Coda since early this year, I’d like to show other users the basics of using the program itself.

Setting Up Your Site

1. To setup a site, go to the Remote view in Coda.
2. Once there, click on the Add Site button on the bottom of the window.
3. Enter your settings for your site in the corresponding text fields.
4. Done.

Screenshots: 1-2, and 3.

FTP (File Transfer Protocol)

1. After you setup a site, open Coda (must be in the Remote view) and you will see an icon of the website your developing.
2. Double-click on it to login to the remote server.
3. All of your files will appear in a sidebar.
4. To change access privileges or rename file, right-click on it in the sidebar.
5. To add folders or files, click on the “+” button in the bottom-left corner. Option-click on the “+” to add a folder.

Screenshots: 1, 3, 4, and 5.

Writing/Editing Files

1. To open/edit a file, click on it from the sidebar. You can change your preferences [view screenshot] so you have to double-click instead (it’s a must if you have a tendency to hit the Return key by accident).
2. When you begin coding, select the Syntax you will be using (HTML, CSS). This makes auto-completion [view screenshot] work as well as invalid code warnings.
3. If you’re new to coding, turn on Hints button (bottom), so you will see programming hints for the attributes you write.
4. As you’re coding it’s necessary to make sure it’s valid code. Turn on the warning button (black triangle located beside Clips). When an error appears, a yellow triangle will appear with a tooltip explaining what’s wrong.
5. If you want to replace something like an entire set of <p> tags with <li> tags, use the Find/Replace feature. You can insert “wildcards” (button beside check mark) meaning it will find anything after/before the <p> depending on where you insert the wildcard.
6. After making an edit, you can preview your changes with the built-in browser. Just click on the Preview tab.

Screenshots: 2, 3, 4, 5, and 6.

Save Time Coding With Clips

1. After you code your first site, there are probably helpful “snippets” of code that you want to use again in future site (i.e. navigation bars, DOCTYPE, etc,.)
2. This is where Coda’s Clips feature comes in handy.
3. To edit Clips, click once on the Clips button in the bottom of the window
4. To access your Clips while your coding, hold down the Clips button at the bottom of the window and a menu will appear for both the Global and Site Clips you have.
5. In the Clips window, you probably see a few defaults. To remove them, click on the “-” button.
6. To add Clips, click on the “+” button. Add a title and paste the code write into the text area below.
7. If you would like the cursor to go to a specific spot in code after it is inserted, click on the “Selection Placeholder” button in the spot you want.
8. To add a shortcut for a Clip, click in the area that says “click here to add a tab trigger”. Type in a letter then save your clip.
9. Now you just have to hold down KeyboardKey+Tab and your clip will magically appear.

Screenshots: 3, 4, and 6-8.

Built-in Reference Books

1. Coda comes with several references books: HTML, CSS, JavaScript, and PHP.
2. When you open one of the books, you will see every possible attribute or tag that goes along with the selected programming language.
3. Click on one of the attributes to see examples on how to implement them in your site.

Screenshots: 2 and 3.

Coding With CSS

1. Coda makes coding with CSS a dream with the built-in editor.
2. You can use the CSS editor if you aren’t familiar with CSS quite yet. Personally, I like coding without the editor because you can’t use CSS shorthand from within the editor.
3. When you code it by hand, having the Symbols window open, makes it easier to quickly go back to a div#ID or div.class just by clicking on the symbol you want.

Screenshots: 2 and 3.