Newer posts are loading.
You are at the newest post.
Click here to check if anything new just came in.

December 30 2013

07:30

Codeblock.js: Edit and Run JavaScript Directly from Within Your Browser


  

Talking about introducing JavaScript frameworks, libraries or just step by step tutorials, it is always useful, if you are able to support all your words by a handful of fitting live examples. So, instead of just posting dead code snippets, would it not be far better, if you could embed JavaScript in a way that it can be edited and run by your readers, without forcing them to download examples and what not first? That’s what Codeblock.js offers…

September 27 2010

20:52

20 Excellent Coda Tips

I’ve been using Coda for a while now, and it’s become my web development application of choice. There are quite a few great web development applications out there (read “18 Wonderful IDEs for Windows, Mac, and Linux“) but if you’re a Mac user, Coda is easily one of the best.

Here are 20 excellent Coda tips to increase productivity that I’ve gathered during my use of Coda so far.


1. Set Your Preferences

There are a few things I had to change right away when I first started using Coda. These are all found in Coda’s preferences.

I never use a GUI CSS editor so I set Coda to always open CSS files with the text editor.

Coda Preferences General Tab

Under the Editor tab I’ve check-marked “Show line numbers” and “Use tabs” for indenting. You can hide/show line numbers by pushing Command + Option + L as well.

Coda Preferences Editor Tab

Under the Colors tab I’ve check-marked “Highlight Current line” to make it easier to see where the cursor is when switching back and fourth between applications.

Under the files tab I set files to open when double clicked instead of a single click. You may also need to setup your external editors. Coda automatically used Photoshop for the image formats I use.

Coda Preferences Files Tab

This is how Coda’s navigation bar at the top is by default. This is just a waste of space in my opinion although it is pretty.

Coda Nav Bar Big

I’ve changed mine to display only text titles and as small as possible. Since I don’t use the buttons I have that section minimized most of the time anyway. Instead I use the shortcut keys which I’ll cover next.

Coda Nav Bar Small

Aside from these changes, I’ve left everything else at the default settings. I’ve played around with the color schemes a little but I didn’t find anything I was really happy with so I’ve kept the default color scheme.


2. Switching Modes

If you aren’t using shortcut keys to change modes, now is a good time to learn. Pushing Command + 1-6 changes the mode you’re in. You can switch between your sites, editor, preview, etc. modes very quickly this way.


3. Navigating Open Documents

Pushing Command + Shift + Left or Right Bracket will navigate through your open documents.


4. Line Indenting

Coda automatically indents certain markup for you by default but you’ll still find yourself using the Tab button pretty frequently. Instead of jumping to the front of a line to indent it you can push Command + Left or Right Bracket to indent the line the cursor is currently in.


5. Clips and Text Inserts

Pushing Command + Control + C will open up Coda’s clips. Clips is a place to store snippets of code for quickly inserting into documents. You can save snippets for use in all documents or just site specific clips.

Coda Clips General

You can assign tags to quickly insert clips. For example, I’ve set “htmltemp” to insert an HTML 4.01 Template when I start a new document. I would type “htmltemp” into the blank document and push Tab to insert the clip. You can also insert a selection placeholder if the cursor needs to go somewhere specific in the clip after being inserted.

Coda Clips General

6. Inline HTML Validation

Validate your HTML while you’re working. Okay, if you’re experienced with HTML you might only want to use the validation feature when you’re ready to validate, otherwise you’ll have errors popup as you’re typing which can be pretty annoying.

Coda Inline Validation

Coda will tell you what needs to be fixed. Sometimes there is a little orange “snapback” button in the balloon that will take you to the beginning of the error when clicked.

Coda Inline Validation Example

7. Use Coda’s Hints

If you aren’t quite comfortable with HTML or CSS yet you can use Coda’s Hints feature to give you a little extra guidance.

Coda Hints

8. Use Coda Books

Highlighting something and pushing Command + ‘ will search the books you have available in Coda for the highlighted text. You can also just hold Command and double click a word you want to search for.

Coda's Books

9. Setup More Coda Books

Add more books to reference more information. You can read more about adding more Coda books here.

Coda Books

10. Block Edit Text

If you need to edit multiple lines you can do a block edit to do them all at once. You can highlight the text you want to edit and push Command + Shift + B or you can hold down Option and select the lines you want to block edit that way.

Block Edit Text

11. Shift Text

Highlighting text and pushing Command + Left or Right Bracket will shift the highlighted text left or right. This is great for shifting a whole section of markup for good looking markup formatting.


12. Preview in a Browser

You can preview files in Coda’s built in Preview mode (which uses the same engine as Safari) and while in that mode you can click the Preview in Browser button in the top right to open the file in the browser of your choice.

You can also push Command + Option + B while in any mode to open and preview the file in the default browser (Safari). When you make changes to the document you can use this shortcut to refresh the preview in the browser a little faster.

Coda Browser Preview

13. Use the Preview Tools

There are three tools included with Coda’s preview mode. These can be helpful for quick development issues (although I still find myself using Firebug :-P ).

Preview Tools

The left button lets you preview the source code. Kind of strange since you’re just in the preview mode and you could just switch back to the edit mode. However, this lets you edit the source code and preview the changes without actually editing the document. A great feature for testing and debugging.

The center button is the JavaScript log and the right button is the DOM hierarchy inspector. You can quickly find and see elements with this which is helpful if you aren’t sure what’s going on.

DOM Inspector

14. Split Windows

You can split windows using the icon in the top right of the window (the plus with lines). Pushing Option will change the direction of the lines meaning the split will change from horizontal to vertical (or the opposite if changed in preferences). You can also push Command + Control + L to split the window using shortcut keys (hold option to split the other direction).

Coda Split Windows

Within each window you can independently change modes.

Coda Window Previews

15. Open Separate Files in Split Window

You can also open separate files in split windows by right clicking files in the File Browser and selecting “Open in Split” or by dragging the file into an already open split. Now you can edit two separate files in a split window.


16. Hide/Show File Browser

Coda’s file browser is great but you won’t be using it the majority of the time so you can quickly hide/show it by pushing Command + Control + B.


17. Hide/Show Code Navigator

If you need a little help jumping around a document you can pop open the code navigator.

Code Navigator

A little hidden feature with Coda and the code navigator is that you can create “bookmarks” within your code to jump around your document faster using the code navigator. For example.

<!-- !THIS IS AN HTML BOOKMARK -->

This would create a bookmark in the code navigator that looks like this.

Bookmarks

Basically the bookmark is created with markup comments that use an exclamation point before the bookmark text. You can do this for HTML, CSS, PHP, etc.


18. Use the Find Features

Instead of using the code navigator to find things, I use the find features. Pushing Command + F opens the bar to search. Then just type in what you’re looking for and push enter. Coda will scroll the document to the first matching text and highlight it. There are several more shortcut keys for searching and several options you can change if needed. Using the find feature is much faster for me than using the code navigator since my hands never have to leave the keyboard.

Find

19. Quick Close Tag Shortcut

By default Coda will automatically close a tag once you’ve opened one. However, that doesn’t always work and I still find myself needing to close HTML tags manually all the time. Pushing Command + Option + . (period) will automatically close the current HTML tag (wherever the cursor is).


20. Get Plugins

While Coda has a lot of great features, there are many features developers still want. There are a few plugins available from third party developers that you can install to give Coda extra functionality. Here is a list of third-party plugins available.


Final Thoughts

These are some great tips for using Coda but like any great web development application, there are plenty more, so take some time to explore. With some practice, you can pick up tons of keyboard shortcuts that will keep your hands on the keyboard instead of wasting time mousing around. ;-)

For video tutorials, tips, guides and other information, visit Panic’s Coda Developer Zone.

If you have some great tips, feel free to share them with us by leaving a comment below.

This article was originally posted on the ThemeForest blog late last year. We are currently porting over some of the more popular articles to Nettuts+.

Sponsored post
feedback2020-admin
14:56

April 09 2010

10:22

19 Carefully Picked Coding Editors To Choose From

Title-coding-editors-for-windows-appleGreat coding software to help in daily development process can be irreplaceable tool – bad software can lower your work efficient stage so badly, you would even don’t want to hear my experiences. For example – Dreamweaver, try to write there any code in Design view, you will get so dirty code, that you will have to spend hours until you will understand and clean it to make your page load faster.

Good software however can give you a lot of tips, ways to help code faster,find your typing mistakes without a pain. My research stopped with Aptana few years ago, which one is your pick?

1. Aptana Studio (Windows, Linux, Mac OS X) (FREE)

aptana-studio-coding-editors-for-windows

aptana-studio-1-coding-editors-for-windows

Aptana Studio is a complete web development environment that combines powerful authoring tools for HTML, CSS, and JavaScript, along with thousands of additional plugins created by the community.

Features of Aptana Studio:

  • Unified Editing for Web Apps
  • Ajax and JavaScript Libraries
  • Ruby on Rails, Python and PHP
  • Desktop Ajax
  • Free, Open Source and Cross Platform

2. SlickEdit (Windows, Linux, Mac OS X) (FREE Trial; 299$)

slick-edit-coding-editors-for-windows

slick-edit-1-coding-editors-for-windows

slick-edit-2-coding-editors-for-windows

SlickEdit is the multi-platform, multi-language code editor that gives programmers the ability to create, navigate, modify, build, and debug code faster and more accurately.

Features of SlickEdit:

  • Display symbol details with List Members, function/method argument help, and formatted Javadoc/XMLdoc/Doxygen comments
  • Analyze symbols and hierarchy with a rich set of tools including Symbols, Class, References, and Find Symbol tool windows
  • Check in and check out from version control
  • Diff files and directories
  • Preview the definition for the symbol under the cursor automatically without lifting a finger. The Preview tool window shows the definition and formatted Javadoc/XMLdoc/Doxygen comments.
  • Edit files up to 2 GB

3. jEdit (Windows, Linux, Mac OS X) (FREE)

jedit-coding-editors-for-windows

jedit-1-coding-editors-for-windows

jEdit is a mature programmer’s text editor with hundreds (counting the time developing plugins) of person-years of development behind it.

Features of jEdit:

  • Built-in macro language
  • Plugins can be downloaded and installed from within jEdit using the “plugin manager” feature.
  • Auto indent, and syntax highlighting for more than 130 languages.
  • Supports a large number of character encodings including UTF8 and Unicode.
  • Folding for selectively hiding regions of text.
  • Word wrap.
  • Highly configurable and customizable.

4. IntelliJ IDEA (Windows, Linux, Mac OS X) (FREE; €86 to €516)

intellij-idea-coding-editors-for-windows

intellij-idea-1-coding-editors-for-windows

IntelliJ IDEA is a code-centric IDE focused on developer productivity. IntelliJ IDEA deeply understands your code and gives you a set of powerful tools without imposing any particular workflow or project structure. IntelliJ IDEA is your dream pair-programmer who knows its way around the codebase, makes great suggestions right when you need them, and is always ready to help you shape your code.

Features of IntelliJ IDEA:

  • Advanced Code Editing
  • Supported Languages
  • Technologies & Frameworks
  • Teamwork Facilitation
  • Code Quality Features
  • Integrated Environment
  • Customization & Extensibility

5. Notepad++ (Windows) (FREE)

notepad-plus-plus-coding-editors-for-windows

notepad-plus-plus-1-coding-editors-for-windows

Notepad++ is a free source code editor and Notepad replacement that supports several languages. Running in the MS Windows environment, its use is governed by GPL License.

Features of Notepad++:

  • Syntax Highlighting and Syntax Folding
  • WYSIWYG
  • User Defined Syntax Highlighting
  • Auto-completion
  • Multi-Document
  • Multi-View
  • Regular Expression Search/Replace supported
  • Full Drag ‘N’ Drop supported
  • Dynamic position of Views
  • File Status Auto-detection
  • Zoom in and zoom out
  • Multi-Language environment supported
  • Bookmark
  • Brace and Indent guideline Highlighting
  • Macro recording and playback

6. SCREEM (Linux) (FREE)

screem-coding-editors-for-windows

screem-1-coding-editors-for-windows

SCREEM is a web development environment. It’s purpose is to increase productivity when constructing a site, by providing quick access to commonly used features. While it is written for use with the GNOME desktop environment in mind it does not specifically require you to be running it, just have the libraries installed.

Features of SCREEM:

  • Broken Link Checking
  • CTags Support
  • Cut / Paste
  • CVS Support
  • Document Structure Display
  • DTD/Doctype Parsing
  • Helper Applications
  • Inline Tagging
  • Intelliclose
  • Link Fixing
  • Page Previewing
  • Page Templates
  • Publishing
  • Recent documents / Projects
  • Search / Replace
  • Select Context
  • Spell Checking
  • Syntax Highlighting
  • Tag Trees
  • Task management
  • Wizards

    7. EmEditor (Windows) (FREE Trial; €32.15)

    emeditor-coding-editors-for-windows

    emeditor-1-coding-editors-for-windows

    EmEditor is a lightweight, but extensible, commercial text editor for Microsoft Windows. Although designed for Windows XP, the program is also certified for use with Windows Vista. Available editions of the program include the 32-bit edition and the 64-bit edition, and the program also includes a portability option to set up a removable drive, such as a USB drive, through an Import and Export Wizard. Feature-wise, the program includes unicode and large file support, a tabbed window design, and is extensible via plugins and scripts (macros), many of which have been written by the users.

    Features of EmEditor:

    • New Snippets Plug-in
    • Brackets/Quotation Mark Auto-Complete
    • Narrowing
    • CSV, TSV and DSV
    • Full Screen View
    • Clipboard History
    • Wildcard Support
    • Workspace Including Undo Information
    • New External Tools
    • Pin to List
    • Save in Protected Folder
    • Supports Windows 7 Jump List
    • New Buttons on Toolbar

    8. Programmer’s Notepad (Windows) (FREE)

    programmers-notepad-coding-editors-for-windows

    programmers-notepad-1-coding-editors-for-windows

    Programmer’s Notepad is an open-source text editor targeted at users who work with source code.

    Features of Programmer’s Notepad:

    • Bookmarks (both numbered and plain)
    • Code Folding/Outlining
    • Docking tool windows
    • Excellent external tool support with user-configurable output matching
    • Export to HTML (using CSS) and RTF
    • File association manager
    • In-file method/definition navigation (using Ctags)
    • No limit on file size (although large files may take a while to load)
    • Non fixed-width font support
    • Projects and Project Groups with multi-level folders and file system mirroring
    • Quick Search toolbar with links to Google and Google Groups
    • Regular expression search and replace
    • Support for unicode files
    • Support for windows, unix and macintosh file formats
    • Syntax highlighting for many languages through “schemes”.
    • Tabbed MDI interface
    • Text Clips
    • Unlimited number of schemes supported, powerful syntax highlighting supporting both user-defined and built-in schemes
    • User-defined schemes (XML)
    • Word-wrapping

    9. PSPad (Windows) (FREE)

    pspad-coding-editors-for-windows

    pspad-1-coding-editors-for-windows

    PSPad editor is a freeware text editor and source editor intended for use by programmers.

    Features of PSPad:

    The universal freeware editor, useful for people who:

    • Work with plain text
    • Create web pages
    • Want to use a good IDE for their compiler

    10. HTML-Kit (Windows) (FREE)

    html-kit-coding-editors-for-windows

    html-kit-1-coding-editors-for-windows

    HTML-Kit is an HTML editor for Microsoft Windows. The application is a full-featured HTML editor designed to edit, format, validate, preview and publish web pages in HTML, XHTML and XML -languages.

    Features of HTML-Kit:

    • Navigate tags and scripts
    • Code Folding
    • Batch Search and Replace
    • Upload Options
    • Incremental Search and Go-To
    • File Versioning and Auto Backup
    • HTML-Kit Shorthand
    • Not Lost in Translation
    • Remote Editing with Local Copy
    • Dockable Plugins
    • Paste Plus
    • Native Unicode Support
    • Multi-Page Templates
    • Re-order Document Tabs

    11. EditPlus (Windows) (FREE Trial; $35)

    edit-plus-coding-editors-for-windows

    edit-plus-1-coding-editors-for-windows

    EditPlus is a text editor, HTML editor, PHP editor and Java editor for Windows. While it can serve as a good Notepad replacement, it also offers many powerful features for Web page authors and programmers.

    Features of EditPlus:

    • Multiple document interface
    • Overlappable windows
    • Tabbed document interface
    • Window splitting
    • Spell checking
    • Regex-based find & replace
    • Encoding conversion
    • Newline conversion
    • Syntax highlighting
    • Multiple undo/redo
    • Rectangular block selection
    • Bracket matching
    • Auto indentation
    • Auto completion
    • Code folding (Text folding)
    • Compiler integration

    12. Crimson Editor (Windows) (FREE)

    crimson-editor-coding-editors-for-windows

    crimson-editor-1-coding-editors-for-windows

    Crimson Editor is a professional source code editor for Windows. This program is not only fast in loading time, but also small in size (so small that it can be copied in one floppy disk).

    Features of Crimson Editor:

    • Edit multiple documents
    • Syntax highlighting
    • Multi-level undo / redo
    • Project management
    • Directory tree view window
    • Find & Replace
    • Column mode editing
    • Natural word wrapping
    • Spell checker
    • User tools and macros
    • Edit remote files directly using built-in FTP client
    • Print & Print preview

    13. Coda (Mac OS X) (99$)

    coda-coding-editors-for-windows

    coda-1-coding-editors-for-windows

    Coda is a $99 commercial web development application for Mac OS X, developed by Panic.

    Features of Coda:

    • Plug-ins
    • Open quickly
    • Smart Spelling
    • Subversion
    • Find across files

    14. BBEdit (Mac OS X) (FREE Trial; From $49 to $125)

    bbedit-coding-editors-for-windows

    bbedit-1-coding-editors-for-windows

    Whenever you need to work with text, whether you want to create or maintain a Web site, write a program or shell script, search log files and extract data, or write a few paragraphs (or pages, or books), BBEdit offers what you need to make accomplishing your task quicker and easier. BBEdit 9 adds over one hundred new features and over one hundred improvements over the previous version.

    Features of BBEdit:

    • Text Handling
    • Web Development
    • Programming
    • File Handling
    • Display
    • Search
    • UNIX & Admin

    15. TextMate (Mac OS X) (FREE Trial; €48.75)

    text-mate-coding-editors-for-windows

    text-mate-1-coding-editors-for-windows

    TextMate brings Apple’s approach to operating systems into the world of text editors. By bridging UNIX underpinnings and GUI, TextMate cherry-picks the best of both worlds to the benefit of expert scripters and novice users alike.

    Features of TextMate:

    • Ability to Search and Replace in a Project
    • Auto-Indent for Common Actions Like Pasting Text
    • Auto-Pairing of Brackets and Other Characters
    • Clipboard History
    • Column Selections and Column Typing
    • Completion of Words from Current Document
    • CSS-like Selectors to Pinpoint the Scope of Actions and Settings
    • Declarative Language Grammars for Graceful Mixing and Hacking
    • Dynamic Outline for Working With Multiple Files
    • Expand Trigger Words to Code Blocks With Tab-able Placeholders
    • File Tabs when Working With Projects
    • Foldable Code Blocks
    • Function Pop-up for Quick Overview and Navigation
    • Plug-able Through Your Favorite Scripting Language
    • Recordable Macros With No Programming Required
    • Regular Expression Search and Replace (grep)
    • Run Shell Commands from Within a Document
    • Support for Darcs, Perforce, SVK, and Subversion
    • Support for More Than 50 Languages
    • Switch Between Files in Projects With a Minimum of Key Strokes
    • Themable Syntax Highlight Colors
    • Visual Bookmarks to Jump Between Places in a File
    • Works As External Editor for (s)ftp Programs
    • Works Together With Xcode and Can Build Xcode Projects

    16. SubEthaEdit (Mac OS X) (FREE Trial; €29)

    subethaedit-coding-editors-for-windows

    subethaedit-1-coding-editors-for-windows

    SubEthaEdit is a powerful and lean text editor. And it’s the only collaborative one that is a joy to use. By combining the ease of Bonjour with the world’s best text collaboration engine, it makes working together not only possible but even fun…

    Features of SubEthaEdit:

    SubEthaEdit includes various advanced features: A UNIX command line utility to enable complex and interactive pipe workflows with your terminal. Overhauled printing, including all bells and whistles, even with collaborative metadata. Exporting to HTML, again with metadata. Completely user customizable syntax highlighting through styles. Support for editing files as administrator. Improved AppleScript support to allow control of sharing features.

    17. CSSEdit (Mac OS X) (FREE Trial; $39.95)

    css-edit-coding-editors-for-windows

    css-edit-1-coding-editors-for-windows

    Design beautiful, innovative and fast-loading web sites… with a beautiful, innovative and fast app. CSSEdit’s intuitive approach to style sheets and powerful previewing features will make you deliver awesome standards-based sites in no time!

    Features of CSSEdit:

    With CSSEdit, you see changes to your style sheet applied in real-time. Without saving. Without uploading. Without hassle. For any Web App or HTML file. You can edit style sheets for absolutely any site, on- or offline. Thanks to our innovative Override technology, you can even apply your open style sheets to any site and see it change instantly! Styling a Web App used to be a cycle of type — upload — refresh. CSSEdit destroys this waste of time. Making your Web 2.0 App beautiful is now easy and productive.

    18. Taco HTML Edit (Mac OS X) (FREE Trial; $24.95)

    taco-html-edit-coding-editors-for-windows

    taco-html-edit-1-coding-editors-for-windows

    Taco HTML Edit is the premier HTML editor and PHP editor for the Mac. As an HTML editor, Taco HTML Edit empowers its users to rapidly create their own web sites. It is designed exclusively for Mac OS X and has many advanced features including spell checking, live browser previewing, PHP previewing, syntax checking, and much more.

    Features of Taco HTML Edit:

    • Component Library
    • Code Coloring
    • Preview
    • Code Completion
    • Syntax Checking
    • Live Preview
    • Code Clips

    19. skEdit (Mac OS X) (FREE Trial; $34.95)

    sk-edit-coding-editors-for-windows

    sk-edit-1-coding-editors-for-windows

    skEdit is a text editor for Mac OS X, aimed at web designers and programmers.

    Features of skEdit:

    • Tabbed interface
    • Project based site management
    • Code hinting and completion
    • Code folding
    • Code snippets
    • Syntax highlighting
    • File uploading and remote editing (using FTP, SFTP or WebDAV)
    • HTML Tidy integration
    • Search and replace with support for regular expressions

      Which software for coding is your favorite? If you haven’t got one, now you certainly have some promising programs to choose from!

      January 10 2010

      14:22

      Who Else Wants Great Windows Desktop Blogging Client?

      title-desktop-blogging-editor-clientIf you are blogger and since now it’s like trend – everybody is blogging, you should know, writing through WordPress Rich Text Editor isn’t that fastest and easiest way. Most importantly you must think about ways how to automate and fasten your work process. Choosing desktop blogging client is one of the most important aspects in my opinion – forget about standard Wordpress editor and start using something a lot more faster and handier.

      This article is created to explain everything about desktop blogging editors, main features, why and how you should use one. I will also share my own experiences, I’ve been blogging daily and I’ve tested a lot of tools, automating programs and blogging clients and I think I can objectively evaluate features.

      I’ve been blogging for 1.5 years now and when I switched to desktop blogging editor, I never went back. There are several great, free editors, Firefox plugins allowing you to write articles more easier. When I started I used Wordpress admin panel, I wrote everything in plain code writing all tags and urls myself – it wasn’t fast so I needed to figure something out.

      Then I found Windows Live Writer and it seemed to be solution, but I got upload problems. There was several times when I uploaded images through Live Writer, but in the middle (let’s say 54/100 images) something went wrong with image, I needed to fix error, upload images from beginning and my server from those requests several times crashed. Also back then I didn’t know how to set different settings, so images wouldn’t have that drop shadow, resize image settings (it created one unnecessary thumb image for me). If you haven’t got huge posts with a lot of images Windows Live Writer is perfect solution, but I needed something different.

      I figured out I need to upload images to server manually to reduce it’s overload. I used find/replace features to change image local address to direct online link. If you want to know how I do that, this blog post could help you – The Best And Fastest Way To Create Blog Post. I wrote there my experiences and my approach to write and manually create article. In that way I get very clean code using Blogdesk.

      With Windows XP Blogdesk was perfect solution, but somehow with Windows Vista and Windows 7 it doesn’t work very good. I got mystic saving problems myself and I don’t really know what to suggest for my new guest authors. And yes,main reason I decided to write this article doing serious research in available desktop blogging editors is because I wanted to find new editor which could suit for me as well!

      Let’s give it a try – shall we?

      So.. What the heck is desktop blogging editors? Why You should use one?

      As I mentioned above, when I started to blog I wrote my posts in WordPress Rich Text Editor, where you can get code/design view, upload images – at first it seems like a good way to go, but image uploading you need to do manually one by one and it takes a lot of time. And what you will do if you internet browser crashes in the middle of article and you forgot to save it? How you will write your post if you have no Internet connection?

      Okay, then you could write your posts in word processors like Microsoft Word, Textpad and then just paste finished text into Wordpress post section. But again we have problems with formatting and image uploading. However this simple approach will work just fine for short textual posts with few images and almost no formatting, but I am talking more about serious blogging and approach.

      Desktop blogging tools and editors are independent texting WYSIWYG software you can connect with you blog and essentially it is very simple text/code editor created specifically for easier and automated blogging. Now you can format, write text, add images, effects in design view and if you need to edit some code manually or check how it looks – just switch to code view! And the best thing is, you don’t need Internet connection to write your posts, only when you want to publish it. Your posts are always in safety in blogging editor, accessable in any time!

      Everybody loves lists, so I created one with main benefits why you should use desktop blogging editor:

      1. Write Articles Offline – For example if you own laptop and travel, you don’t always have Internet connection. No problem! Write your post in blogging editor and you can publish it once you’ll get Internet connection just by hitting publish button. No more copy/paste and images will be uploaded automatically as well.
      2. Spell Checking – This is basic, but good blogging editor has this feature and after writing your post, just run spell checking and rapidly correct all mistakes you’ve accidentaly made.
      3. Multiple blogs – If you write for your own blog and you are guest writer on another, it is really painful to publish it and switch to another blog. With blogging client, you can change blog to publish with few clicks and without any worries.
      4. Quick and easy editing – Switch from design to code section to easily change some code, fix small errors.
      5. Automated Image Uploading – Usually blogging clients are connected directly with your blog and when you hit publish button, all images are uploaded from your computer to local server automatically. If you haven’t got many pictures, it’s great solution.
      6. Easy Post Management – Rapidly fast browse through your previous drafts, published articles, edit them, save – in Wordpress panel it would be many times slower process.
      7. Browser Crash – Sometimes browser just crash and you loose some time and work, with blogging client it is almost impossible. Usually clients have enabled autosave each 3-4minutes, in that way preventing any work loss.
      8. Feature Integration – Many clients support Flickr, Delicious, Youtube for automated image linking, video adding and more features.

      Free Desktop Blogging Editors For Windows

      From free desktop blogging editors I would recommend Windows Live writer, Blogdesk or w.bloggar. Every client offers different features, you should check out them all and then pick your favorite one, which suits you the best.

      Windows Live Writer

      Writer makes it easy to share your photos and videos on almost any blog service—Windows Live, Wordpress, Blogger, LiveJournal, TypePad, and many more.

      It has many features, I will mention most important ones:

      • Crop and tilt photos
      • Insert multiple photos
      • Additional spell checking languages
      • Insert and publish video to YouTube
      • Word count
      • Twitter, Digg and Flickr Plug-ins
      • Type-down filtering in the Open dialog

      Check out Windows Live Writer Tweaks, Tips and Updates article from Lifehacker for deeper research.

      windows-live-writer-desktop-blogging-editor-client

      Blogdesk

      Blogging should be simple, but it gets complicated and time-consuming if you are serious about it. BlogDesk makes it easy to write, speeds up lavish processes and assists the author with smart features.

      Feature list:

      • WYSIWYG editor
      • ImageWizard to easy insert images, create thumbnails
      • Reduced view – switch to cleaner view with less distractions
      • BlogWizards – easily configure blog
      • Spell checker
      • Tags-Generator
      • Frequently Used Phrases – time-saver for often used phrases

      blogdesk-desktop-blogging-editor-client

      Post2Blog

      Post2Blog 3 is a FREEWARE handy blog editor with live spell-checking support for pro-bloggers.

      Feature list:

      • WYSIWYG editor with complete hot-keys support;
      • Built-in “Live” spellchecking;
      • Images are uploaded automatically;
      • Compose new posts in MS Word and post them to your blog using Post2Blog toolbar for MS Word;
      • Add Technorati, Del.icio.us, Buzzwords, 43 Things tags to your posts;
      • Automatically send trackbacks, ping web-services to notify about updates in your blogs;
      • Use built-in smiles for use in your blog;

      post2blog-desktop-blogging-editor-client

      Thingamablog

      Thingamablog is a cross-platform, standalone blogging application that makes authoring and publishing your weblogs almost effortless. Unlike most blogging solutions, Thingamablog does NOT require a third-party blogging host, a cgi/php enabled web host, or a MySQL database. In fact, all you need to setup, and manage, a blog with Thingamablog is FTP, SFTP, or network access to a web server.

      Feature list:

      • Maintain multiple blogs
      • Read news with an integrated feed reader
      • Publish remotely to your blog via email
      • Set up flexible archiving options
      • Define your own custom template tags
      • Set up flexible archiving options

      thingablog-desktop-blogging-editor-client

      w.bloggar

      The w.bloggar is an application that acts as an interface between the user and one or more blog(s); in other words, it is a Post and Template editor, with several features and resources that the browser based blog editors do not offer.

      Feature list:

      • Import Text files
      • Colorized HTML code
      • Multiple accounts and blogs
      • Spell Checking
      • Multiple accounts and blogs
      • Toolbar Icons Skin
      • File and Image Upload
      • Supports Windows XP

      wbloggar-desktop-blogging-editor-client

      Zoundry Raven

      The Zoundry Blog Writer™ is a rich WYSIWYG blogging editor that’s as easy to use as a word processor. With just a few clicks of a mouse instead of complex HTML coding, you can do things like drag and drop images, create block quotes, and format links to open in a new window.

      Feature list:

      • Tabbed true WYSIWYG Editing
      • Improved content management
      • Manage multiple media storage services
      • Manage multiple blogs offline
      • Raven2Go: Portable Application support
      • WordPress 2.2+ Page & Tag support

      Read more about Zoundry features here.

      zoundry-raven-desktop-blogging-editor-client

      Qumana (PC&Mac)

      You don’t need to know a thing about HTML code to make perfect posts. Write your posts at your own pace without having to be online.

      Qumana is an easy-to-use desktop blog editor, enabling you to write, edit and post to one or more blogs. You can use Qumana even when you are offline. Save your blog posts to your hard drive and upload whenever you like. Great for bloggers on the move.

      Qumana features:

      • WYSIWYG editor, as easy as email
      • Clean interface with easy-to-understand buttons
      • Spell check with ‘as you type’ option
      • Technorati tagging
      • Source view option to edit HTML
      • Save posts as drafts, or edit old posts, from the Blog Manager
      • Easy image uploads and image alignment
      • DropPad – gather links, text, and pictures by dragging them to a desktop pad
      • Offline editing
      • Multi-window editing
      • Seamless posting and cross-posting
      • Trackback & pinging

      qumana-desktop-blogging-editor-client

      Commercial Desktop Blogging Editors For Windows


      Blogjet

      (Top 1 Commercial Pick)

      A popular Windows blog client for your WordPress, TypePad, Blogger, Drupal, etc. blogs. Get convenience and speed of a native application, and the ability to write posts offline. BlogJet comes with English (US) and English (UK) dictionaries.

      If you cannot decide, check out their huge feature list and video demo here. All recommendations and demos made this blogging client my top 1 choice. It’s not free, but at least I get many features, good support and regular updates. Such blog client is one of the most important tools in article creation, so I think 39.95$ is very good investment at least for me.

      Several features:

      • WYSIWYG Editor
      • Post Management and Searching
      • Word Counter and Blog Statistics
      • 20 High-Quality Smileys
      • Spell Checker
      • Flickr and YouTube Support
      • Auto Replace
      • Modern Interface

      Price: $39.95

      blogjet-desktop-blogging-editor-client

      RocketPost

      RocketPost is smart blog software for power bloggers. It’s the only one with WYSIWYG editing, full local editing and full blog import. And it works just like email, so you already know how to use it.

      Speed up your blogging with one-click Technorati, Flickr and Del.icio.us tags, built-in photo editing, instant photo albums, automatic linking to related posts, quote tracking, quick linking, drop caps, pull quotes and a running word count.

      Not free software, but filled with many features, you might use daily to automate your article writing process greatly. Certainly a good pick as well.

      Several features (read more):

      • WYSIWYG editing
      • Full local editing – See and edit all your posts in one place without having to download them every time
      • Full blog import – Download all your existing posts and get started in less than 5 minutes
      • Picture editing – Crop, resize and compress pictures right within your post
      • Check spelling while you type
      • Multiple-word AutoCorrect

      Price: 29$

      rocketpost-desktop-blogging-editor-client

      Other Solutions

      ScribeFire Blog Editor For Firefox

      ScribeFire is a full-featured blog editor that integrates with your browser and lets you easily post to your blog.

      scibefire-desktop-blogging-editor-client

      What’s your favorite desktop blogging client? And why?

      Related posts:

      1. The Best And Fastest Way To Create Blog Post
      2. 110+ Massive Wordpress Video Tutorial Collection
      3. 1st Year Of Blogging: Success And Achievements
      4. 50 Great Sites To Download Free Cool Wallpapers
      5. 33 Wordpress Plugins To Power Up Your Comment Section

      Older posts are this way If this message doesn't go away, click anywhere on the page to continue loading posts.
      Could not load more posts
      Maybe Soup is currently being updated? I'll try again automatically in a few seconds...
      Just a second, loading more posts...
      You've reached the end.
      (PRO)
      No Soup for you

      Don't be the product, buy the product!

      close
      YES, I want to SOUP ●UP for ...