Front-end editing for WordPress

The only WordPress newsletter you need Join 1000's of fans and customers just like you. Always awesome and never spam.

Email*

This field is for validation purposes and should be left unchanged.

Δdocument.getElementById( "ak_js_1" ).setAttribute( "value", ( new Date() ).getTime() );

gform.initializeOnLoaded( function() {gformInitSpinner( 2, 'https://slocumthemes.com/wp-content/plugins/gravityforms/images/spinner.svg', true );jQuery('#gform_ajax_frame_2').on('load',function(){var contents = jQuery(this).contents().find('*').html();var is_postback = contents.indexOf('GF_AJAX_POSTBACK') >= 0;if(!is_postback){return;}var form_content = jQuery(this).contents().find('#gform_wrapper_2');var is_confirmation = jQuery(this).contents().find('#gform_confirmation_wrapper_2').length > 0;var is_redirect = contents.indexOf('gformRedirect(){') >= 0;var is_form = form_content.length > 0 && ! is_redirect && ! is_confirmation;var mt = parseInt(jQuery('html').css('margin-top'), 10) + parseInt(jQuery('body').css('margin-top'), 10) + 100;if(is_form){jQuery('#gform_wrapper_2').html(form_content.html());if(form_content.hasClass('gform_validation_error')){jQuery('#gform_wrapper_2').addClass('gform_validation_error');} else {jQuery('#gform_wrapper_2').removeClass('gform_validation_error');}setTimeout( function() { /* delay the scroll by 50 milliseconds to fix a bug in chrome */ jQuery(document).scrollTop(jQuery('#gform_wrapper_2').offset().top - mt); }, 50 );if(window['gformInitDatepicker']) {gformInitDatepicker();}if(window['gformInitPriceFields']) {gformInitPriceFields();}var current_page = jQuery('#gform_source_page_number_2').val();gformInitSpinner( 2, 'https://slocumthemes.com/wp-content/plugins/gravityforms/images/spinner.svg', true );jQuery(document).trigger('gform_page_loaded', [2, current_page]);window['gf_submitting_2'] = false;}else if(!is_redirect){var confirmation_content = jQuery(this).contents().find('.GF_AJAX_POSTBACK').html();if(!confirmation_content){confirmation_content = contents;}setTimeout(function(){jQuery('#gform_wrapper_2').replaceWith(confirmation_content);jQuery(document).scrollTop(jQuery('#gf_2').offset().top - mt);jQuery(document).trigger('gform_confirmation_loaded', [2]);window['gf_submitting_2'] = false;wp.a11y.speak(jQuery('#gform_confirmation_message_2').text());}, 50);}else{jQuery('#gform_2').append(contents);if(window['gformRedirect']) {gformRedirect();}}jQuery(document).trigger('gform_post_render', [2, current_page]);} );} );

Front-end editing in WordPress is picking up a lot of steam lately.

The recent release of 3.8 brought us a fresh new admin interface and in my opinion, a better blogging experience. With all the new UI goodies, it has folks like me craving for more.

Recent blogging competitors like Ghost and Medium, embrace a simple publishing interface.

How can we take our WordPress blogging experience to the next level and leave all that technical clutter behind the scenes? Let’s dig into some front-end editing plugins.

Front-end Editor WordPress plugin

Plugin information:
Front-end Editor
http://wordpress.org/plugins/front-end-editor/
214k+ Downloads as of this post
4.3 out of 5 stars

Front-end Editor is a plugin that lets you make changes to your content directly from your site. No need to load the admin backend just to correct a typo.

Screencast

Thoughts on the Front-end editor plugin

The plugin certainly lives up to it’s name without any real roadblocks one might expect. The Epic theme has a very clean layout, so It’s tough to say how the plugin holds up if you were running something a bit more complex.

That said, there’s a few things that I’d like to see from future releases:

Adding images from the media gallery to the content area.
Utilize the WordPress page linking function when adding links.

At the end of the day, I won’t be creating my content in the front-end using this plugin. There’s still too many moving parts of a blog post like photos, video or embedding podcast media. However, it’s great for making those visual tweaks before you publish your hard earned post.

I still say it’s worth checking out and I’d love to hear what you have to say in the comments below!

If you want to follow along with the front-end editing discussion going on for WordPreds core, checkout http://make.wordpress.org/ui/tag/front-end-editor/

Share Tweet Share