Archive

Posts Tagged ‘Wordpress’

WordPress active plugins

April 17th, 2010 No comments

List of WordPress plugins used in this site:

Dean’s FCKEditor for WordPress

added to
/wp-content/plugins/fckeditor-for-wordpress-plugin/ckeditor/config.js

[cc lang="javascript"]/*
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/

CKEDITOR.editorConfig = function( config )
{
	// Define changes to default configuration here. For example:
	// config.language = 'fr';
	// config.uiColor = '#AADC6E';
	config.enterMode = CKEDITOR.ENTER_BR;
	config.shiftEnterMode = CKEDITOR.ENTER_P;
	// To disable processing HTML entities,
	config.entities = false;
	// To disable processing single quote '
	config.entities_additional = '';
	// List of regular expressions to be executed over the input HTML, indicating code that must stay untouched. 
	config.stylesCombo_stylesSet = 'spike_style_set';
};

CKEDITOR.addStylesSet( 'spike_style_set',
[
    // BLOCK STYLES
    // address, div, h1, h2, h3, h4, h5, h6, p and pre.
    // These styles are already available in the "Format" combo, so they are
    // not needed here by default. You may enable them to avoid placing the
    // "Format" combo in the toolbar, maintaining the same features.
 
   { name : 'Preformatted Text', element : 'pre' },
   { name : 'Paragraph'      , element : 'p',
      attributes:
      {
         'line-height' :   '16px',
         'margin-bottom' :   '8px',
         'text-align' :      'justify',
         'font-size' :      '100%'
      }
   },
   { name : 'Heading 1'      , element : 'h1',
      attributes:
      {
         'font-family' :   'Georgia, "Times New Roman", Times, serif',
         'font-size' :      '240%',
         'color' :         '#738028',
         'margin' :         '5px 0px 10px 0px'
      }
   },
   { name : 'Heading 2'      , element : 'h2',
      attributes:
      {
         'font-family' :   'Georgia, "Times New Roman", Times, serif',
         'font-size' :      '180%',
         'color' :         '#738028'
      }
   },
   { name : 'Heading 3'      , element : 'h3',
      attributes:
      {
         'font-family' :   'Georgia, "Times New Roman", Times, serif',
         'font-size' :      '140%',
         'color' :         '#738028'
      }
   },
   { name : 'Heading 4'      , element : 'h4' },
   { name : 'Heading 5'      , element : 'h5' },
   { name : 'Heading 6'      , element : 'h6' },
   { name : 'Address'        , element : 'address' },

   { name : 'Blue Title'     , element : 'h3', styles : { 'color' : 'Blue' } },
   { name : 'Red Title'      , element : 'h3', styles : { 'color' : 'Red' } },

   // OBJECT STYLES
   // a, embed, hr, img, li, object, ol, table, td, tr and ul.

   // INLINE STYLES
   // These are core styles available as toolbar buttons. You may opt enabling
   // some of them in the Styles combo, removing them from the toolbar.

   { name : 'Strong'         , element : 'strong', overrides : 'b' },
   { name : 'Emphasis'         , element : 'em'   , overrides : 'i' },
   { name : 'Underline'      , element : 'u' },
   { name : 'Strikethrough'   , element : 'strike' },
   { name : 'Subscript'      , element : 'sub' },
   { name : 'Superscript'      , element : 'sup' },

   { name : 'Marker: Yellow'   , element : 'span', styles : { 'background-color' : 'Yellow' } },
   { name : 'Marker: Green'   , element : 'span', styles : { 'background-color' : 'Lime' } },

   { name : 'Big'            , element : 'big' },
   { name : 'Small'         , element : 'small' },
   { name : 'Typewriter'      , element : 'tt' },

   { name : 'Computer Code'   , element : 'code' },
   { name : 'Keyboard Phrase'   , element : 'kbd' },
   { name : 'Sample Text'      , element : 'samp' },
   { name : 'Variable'         , element : 'var' },

   { name : 'Deleted Text'      , element : 'del' },
   { name : 'Inserted Text'   , element : 'ins' },

   { name : 'Cited Work'      , element : 'cite' },
   { name : 'Inline Quotation'   , element : 'q' },

   { name : 'Language: RTL'   , element : 'span', attributes : { 'dir' : 'rtl' } },
   { name : 'Language: LTR'   , element : 'span', attributes : { 'dir' : 'ltr' } },
]);[/cc]

The definition the Style types, usable in CKEditor, are described here: http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Styles

Coding problems

Using a Visual Editor you will encount problems formatting your programming codes.
Ad described here http://codex.wordpress.org/Writing_Code_in_Your_Posts we have to use the pre tag. Thanks to the config.js posted above we can select the interested code and then select the style name “Preformatted Text”. Remember to isolate the code in p tag, just pressing SHIFT+ENTER before pasting the code (it works always due to the config posted above).

The pre tag i styled in the theme’s css:

pre {
    background-color:#F4F5F7;
    border:1px dashed #CCC;
    padding:8px;
    margin:5px 0;
}

We are forced to use a p block because the styles work only on them; at the moment there isn’t the intention to develop with br for example as described here http://cksource.com/forums/viewtopic.php?f=11&t=16415

Only for short snippets

The problem with this system is the width of the body where the code will be shown: in this way no horizontal bar will be shown and this make it usable only for short snippets.
If you need to show large snippet, as the config.js posted above, then use CodeColorer plugin.

2011/02/04 – Custom smileys

Edited /wp-content/plugins/fckeditor-for-wordpress-plugin/ckeditor/config.js and under the function

[cce_javascript]CKEDITOR.editorConfig = function( config )[/cce]

added

[cce_javascript]config.smiley_images = ['happy.gif'][/cce]

If you don’t define any smileys path, then the path will be the default, i.e. /wp-content/plugins/fckeditor-for-wordpress-plugin/ckeditor/plugins/smiley/images

 

Preserve Code Formatting

If you want to use a more advenced coding plugin, you can install CodeColorer from Dmytro Shtefly.

 

CodeColorer

If you want to use a more advenced coding plugin, you can install CodeColorer from Dmytro Shtefly.
Remember to disable the plugin Preserve code formatting and comment the pre block in the css.
Then edit again the file
/wp-content/plugins/fckeditor-for-wordpress-plugin/ckeditor/config.js
and after

[cc lang="javascript"] config.stylesCombo_stylesSet = 'spike_style_set';[/cc]

add

[cc lang="javascript"]    config.entities_additional = '';[/cc]

otherwise the single quotes ‘ won’t be shown correctly (they remain ')
These are the plugin settings:

[cce_text]Lines to scroll:        -1
Width:                598 (to fit iNove theme)
Height:                -1
Width in RSS:            435
Tab size:            4
Theme:                Slush & Poppies
Inline Theme:            Slush & Poppies
Show line numbers:        (yes)
Disable keyword linking:    (yes)[/cce]

I also needed to edit a custom css snippet to make CodeColorer compatible with iNove theme and to remove line spacing, so people can copy/paste without line breakings

[cce_css]/* Mod by Spike: to make it compatible with iNove theme */

.post .content .codecolorer-container table {
  border: 0px;
  margin:0px;
}
.post .content .codecolorer-container th,
.post .content .codecolorer-container td {
  border: 0px;
  padding:0;
}
.codecolorer-container table td.line-numbers {
  padding: 5px;
  text-align: right;
}
.codecolorer-container table td.line-numbers div {
  width: 23px;
}
.post .content  .codecolorer-container table td.line-numbers {
  color: #888888;
  background-color: #EEEEEE;
  border-right: 1px solid #9F9F9F;
}
.post .content .codecolorer-container table td.line-numbers {
  padding: 5px;
  text-align: right;
}
.post .content .codecolorer-container table td.line-numbers div {
  width: 23px;
}


/* Mod by Spike: to remove line spacing */

.codecolorer, .codecolorer *, .codecolorer-container, .codecolorer-container * { font: 13px/1.0em Monaco, Lucida Console, monospace }

/* End mod by Spike */[/cce]

 

WP-reCaptcha

To user reCAPTCHA in User registration e to post a comment. Activated also the Mailhide function.

 

WP-Cumulus

Flash based Tag Cloud for WordPress

 

Akismet

Potect your blog from comment and track-back spam

 

PJW Mime Config

Add extra mime-types to use with the inline uploader