Archive

Posts Tagged ‘WordPress’

WordPress – 301 location to sub page

August 10th, 2010

WordPress is great for blogging but still has a way to go to be a CMS. One thing I find odd is that you can create Categories for Posts but not for Pages. Usually a client will want pages categorized for navigation. So this becomes a problem. Sure you can nest Pages (parents and children) but that means you must have content in every menu item.

After a quick google search I came across some code that allows WP’s Pages to have empty menu items for categorization. Or at least that’s the visual effect. The fix is to create a Template in your theme with some PHP code. It redirects the browser to the first Child Page:

<?php
/*
Template Name: Redirect To First Child
*/
if (have_posts()) {
  while (have_posts()) {
  the_post();
  $pagekids = get_pages("child_of=".$post->ID."&sort_column=menu_order");
  $firstchild = $pagekids[0];
  wp_redirect(get_permalink($firstchild->ID));
 }
}
?>

This works but I’m not too fond of it. It uses a refresh. I tweaked it a bit. Changed the wp_redirect to a Location header and added a 301 status code:

<?php
/*
Template Name: 301 Redirect To First Child
*/
if (have_posts()) {
 while (have_posts()) {
  the_post();
  $pagekids = get_pages("child_of=".$post->ID."&sort_column=menu_order");
  $firstchild = $pagekids[0];
  header("HTTP/1.1 301 Moved Permanently");
  header("Location: ".get_permalink($firstchild->ID));
  exit();
 }
}
?>

This is much faster on the front end. It also tells search engines not to index those blank categorization pages.

<?php/*Template Name: 301 Redirect To First Child*/if (have_posts()) {  while (have_posts()) {    the_post();    $pagekids = get_pages(“child_of=”.$post->ID.”&sort_column=menu_order”);    $firstchild = $pagekids[0];   header(“HTTP/1.1 301 Moved Permanently”);   header(“Location: “.get_permalink($firstchild->ID));   exit();  }}?>

PHP , , , , ,

Visual Code Editor 1.2.5

March 4th, 2010

I’ve updated Visual Code Editor. Not so much an upgrade, but tested it out with SyntaxHighlighter Evolved 2.3.8 and WordPress 2.9.2.

SyntaxHighlighter Evolved fixes a lot of the problems that VCE also fixed (for SyntaxHighlighter Plus 1.x). But VCE still comes into play when you want to use tinyMCE (the post editor) in WordPress.

  • Adds `<pre>` & `<code>` to block format menu
  • Allows extra attributes for compatibility in some syntax highlighters (ie, `<pre lang=”php” line=’5′>`)
  • Unescape WP’s double escaping of & (not needed with SHE)
  • Allows iFrames in the post
  • Support for syntax highlighting in comments
  • Removes extra `<pre>` tags around SyntaxHighllighter Plus’s sourcecode blocks

I tested it out with SHE and they both play very well together. Although the fixes in VCE are no longer needed, it still adds some functionality to the Visual Editor. Since nothing broke, I’m not going to fix it (remove the fixes). This allows its continued use in other client side syntax highlighters.

Go get it –> http://wordpress.org/extend/plugins/visual-code-editor/

Also, I highly recommend SyntaxHighlighter Evolved.

Visual Code Editor , , , ,

Visual Code Editor with WP-Codebox

January 26th, 2009

This is a test using the Visual Code Editor plugin with the WP-CodeBox plugin.

Original code:

	<Tr>
		<td style="background-color:##598CB5;color:white;font-weight:bold;">
			#l1title#
		</td>
		<td rowspan=16>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
		<td style="background-color:##598CB5;color:white;font-weight:bold;">
			#r1title#
		</td>
	</tr>
<!--- ORDER --->
<cfhttpparam name="x_invoice_num"         type="formfield" value="#invoice_num#" >
<cfhttpparam name="x_description"         type="formfield" value="ScenicMesa.com online order">
<cfloop list="#x_line_items#" delimiters="#chr(9)#" index="i">
	<cfhttpparam name="x_line_item"       type="formfield" value="#i#">
</cfloop>

And here is WP-CodeBox enabled:

Rendering of WP-Codebox

Rendering of WP-Codebox - I took this screen capture just before turning deactivating the plugin.

Visual Code Edior allows for syntax and code editing right in WordPress’ invocation of TinyMCE. Therefore, all html entitied are escaped. As you can see this sometimes does not work with WP-CodeBox since it expects non-escaped code. This is why WP-CodeBox made it on my “Plugins that failed to help” list.

Now for SyntaxHighlighter Plus, which, on the other hand expects escaped code. And so it works well when editing code in visual mode of the WordPress post editor:

	<Tr>
		<td style="background-color:##598CB5;color:white;font-weight:bold;">
			#l1title#
		</td>
		<td rowspan=16>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
		<td style="background-color:##598CB5;color:white;font-weight:bold;">
			#r1title#
		</td>
	</tr><!--- ORDER --->
<cfhttpparam name="x_invoice_num"         type="formfield" value="#invoice_num#" >
<cfhttpparam name="x_description"         type="formfield" value="ScenicMesa.com online order">
<cfloop list="#x_line_items#" delimiters="#chr(9)#" index="i">
	<cfhttpparam name="x_line_item"       type="formfield" value="#i#">
</cfloop>

Visual Code Editor , ,

Visual Code Editor 1.2.2: support for code in comments

January 20th, 2009

Visual Code Editor 1.2.2 now supports code and syntax highlighting in comments.

Testing iframe code…

<iframe src='/test.html'></iframe>

PHP, Visual Code Editor ,

Visual Code Editor 1.2.1: adds iframe, supports php4

January 16th, 2009

Visual Code Editor 1.2 allows iFrames in WordPress’s visual editor (TinyMCE). Example

And 1.2.1 has a code fix for WordPress installations on PHP4. Thanks to Keith for tipping me off!

PHP, TinyMCE, Visual Code Editor , , ,

Visual Code Editor 1.1.1 – Tested with WordPress 2.7

December 12th, 2008

Visual Code Editor is compatible with WordPress 2.7.

The only difference in 1.1.1 is that it states so. ‘Officially’.

No upgrade worries!

Visual Code Editor

Visual Code Editor 1.1 – valid xhtml

December 6th, 2008

Gremmie noticed that Syntax Higlighter Plus adds it’s own <pre> tag when outputting to page. That creates a nested <pre> tag which is not valid xhtml. So I fixed that with 1.1. Using <pre> in visual mode is still required. The fix is to remove the extra <pre> on output to page.

Also updated are the instructions of how to post code snippets:

  • In visual mode, create a [/sourcecode] block
  • Select the sourcecode block
  • Select Preformatted from TinyMCE’s format menu
  • Paste in your code

    Log into your WP Admin and update the plugin for the fix!

    Visual Code Editor, Web Coding

    Migrating from BlogCFC to WordPress

    November 24th, 2008

    Using WordPresses’ RSS import, I was able to copy every post from blogCFC easily. WordPress expects a local file when doing so. And blogCFC’s rss feed is limited to 15. To override that, edit file ‘blog.cfc’. It will be in the following path under your blogCFC installation: /org/camden/blog/. Just set arguments.params.maxEntries to something very very high. If you have less than 1500 posts, the following will do (starting at around line 742):

    <!--- Right now, we force this in. Useful to limit throughput of RSS feed. I may remove this later. --->
    <cfif (structKeyExists(arguments.params,"maxEntries") and arguments.params.maxEntries gt 15) or not structKeyExists(arguments.params,"maxEntries")>
    	<cfset arguments.params.maxEntries = 15>
    </cfif>
    <cfset arguments.params.maxEntries = 1500>
    

    Then, reinit your session to refresh the blog’s cache. Then go to your feed’s url with your web browser. You should have every single article there. Save that rss as a local xml file. Upload that file into WordPress. Great!

    But comments are not copied. So I made and used the below script to copy all post comments from blogCFC to WordPress. Not too difficult! 10 minutes tops.

    First, prep the blogCFC database. In the tblblogentries table (where blogcfc keeps the blog posts), add a column named ‘wpid’. For each row, enter WordPresses’s ID of the same post. I had 43 entried so it did not take a heck of a long time. Just sort both tables by title and do it. I suppose you can write a script for this too, but not worth the effort for 43 entries.

    With that done, here is the CF code:

    <cfquery name="read" dataSource="your-blogcfc-datasource">
    SELECT tblblogcomments.*, tblblogentries.wpid
    FROM tblblogcomments INNER JOIN tblblogentries ON tblblogcomments.entryidfk = tblblogentries.id
    </cfquery>
    
    <cfoutput query="read">
    	#wpid# #name# #email# #posted# #website#<br>
    
    	<cfquery name="ins" dataSource="your-wordpress-datasource">
    	INSERT INTO wp_comments
    	(comment_post_ID, comment_author, comment_author_email, comment_author_url, comment_date, comment_content, comment_approved)
    	VALUES
    	('#wpid#', '#name#', '#email#', '#website#', '#posted#', '#comment#', 1)
    	</cfquery>
    </cfoutput>
    

    Run that page in a browser and all comments are imported! Nice. Then one more step. For each WP post, you have to update the post count. Again, not a big deal. Sort your WP comments table (wp_comments) by comment_post_id and do some simple math.

    ColdFusion, MySQL, News

    Visual Code Editor v1.0

    November 18th, 2008

    Visual Code Editor modifies WordPress’s behavior so that code format is preserved when using the visual editor. It will work with any syntax highlighter that accepts encoded (or escaped) syntax.

    Download the plugin: http://wordpress.org/extend/plugins/visual-code-editor/

    WordPress is really nice. But it mangles syntax in posts. I set out to end that with a non source-code-editing method: a plugin!

    The problem in WordPress comes in when you edit your post twice. When you load that post again, WP converts ampersands into “&”. Which is nice. But if you edit that post again, WP re encodes ampersands again. Giving you “&”. Want to guess what happens if you save and load it again? :)

    Now lets compound that with the visual editor, which automatically encodes for you as you type or paste. That only accelerates the process. And the fault here is with WP when it loads the post. Not with TinyMCE, at all.
    Lets make matters even worse. WP’s default settings for TinyMCE is really screwy. It’s horrible for programmers who want to blog.

    • Users have to switch to HTML or TEXT views to insert <pre> or <code> tags.
    • TinyMCE does not allow unknown attributes for tags like <pre line=”1″>.

    That may sound really picky. But most syntax highlight plugins require either <pre> or <code> and to use special attributes in them to display properly. Some require the syntax to have all entities escaped, some require the opposite. What a freaking nightmare. So I set out to end this nonsense.

    Enter Visual Code Editor. It’s a plugin I wrote for WordPress. Visual Code Editor makes it possible (and trouble free) to post and edit code snippets in wordpress’s visual editor.

    • Adds <pre> & <code> to block format menu
    • Allows extra attributes for compatibility in some syntax highlighters (ie, <pre lang=”php” line=’5′>)
    • Unescape WP’s double escaping of &
    • v1.1: Removes extra <pre> tags around SyntaxHighlighter Plus’s sourcecode blocks
    • v1.1.1: Tested with WordPress 2.7

    And the nicest thing is… it’s a plugin! You don’t have to go around editing WP’s base installation. Download, extract, upload, activate, done.

    Coupled with the SyntaxHighlighter Plus plugin, you get results like this:

    syntax highlight

    Syntax highlighter Plus runs through javascript on the client and expects the code to have entities encoded. Thanks to my plugin and TinyMCE, we’re golden. I chose Syntax highlighter Plus for a few reasons.

    • it’s the easiest to use and is smart.
    • It runs in javascript, search engines do not see tons of inline css muddying the page.
    • The page also downloads faster because of that.
    • The ‘copy to clipboard’ does not require flash.

    All you have to do is create a [/sourcecode] block, select the sourcecode block, select Preformatted from Tiny’s format menu, then paste in your code. It should look like this:

    syntax highlight   

    The Preformatted area tells TinyMCE to leave the formatting the heck alone. makes Syntax highlighter Plus do it’s magic on the viewer side. And you can still edit all of your code in the visual editor. Awesome!I also left the door open for other syntax highlighters, which instead of using , use <pre lang=”xxx” [line="5"]> or even <code>, etc.   

    Feel free to download the plugin, which is now in the WordPress PlugIn Directory! Yippee I learnt how ta use SVN today! http://wordpress.org/extend/plugins/visual-code-editor/

    Plugins that failed to help

    I did my homework before writing this plugin. I tried all of the following. All of which failed in one way or another.

    • Chili Code Highlighter
    • CodeHighlighter
    • Developer Formatter
    • Disable wpautop
    • Editor Extender
    • EmbedIt
    • Google Syntax Highlighter for WordPress
    • Preserve Code Formatting
    • Raw HTML capability
    • Text Control
    • TinyMCE Entities Patch
    • Code Snippet
    • Dean’s Code Highlighter
    • Highlight Source Pro
    • iG:Syntax Hiliter
    • Sniplets
    • Snippet Highlight
    • WP-CodeBox
    • WP-Syntax

    Visual Code Editor , , ,

    WordPress Plugin, Visual Code Editor, posts and edits code snippets in wordpress’s visual editor

    November 14th, 2008

    I will be moving my blog from blogCFC to WordPress. So I have it installed and played with skins and syntax highlighting… which is quite lacking.

    The problem comes in when you edit your post twice. When you load that post again, WP converts ampersands into “&amp;”. Which is nice. But if you edit that post again, WP re encodes ampersands again. Giving you “&amp;&amp;”. Want to guess what happens if you save and load it again? :)

    Now lets compound that with the visual editor, which automatically encodes for you as you type or paste. That only accelerates the process. And the fault here is with WP when it loads the post. Not with TinyMCE, at all.
    Lets make matters even worse. WP’s init for TinyMCE is really screwy. Looking at the code you’d think they were rocket scientists. But… dang it… the defaults are horrible for programmers who want to blog!

    • Users have to switch to HTML or TEXT views to insert <pre> or <code> tags.
    • TinyMCE does not allow unknown attributes for tags like <pre line=”1″>.

    That may sound really picky. But most syntax highlight plugins require either <pre> or <code> and to use special attributes in them to display properly. Some require the syntax to have all entities escaped, some require the opposite.  What a freaking nightmare.  So I set out to end this nonsense.

    Enter Visual Code Editor. It’s a plugin I wrote for WordPress. Visual Code Editor makes it possible (and trouble free) to post and edit code snippets in wordpress’s visual editor.

    • Adds <pre> & <code> to block format menu
    • Allows extra attributes for compatibility in some syntax highlighters (ie, <pre lang=”php” line=’5′>)
    • Unescape WP’s double escaping of &
    • v1.1: Removes extra <pre> tags around SyntaxHighlighter Plus’s sourcecode blocks

    And the nicest thing is… it’s a plugin! You don’t have to go around editing WP’s base installation. Download, extract, upload, activate, done.Coupled with the SyntaxHighlighter Plus plugin, you get results like this:

    syntax highlight 

    Syntax highlighter Plus runs through javascript on the client and expects the code to have entities encoded. Thanks to my plugin and TinyMCE, we’re golden. I chose Syntax highlighter Plus for a few reasons. 

    • it’s the easiest to use and is smart.
    • It runs in javascript, search engines do not see tons of inline css muddying the page.
    • The page also downloads faster because of that.
    • The ‘copy to clipboard’ does not require flash.

    All you have to do is create a [/sourcecode] block, select the sourcecode block, select Preformatted from Tiny’s format menu, then paste in your code.

    It should look like this:

    syntax highlight 

    The Preformatted area tells TinyMCE to leave the formatting the heck alone. makes Syntax highlighter Plus do it’s magic on the viewer side. And you can still edit all of your code in the visual editor. Awesome! 

    I also left the door open for other syntax highlighters, which instead of using , use <pre lang=”xxx” [line="5"]> or even <code>, etc.

    Feel free to download the plugin, which is now in the WordPress PlugIn Directory! Yippee I learnt how ta use SVN today! http://wordpress.org/extend/plugins/visual-code-editor/

    Plugins that failed to help

    I did my homework before writing this plugin. I tried all of the following. All of which failed in one way or another.

    • Chili Code Highlighter
    • CodeHighlighter
    • Developer Formatter
    • Disable wpautop
    • Editor Extender
    • EmbedIt
    • Google Syntax Highlighter for WordPress
    • Preserve Code Formatting
    • Raw HTML capability
    • Text Control
    • TinyMCE Entities Patch
    • Code Snippet
    • Dean’s Code Highlighter
    • Highlight Source Pro
    • iG:Syntax Hiliter
    • Sniplets
    • Snippet Highlight
    • WP-CodeBox
    • WP-Syntax

    Here are the plugins that I am currently running:

    WHEW! That’s enough blogging for today. I gotta get some work done!

    PHP, TinyMCE, Visual Code Editor