10 Fantastic Free WordPress Plugins for 2017 (That You May Not Have Heard Of) | @thetorquemag

Read 10 Fantastic Free WordPress Plugins for 2017 (That You May Not Have Heard Of) by John Hughes (Torque)
There are so many plugins out there it can be hard to find really good ones. These ten free WordPress plugins add interesting capabilities.

Browser Bookmarklets and Mobile Sharing with Post Kinds Plugin for WordPress

The Post Kinds Plugin

I’ve been using David Shanske’s excellent WordPress plugin Post Kinds, which is conveniently bundled into the IndieWeb Plugin, for more than a year now. (Update: I’ve also written a fairly in-depth primer for it.)

Much like WordPress’s native post formats (standard, aside, image, quote, link, status, audio, etc.) which were introduced in v3.1, Post Kinds instead provides a better mapping of post types across a larger variety of social media types (article, bookmark, favorite, itinerary, jam, like, listen, note, photo, play, read, reply, repost, watch, and more). In addition to changing the visual layout and formatting of most posts, the plugin also importantly includes the correct microformat classes for each of these post types and this enables a lot of other fantastically important functionality for the open web.

Custom URLs for Post Kinds

One of the problems I had with using it initially was taking the extra time to cut and paste in the several pieces of additional data or fill in meta data to make a post. It was particularly painful in a mobile setting. I was thrilled when David mentioned that he’d built in some customized query parameters which could take URLs to import in much of the data as well as to set the correct post kind automatically. They came with the general format of

http://example.com/wp-admin/post-new.php?kind=bookmark&kindurl=@url

where one could replace @url with the target URL of the site to be bookmarked, for example. Replacing bookmark with the appropriate post kind name would allow one to set the flag for each post to the proper post kind automatically, and naturally one should replace example.com with the base URL for their site.

Putting this customized URL into a browser will create a new post in one’s website admin UI and Post Kinds will automatically set the URL and scrape its meta data. One can then modify any additional data or add a comment and then publish quickly and easily.

As a concrete example, I would put the following URL in my browser of choice to “like” the Post Kinds Plugin page:
http://www.boffosocko.com/wp-admin/post-new.php?kind=like&kindurl=https://wordpress.org/plugins/indieweb-post-kinds/

Browser Bookmarklets

I am a huge fan of browser bookmarklets, so for a while I’ve been meaning to create some for the post kinds I use to better automate my post process. After dragging my feet for ages, particularly because my JavaScript skills are nearly non-existent, I’ve finally gotten around to adapting the common WordPress “Press This” bookmarklet to work with Post Kinds.

Below is the modified code that can be put into a bookmarklet to allow for easily bookmarking a particular post:

javascript:(function(a,b,c,d){function e(a,c){if("undefined"!=typeof c){var d=b.createElement("input");d.name=a,d.value=c,d.type="hidden",p.appendChild(d)}}var f,g,h,i,j,k,l,m,n,o=a.encodeURIComponent,p=b.createElement("form"),q=b.getElementsByTagName("head")[0],r="_press_this_app",s=!0;if(d){if(!c.match(/^https?:/))return void(top.location.href=d);if(d+="&kindurl="+o(c),c.match(/^https:/)&&d.match(/^http:/)&&(s=!1),a.getSelection?h=a.getSelection()+"":b.getSelection?h=b.getSelection()+"":b.selection&&(h=b.selection.createRange().text||""),d+="&buster="+(new Date).getTime(),s||(b.title&&(d+="&t="+o(b.title.substr(0,256))),h&&(d+="&s="+o(h.substr(0,512)))),f=a.outerWidth||b.documentElement.clientWidth||600,g=a.outerHeight||b.documentElement.clientHeight||700,f=800>f||f>5e3?600:.7*f,g=800>g||g>3e3?700:.9*g,!s)return void a.open(d,r,"location,resizable,scrollbars,width="+f+",height="+g);(c.match(/\/\/(www|m)\.youtube\.com\/watch/)||c.match(/\/\/vimeo\.com\/(.+\/)?([\d]+)$/)||c.match(/\/\/(www\.)?dailymotion\.com\/video\/.+$/)||c.match(/\/\/soundcloud\.com\/.+$/)||c.match(/\/\/twitter\.com\/[^\/]+\/status\/[\d]+$/)||c.match(/\/\/vine\.co\/v\/[^\/]+/))&&e("_embeds[]",c),i=q.getElementsByTagName("meta")||[];for(var t=0;t<i.length&&!(t>200);t++){var u=i[t],v=u.getAttribute("name"),w=u.getAttribute("property"),x=u.getAttribute("content");x&&(v?e("_meta["+v+"]",x):w&&e("_meta["+w+"]",x))}j=q.getElementsByTagName("link")||[];for(var y=0;y<j.length&&!(y>=50);y++){var z=j[y],A=z.getAttribute("rel");("canonical"===A||"icon"===A||"shortlink"===A)&&e("_links["+A+"]",z.getAttribute("href"))}b.body.getElementsByClassName&&(k=b.body.getElementsByClassName("hfeed")[0]),k=b.getElementById("content")||k||b.body,l=k.getElementsByTagName("img")||[];for(var B=0;B<l.length&&!(B>=100);B++)n=l[B],n.src.indexOf("avatar")>-1||n.className.indexOf("avatar")>-1||n.width&&n.width<256||n.height&&n.height<128||e("_images[]",n.src);m=b.body.getElementsByTagName("iframe")||[];for(var C=0;C<m.length&&!(C>=50);C++)e("_embeds[]",m[C].src);b.title&&e("t",b.title),h&&e("s",h),p.setAttribute("method","POST"),p.setAttribute("action",d),p.setAttribute("target",r),p.setAttribute("style","display: none;"),a.open("about:blank",r,"location,resizable,scrollbars,width="+f+",height="+g),b.body.appendChild(p),p.submit()}})(window,document,top.location.href,"http:\/\/example.com\/wp-admin\/post-new.php?kind=bookmark");
Browser bookmarklets for Post Kinds

Other versions of the bookmarks can easily be made for all the other other Post Kinds by replacing the two red highlighted portions of the code sample appropriately for each one. Specifically one should exchange bookmark with the name of the kind desired (all of them should be in lowercase) and replace example.com with one’s own domain name.

For simplicity, I’m including a sample/template bookmarklet button below which can be dragged and dropped into most browser bars. Before using it, edit the JavaScript as described above and paste it into the URL box. I’m happy to help those who may have problems. I’ve included a screen capture of what all of them look like once they’re set up and configured with matching emoji added into the titles to assist in visual selection.

🔖 Bookmark

Perhaps I (or someone else enterprising) would contribute all this back into the plugin repository for Post Kinds so that these bookmarklets would be self-generated for plug and play usage within the admin interface for the plugin the way the bookmarklets are for the IndieWeb plugin’s PressThis bookmarklets, perhaps at /wp-admin/admin.php?page=kind_options.

A Post Kinds “Bookmarklet” for Mobile

For those who would like something similar to the above for use on mobile platforms (and particularly Android) I’ve written up some instructions below which allow one to use the Android app URL Forwarder to use the ubiquitous mobile “share” functionality from most pages and/or apps in a way similar to this bookmarklet functionality. (This is based in part on some work by Ryan Barrett and some work I’d written up for the Known CMS a while back.)

I’d suspect that there’s also a similar app for iOS, but I haven’t checked. If not available, URL Forwarder is open source on Github and could potentially be ported. There’s also a similar Android app called Bookmarklet Free which could be used instead of URL Forwarder.

Configuring URL Forwarder for Post Kinds

  1. Open URL Forwarder on your phone
  2. Click the “+” button to create a filter.
  3. Give the filter a name, “Bookmark” for the bookmark version. (See photo below.)
  4. Use the following entry for the “Filter URL” replacing example.com with your site’s domain name: http://EXAMPLE.com/wp-admin/post-new.php?kind=bookmark&kindurl=@url
  5. Leave the “Replaceable text” as “@url”
  6. Finish by clicking on the checkmark in the top right corner.
  7. Repeat the above for the other desired post types but replacing “bookmark” with the lower case names of those other types.

Simple right?

Creating a post via mobile

With the configuration above set up, do the following:

  1. On the mobile page one wants to bookmark, like, favorite, etc., click the ubiquitous “share this” mobile icon (or share via a pull down menu, depending on your mobile browser or other app.)
  2. Choose to share through URL Forwarder
  3. Click on the “bookmark” option just created above (or other option as necessary for the desired post type).
  4. Change/modify any meta data within your website administrative interface or add any additional thoughts and publish. (This part is the same as one would experience using the desktop bookmarklet.)

Happy posting!

IndieWeb “Press This” Bookmarklet for WordPress

Liked IndieWeb press this by Matthias PfefferleMatthias Pfefferle (GitHub)

One big IndieWeb raison d’être is using your own web site to reply, like, repost, and RSVP to posts and events. You do this by annotating links on your site with simple microformats2 HTML.

Having said that, most people don’t want to write HTML just to like or reply to something. WordPress’s Press This bookmarklets can already start a new post with a link to the page you’re currently viewing. This code adds IndieWeb microformats2 markup to that link. Combined the wordpress-webmention plugin, you can use this to respond to the current page with just two clicks.

What’s more, if you’re currently on a Facebook post or Twitter tweet, this adds the Bridgy Publish link that will reply, like, favorite, retweet, or even RSVP inside those social networks.

I’m not sure why I didn’t upgrade this ages ago when I saw it mentioned (probably because of the manual nature of the upgrade and the fact that I don’t think it’s bundled into the IndieWeb plugin for WordPress), but here we go. And this is the first post actually using the bookmarklet.