Tags: javascript
Auto Create Slugs in Croogo with jQuery
I got tired of hand writing slugs for my blog posts, I am used to using the acts_as_sluggable behavior. I thought about implementing the behavior into Croogo but realized this might be better implemented as some simple Javascript. Initially I wrote a simple find and replace function with Javascript that converted spaces to hyphens but realized it didn't take into account special characters or more than one space so I did a quick search on Google and came across the jQuery Slug Plugin. It took me about 2 minutes to download and implement.
All you need to do is download the plugin and place it into your webroot/js directory and then modify a few lines in app/views/nodes/admin_add.ctp. The changes I made are below.
$javascript->link(array('nodes', 'jquery.slug'), false);
Include the jQuery slug plugin at the top of the page.
<script type="text/javascript">
$(document).ready(function(){
$("#title").slug({
slug:'permalink',
});
});
</script>
Set up the plugin and let it know the title field's ID and the class of the slug field.
echo $form->input('title', array('id' => 'title'));
echo $form->input('slug', array('class' => 'permalink'));
Add an ID to the title field and a classname to the slug field. That's about it, hope this saves you some time when you are writing your next article.
