EasyCode

Description

A great tool for tech blog. Insert source code in posts and comments.

With the help of the plugin, you can share code snippets a better way, through a friendlier and more convenient interface.

EasyCode provides a convenient way insert code to your posts, pages and comments. Your code will be displayed friendly to readers and combined with useful functions and colorful appearance.

If you like this plugin, please put it 5 stars. If there is any trouble or advise, please leave your feedback.

Features

Use easily

  • Insert code by just one click. A button is integrated into the toolbar of WordPress editor. Just click it and stuff code.
  • Code snippets inserted by EasyCode are marked obviously in admin pages.
  • It requires no extra configuration for starting.

Rich appearance options

  • Easycode has a concise and modern interface which suits your blog’s design anytime.
  • Various color schemes are provided, including classical dark styles and light styles. There is always one which matches your blog.
  • All of them against your taste? Just set out to design your own color schemes easily.
  • After finishing designing your own color schemes, the highlight colors of each language will change, so there is no need to adjust one by one.
  • Display code snippets in selected font. (Online fonts are supported now.)
  • The font size of code blocks can be set to be a percentage, based on overall font size of posts.

Practical functions

  • Collaspe code blocks to receive concise view experience.
  • Show titles on the top of code blocks.
  • Now, EasyCode can work as a highlighter. Various languages are supported.
  • Use code editor to view, copy or modify code shared by double-click. Two modes are available – showing a floated layer in the current window, or showing the editor in another window.

Code highlight
* Now, Easycode use more professional highlight engines – SyntaxHighlighter and
GeSHi. You can freely switch between the two engines and the appearance of code blocks will keep consistent at the same time.

Lightweight
* The whole program has a small-size core and the latest version has a better compatibility with various themes.

How to use

Insert code in your posts and pages

  1. Click “Insert Code” button.
  2. Choose a language. (If you keep the default value “None”, the code will not be highlighted)
  3. Input a title if you want.
  4. Paste your code into text area, then click “OK” button.
  5. Set other options. (New! Collasped option for each snippet)
  6. Code snippets inserted by EasyCode are marked obviously.

Add code in comments

It requires administrators to enable “Handle code in comments” option.

  1. Click “Add Code” button over the comment text area.
  2. Select a language, input a title and click “Insert”. (Please refer to last task)
  3. Paste your code to replace content wrapped in “<pre>”.
  4. If code contains “<pre>”, escape it to HTML entities, that’s replace “<” to “&lt;” and “>” to “&gt;”.

Design your own color schemes

If you are familiar with rgb colors, you can choose your own colors.

  1. Go to EasyCode setting page and click “Appearance” tab.
  2. Click “Use custom color schemes”.
  3. Choose your colors. (What’s “Default highlight colors”? Refer to FAQ!)
  4. Click “Save Changes” then go to your blog to enjoy your design!

Screenshots

  • Insert code in posts.
  • Code snippets in your posts.
  • Insert code in comments
  • Various color schemes.
  • Double click to edit code.
  • Editor in a new window.
  • Modern interface

Installation

  1. Download the zipped pack of easycode.
  2. Upload the easycode directory in the zip file to the /wp-content/plugins/ directory.
  3. Activate the plugin through the “Plugins” menu in WordPress

It’s also able to install by searching wordpress plugin library in “Plugins”.

FAQ

Can the plugin process comments?

Of course! Once the plugin is activated, it will add “Insert Code” button before the comment text area. It can also handle code in comments just like in posts.
If you don’t want to enable this button, please adjust in admin.

Where is the option page?

It is in Option menu.

Can I separately set collasped options for every snippet?

Yes. The relative functions have been added in version 1.5.1 .
First, each of code blocks can be separately set showed/collapsed by default in inserting-code dialog.
Besides, you can set the option to showed code blocks with less than a certain number of lines.

Can I use my own color scheme which suits my blog themes?

In “Appearance” tag of the option page, you can select the color schemes offered by EasyCode. If you are familiar with the computer color, you can also choose your own colors.
All the CSS files for color schemes are located in /boxstyles. So you can create your own CSS files by modeling. They also appear in setting page.

What’s “Default highlight colors”?

By adjusting “Default highlight colors”, you can change highlight colors of different languages at the same time. Every language has been linked to several colors.
Still want to set independent colors one language after another? All right, I have to say sorry.

Reviews

Very Nice

It is a very nice plugin, the highlighting and the expand/collapse works well.

Read all 2 reviews

Contributors & Developers

“EasyCode” is open source software. The following people have contributed to this plugin.

Translate “EasyCode” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.5.2

  • Fixed PHP error for version under 5.5
  • Improved performance

1.5.1

  • Some new fonts have been addded.
  • Adjust the font size of code blocks.
  • Fixed bug: abnormal appearance in Gray box-style.
  • Fixed bug: inserting-code dialog for the comment form can’t hide on Safari for iOS.
  • Automatically show short code snippets.
  • Code blocks can be separately set showed/collapsed by default when inserted.
  • Improved program logic for fetching plugin options.

1.5.0

  • Added support for online fonts.
  • More fonts specifically designed for code-reading.
  • Imported extral professional third-part highlight libraries, that is GeSHi and SyntaxHighlighter.
  • More than 40 languages supported.
  • Fixed bugs of some color schemes.
  • Improved performance.

1.4.2

  • Improved font options. (Better compatibility and accordance in different platforms and OS)
  • Sliding animation when toggling hiding or showing code.
  • Some tuned details of animations.
  • Added option: Choose how and where to place insert-code button in post editor.
  • Deprecated function: Short-tag [code] and HTML tag <code> have been deprecated, only HTML tag <pre> is still available.
  • Fixed issue: No reaction for clicking title bar to show/hide code the first time.
  • Fixed issue: Errors are thrown when abnormal or uncompleted option data is offered.

1.4.1

  • Support to choose different fonts applied to code snippets.
  • Optimized code display in admin pages and RSS feeds.
  • Support Responsive Web Design – Better effects in phones and printers.
  • Appearance: shadows and border-radius.
  • Higher compatibility with various themes.
  • Fixed auto-wrap problem.
  • Optimized file structure and clear code structure.
  • Improved performance.

1.4

  • Add code highlighter for 4 languages.
  • The code editor can open in a new window.
  • New color schemes.

1.3.1

  • Repair the problem that code boxes shown incorrectly in some themes.

1.3

  • More beautiful interface.
  • Give you more freedom in terms of colors
  • The version adds buttons for the visual editor.

1.2

  • Solve some problems in editing mode
  • modify some code
  • change the method of analyzing code inserted.
  • more appearance options.

1.1

  • Editing mode.

1.0

  • The first version