Diigo + FeedWordPress & WordPress Snap Workflow

These last few posts are an attempt to document both how things I post on this blog come back up and help me do new things and an attempt to document how I come to solutions for things that I don’t understand how to do. Then there’s an attempt to explain what I did in case anyone else wants to do the same. I hope that it’s a narrative on my learning process as much as it is a tutorial on the particular topic.

The Past

So I’m fairly focused on making things easier for myself for the simple fact that if they don’t make sense/work with my current life then I tend not to keep them up. A good examples is that way back in 20111 I modified the WordPress “Press This” bookmarklet in combination with the WordPress Snap plugin to allow me to auto generate screenshots of pages.

I used it a few times after that but it didn’t fit my workflow. It solved one problem- I wanted visuals of these websites to make the posts more engaging but I didn’t want to take screenshots, upload them etc.2 So one problem solved but the fact remained that I didn’t use “Press This” to bookmark pages. I used Diigo for that kind of thing so despite solving one workflow problem the “solution” died a relatively quick death. It’d be easy to write it off as a waste of time and a failure but it planted the seed in my head that I can modify bookmarklets to better do my bidding and it just required that I tweak it a bit more. I just needed a more pressing need to drive me to figure it out.

Enter the Need

At VCU we’re looking to aggregate a variety of interesting use cases of WordPress as a course website, open education projects, and other neat things. I’ve, once again, built things like this a number of times (mainly in Exhibit) in the past both at the Univ. of Richmond3 and HCPS. They are always well intended and start strong but quickly die, even with multiple authors, because they aren’t part of a workflow and episodic hurculean efforts are not a good way to get things like this done. You want them to live and grow and for that to happen it has to fit in the way people work.

Details

My goal was to use Diigo to post sites with the tag “item” to a blog. I wanted those posts to have a preview image of the page.

Step One

Install the FeedWordPress plugin
in the WordPress blog I was going to use. I decided on the highly creative tag of “item” to indicate the posts I wanted to go to this blog. Now in Diigo I just had to use the URL https://www.diigo.com/rss/user/bionicteaching/item to get that stuff into FeedWP and thus into the blog. So now anything I tag “item” becomes a blog post on that site and the tags from Diigo are tags in WordPress. Nice and seamless.

Adding Images- Snag #1

I installed WordPress Snap (it still works). I was going to have to come back and hand enter the shortcode but figured it was more likely to happen than taking screenshots. This didn’t quite work. Even when I could add information after allowing the syndicated copy to be modified the shortcode was still non-functioning. I was also missing the Visual/Text tabs in the editor which confused me. I went to Twitter for help.


This of course, prompted me to search more and figure it out.

Turns out that under Syndication>Posts & Links>Formatting you need to turn ON formatting filters. Which is pretty much the opposite of what I would have thought. At this point I decided to test and see if writing the shortcode in the Diigo bookmark would work and surprise, surprise it did.

My Memory- Snag #2

I couldn’t remember the shortcode for more than a few hours at a time. I’d change it to all sorts of things that were close but not close enough. Plus I didn’t do a good job remember the numbers etc. Granted I could have made a note somewhere and referenced it but this is the kind of things computers are for. I don’t want to have to do a repetitive thing or remember something boring and standardized. This sparked my memory of the previous bookmarklet.

The Revised Diigo Bookmark

I knew that the Chrome extension was likely to be overkill for what I wanted but I figured the lower weight Diigo bookmark would meet my needs and keep things simple enough to parse out quickly. I found a simple Diigo bookmarks someplace. Once you drag it to your bookmark bar you can right click on it and select edit. That got me this code.

javascript:javascript:(function()
{var url = location.href;var title = document.title || url;
var desc = (window.getSelection ? window.getSelection().toString() : document.getSelection ? document.getSelection()  : document.selection.createRange().text);
window.open('https://www.diigo.com/post?url=' + encodeURIComponent(url) + '&title=' + encodeURIComponent(title) + '&desc=' + encodeURIComponent(desc)+'&client=simplelet#main','_blank','menubar=no,height=580,width=608,toolbar=no,scrollbars=no,status=no');
})();

Essentially, I wanted to wrap the url variable with the Snap shortcodes in the desc variable. I had to review some concatenation rules for javascript but it worked out alright. If you look below, on the 3rd line you’ll see all I added was +'[snap url="'+url+'" width="600px" height="350px" link="on"]' which seems pretty simple now. I used single quotes to enclose the string so that I could freely use double quotes. The plus signs allow me to stick string together and get what I want.

javascript:javascript:(function()
{var url = location.href;var title = document.title || url;
var desc = (window.getSelection ? window.getSelection()+'[snap url="'+url+'" w="600px" h="350px" link="on"]'.toString() : document.getSelection ? document.getSelection()  : document.selection.createRange().text);
window.open('https://www.diigo.com/post?url=' + encodeURIComponent(url) + '&title=' + encodeURIComponent(title) + '&desc=' + encodeURIComponent(desc)+'&client=simplelet#main','_blank','menubar=no,height=580,width=608,toolbar=no,scrollbars=no,status=no');
})();

So if you wanted to use this, you can create a bookmark for any page and then edit it and replace the URL with the code above.

Further Work

I remain unable to get tags to auto enter through the bookmarklet. That whole section of the created URL seems to get ignored but I decided it wasn’t that big a deal for this use.


1 Nothing wrong with letting an idea ripen.

2 I’m lazy I guess.

3 It still LIVES! Or rather rots in obscurity. Although I still like the Bestiary themed presentation.

7 thoughts on “Diigo + FeedWordPress & WordPress Snap Workflow

  1. I’m curious about your experiences with the Snap plugin. It looks like it makes use of wordpress.com’s screenshot generator. We’ve been using another plugin (WP-Thumbnail) that also uses that service, and I’m becoming less and less impressed with the approach. Frequently, the shots will resolve on a page and the quickly turn to 404 errors (even though the site definitely exists). Othertimes, the loading screen for the screenshot will churn and churn, and you never get the actual image.

    I’m not sure if it’s because we’re trying to generate too many screenshots on a page. We’re using this in the directory of UMW Domains Community page, which shows 12 or 15 items at a time, I believe.

    I’m about ready to start looking for other screenshot generator alternatives, even if it means paying for something commercial.

    Have you run into any similar issues with the Snap plugin?

    1. I believe you’re correct in that it uses WP’s generator. It seems to work pretty well but I haven’t used it massively. Once the pieces work they seem to stay working. I am a bit nervous in that it hasn’t been updated in two years but maybe that’s because it just works? I’ll keep an eye on it and let you know if I see stuff messing up.

Comments are closed.