Related Entries plugin for Mango Blog
September 10 2008 by 
Adam
This plugin has been a long time in the making. It's something I knew from the outset that I would want in Mango, but after getting my feet wet by writing a few other small plugins, I knew I could do it. I made it as simple as I could, but there are still a couple of things you will need to know; one of which is that you might need to modify your theme to broadcast a new event in a couple of places. This new event is going to be a part of future versions of Mango, so there isn't any worry about future-compatability and worries when upgrading.
First of all, though you need a small update to the core of Mango. Even if you've got the latest version of Mango (1.1)! Laura posted a comment on the plugin ideas page with a link to the update zip file, and an explanation that it included a new plugin (home page chooser), some core modifications that were needed to support that plugin, and most importantly, some bug fixes — one of which is necessary for back-linking of related entries to work correctly. So before you do anything else, make sure you grab and install that update!
Once you've got the Mango update installed, go ahead and download my Related Entries plugin.
Now about that event. It's really simple to add. Open up your theme's index.cfm and post.cfm files (and archives, and other places you may want to show related entries…). The code to broadcast the event is really simple:
<mango:Event name="beforePostContentEnd" />
Simple, right? And where do you put it? Anywhere, really… within reason. It uses contextual information to look up related entries data for the current post, so you must broadcast it inside of a (custom tag) block. So for example, here's the relevant information from my theme's index.cfm template:
<mango:Posts count="5">
<mango:Post>
...
<mango:Event name="beforePostContentEnd" />
<p class="date">Posted in ...</p>
...
</mango:Post>
</mango:Posts>
That's almost it! After you install the plugin, and add the event broadcast to your theme, there's just 2 more things.
First, relate a couple of entries. Edit a post, and look at the bottom of the form.
This new section should be displayed at or toward the bottom of the form. As it explains, you select a category from the left column to see its entries from the selected categories (use control to select multiple). Then click on any entries from the center column that you want to relate to the current entry; they will be displayed in the right column. (This is all done with jQuery ajax!) To remove an entry from the right column, double click it. When you submit the form, the posts in the right column will be marked as related to the current entry; and in addition to that, the current entry will be related to those posts.
When you submit the form, if you get an error that looks like this, then you didn't install the update!:
If you don't get the above error, then your data should be good to go. Now, you just need to style it.
When you've got related entries data, the event you're broadcasting is going to be replaced with some code along this line:
<div class="related">
<h2 id="RelatedEntries">Related Entries:</h2>
<ul>
<li><a href="http://server/post/your-post">Post Title</a></li>
<li><a href="http://server/post/your-post">Post Title</a></li>
<li><a href="http://server/post/your-post">Post Title</a></li>
</ul>
</div>
So, you can define some css rules for .related, #RelatedEntries (or .related h2), and .related ul, .related ul li, .related ul li a.
That's it. Enjoy!
One note for the future: The update I talk about above should be included in Mango 1.2, so if you've got 1.2 (or later) installed, don't worry about the update.
In case you missed the link before, you can Download my Related Entries Mango Blog Plugin right here.
Posted in AJAX | ColdFusion | JavaScript | My projects | Mango | 
21 comments
I installed it on my mango blog already and it works great! Thank you much Adam! This is exactly what many of us have been waiting for.
I am modifying mine a bit though. I am removing id="RelatedEntries" from the h2. Since the h2 is inside the div "related" you only need to refer to it in your css as
.related h2 and your golden. :)
Also, if you have more than one on your homepage where you show more than one item, having multiple ID's is not exactly valid.
Whoot! Finally Related Articles! Thanks again Adam!
Mark, good point on the ID. I'll remove that from the zip.
Hi Adam,
Good job! I am glad you got it working ;)
This plugin was something that I really wanted for myself, and now I have it!
BTW, regarding the new event, it will be available in the updates for the themes. The only thing is that I've only been adding it to the post pages and not in the home or archives. I guess it depends on the application, but if I wanted to have ads there, for instance, I wouldn't want to have them at the footer of every post.
One other thing, I would change the header to something of less importance, like h4 or h5. h2 is usually used for entry titles and other more important elements.
Laura, Good point on the use of H2. I'll switch it to an H4.
I added the event to my archives and index pages because I wanted it to be displayed there. Certainly, if someone doesn't want related entries displayed on their home page and only in archives/individual post, they can leave index alone.
Perhaps, though, this is a good case for separate events on each?
beforeInedxPostContentEnd, beforeIndividualPostContentEnd, beforeArchivesPostContentEnd
Just a thought.
Great work again, Adam!
Makes me feel guilty though, that for some reason I've not posted to my blog or made any Mango plugins for over 6 months...
Definitely time to rectify that, and build my own skin too!
Keep up the good work...
i've got version 1.2.2 running with your .01 release and i see the list of categories but nothing happens when i click on it. i've reloaded the settings, de-activated and activated. nothing... any ideas? Tried in all browsers (chrome, ff3, ie7)
Hmm, we're having the same problem as jonese above...any suggested solutions?
Hi Adam
Thanks for your work.
But I'm facing the same issue as Jonese and Tiffany.
List of categories shows up in the admin when adding/editing a post. But clicking on a category does not do anything. There are no Javascript errors either.
Indy
Ok, I think I'm beginning to see what is going wrong.
1. Line 264 in plugin.cfc creates a variable called ajaxPath. It is evaluate to an incorrect path on my install. Therefore the ajax call being made to retrieve the categories doesn't work. If you use an HTTP sniffer you can see the 404.
So I changed the variable ajaxPath to point to the correct path. Which in my case is: /blog/components/plugins/user/RelatedEntries/assets/RelatedEntries.cfc
So that takes care of the fact that a correct Ajax call is being made.
2. The second issues is that I'm using CF 702 (yes, yes, I know I should upgrade, but my hosting company is a bit slow).
And using CF702 seems to give the issue that function getEntriesByCatIdList() in RelatedEntries.cfc returns a WDDX packet instead of a JSON packet. I have a feeling that returnFormat was not supported in CF702.
So I'll have to look at a way to return JSON string from a CF function in CF702. I remember there was some issue with this and in the past I had to revert back to using a CFM file to generate the JSON packet.
Will keep you posted.
@Indy I'm looking at plugin.cfc and i don't see that var on line 264. I do see it at line 144 but it's set to a variable which points back to a mangoblog function call....
what version are you running of mango and of Related Entries?
Eric, Indy, and Tiffany: I've sent you all an updated version of the plugin that should hopefully address the issue on versions of CF older than 8. Let me know how you make out with it.
Thanks a lot Adam.
The .2 beta that you sent works beautifully on CF702.
We love it too!
http://mangobloghosting.com
Nice work!
Adam,
I think I might be experiencing the same problem as Indy and the others. Has the fix been made publicly available? If not, could you possibly email it to me as well?
Josh, I'm hoping to release an update this week (just need to make time to test it on Railo and OpenBD) that contains this and some other fixes. Stay tuned...
I have no idea why, but all of a sudden my related entries are working! I didn't do anything.
Glad it's working for you now, Josh. I'm finishing up testing of my updates and bug fixes (no small feat), and hope to have the new release published in the next day or two.
Adam, I just upgraded to Mangoblog 1.4 and I'm having trouble removing related entries for a post. The double-click to remove isn't working, and I can't even figure out where in my db I can manually delete the associations. An example is here: http://blog.joshsager.com/post.cfm/thailand-2009-8-16-bangkok-at-dawn-and-birding
Can you help?
Josh, I've had some reports that the double-click to remove doesn't work in FireFox 3.5, but no time to investigate that yet. If you *are* using FireFox 3+, could you try another browser to see if that resolves it for you?
You are correct; it's also not working in IE8. In Safari 4 I can remove an entry that I just add, but existing ones can't be removed. In fact, now I'm seeing their hash ID's being listed along with the title and double-clicking does nothing.
Can you at least tell me which table these are stored in so I can remove the offending current entries?