Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Kenneth Keicher
701 PointsPreview in browser
How do I set Sublime Text 2 to preview my coding in the Chrome browser?
Joe Bissell
13,107 PointsDis guy ^ is the boss.
Kudos for writing that, haha :)
6 Answers
Kenneth Keicher
701 PointsThanks to all of you, Drew, Joe and James. The info you provided was extremely helpful.
Lauren Clark
33,155 PointsCmd + B in Sublime Text opens the current tab you're editing in your default browser. (I assume Windows equiv is CTRL+B can anyone confirm?)
If you're working with a server side language such as PHP you'll need to open it through your local server (MAMP, LAMP etc) You can do this with a keybind, either within Sublime or use Quicksilver or Alfred(Pro) to open localhost in your default browser.
Edit: Not sure if this is standard in Subl 2! Sorry.
James Eden
1,539 PointsHi, Just literally drag the file [index.html] into the Crome window... Or inside Chrome go to File/Open... as if you're opening a document, locate your file and hit OK.
Refresh the Chrome page every time to see changes. Or hit Cmd-r on a mac. Not sure what it is on Win... J
Joe Bissell
13,107 PointsSame for windows basically, just right click on the file created with .html extension and open with whatever browser. You can also right click in Sublime Text and click 'Open in browser'. That will open it in the default program used to open that file.
To refresh, F5 for windows.
Owen McFadzen
5,718 PointsAnother option might also be CodeKit. Its not free (trial or pirate I guess) but its one great piece of kit. http://incident57.com/codekit/
Owen McFadzen
5,718 PointsAnother option might also be CodeKit. Its not free (trial or pirate I guess) but its one great piece of kit. http://incident57.com/codekit/
Kenneth Keicher
701 PointsThanks Owen and Lauren. I'm currently using Notepad++ which is working fine and since I'm a newbie and am working with building a simple website, I am not advanced enough yet to know anything about server side language. I've taken a previous suggestion for my "preview in browser" issue which is to create a shortcut on my desktop that I can double-click in the event that my browser tab gets closed.
Drew Gillett
156 PointsDrew Gillett
156 PointsI guess it depends on what is easiest for you, but they all require you know where you saved the file, and where you're at when you want to open it. If you have either it or a shortcut/alias to it sitting in front of you, unless you made some changes to your system, you should be able to simply double click and it will open in your native browser. If Chrome is not your native browser, you'll need to set that up.
But again, the key is knowing where you saved the file, which may require from Sublime Text 2 going to File>Save As to see where files are being saved and, if you want, changing the location. What I do when I'm doing my testing is save the file(s) I'm working on to either the desktop or a folder I created on my desktop, for easy access (you can always drag and drop the file somewhere else later on, and if you're using relative paths, it won't impact its functionality). Alternately, if it is in part of a program (such as Wordpress) I create a shortcut (PC) or alias (Mac) for the folder it's in and drop that on the desktop. That way I have easy access to it all the time from my desktop.
Of course, if the double-click option isn't opening Chrome, you do have 3 other options available to you: 1) Use the drag and drop method as James Eden suggests. 2) Use the File>Open method Joe Bissell suggests. 3) Or, my favorite one: right click and choose "Open with" and then select the browser you want to choose.
I prefer the right-click method because for me it is the fastest. All I have to do is right click, hover, and usually the option I want is on the list that is displayed (I use Mac, so PC may be different).
You might want to play around and see which options suit you best in which situations. If you're already in the browser, the File>Open may be easiest (though my thinking is "Why? My desktop is a single click away..." The drag and drop thing is not one I like because sometimes I unintentionally drag and drop it to the wrong program, or the Chrome/Safari/Firefox/IE icon isn't readily available. To me, I just think that the choice between double-clicking or right-clicking is the most systematic and therefore the easiest alternate option to double-clicking.
But that's a personal choice you have to choose yourself. :)