BG Views Developer Blog - Technical

Setting up a URL Shortener with YOURLS

2010-08-30T04:26:26Z

Right about the time Bit.ly Pro was announced and they were taking invites, I wanted to setup our own URL shortener. Short URLs are very important in the Twitter World, and brand recognition is also important. As it turns out we finally got our Bit.ly Pro invite about a month and a half after setting up YOURLS. And frankly, I would rather have complete control anyways.
]]> Step 1. Find a great short URL. I am pretty proud of the domain hack I found, http://bgne.ws/. I later noticed that the AP is using something similar, what a coincidence: apne.ws. There are a number of places to look but Domainr is one of the best. It searches TLDs as well as other hacks such as using folders or subdomains. With so many TLD extensions out there these days, you should be able to find a creative use of your brand name.

Step 2. Install YOURLS. See the Install page for details. It is pretty much fill in the blanks in the config.php file, something you should be used to by now. Right?

Some advice:

define('YOURLS_UNIQUE_URLS', true); Set this to true so that your system does not churn out 10 short links for 1 article. If someone tries to shorten something that has already been shortened, it just returns the existing short URL.

define('YOURLS_PRIVATE', true); I don't recommend setting up a public install of YOURLS, that is just asking for trouble.

$yourls_user_passwords In this array make sure to create at least one username/password set that has special characters (just use alphanumeric). This is so when you want to use your YOURLS API with TweetDeck, Twitter for iPhone, or any number of other Twitter services, you don't have a headache.

.htaccess Tip: You cannot use YOURLS in the same directory as other apps that make heavy use of URL rewrites, such as WordPress. Best to run YOURLS in as clean an environment as possible.

Step 3. Make the Home Page look spiffy. Obviously optional, but it took little time to change the default home page into our site's shell.

At this point you are all setup. You can now create short URLs yourself, even use the Bit.ly standard of adding a + at the end of the URL to see the stats (such as here). You can automate the creation of these short links for WordPress, and now Movable Type, and you can even use the API for your own YOURLS install.

If you are not using WordPress or Movable Type, and can't find a plugin for your needs, you can still make easy use of the API. Read this Gist. The only problem with that is that it would run every time the page was accessed, and it does not store the Short URL in a database. You would want to add the following to your config.php to disable flood blocking:

define('YOURLS_FLOOD_DELAY_SECONDS', 0);

There is a better way to handle this in Movable Type, Twitter Tools. I will cover that in a future post.

Third Party Tools

Lets setup YOURLS so you can easily use it with some third party tools. I will be using TweetDeck and Twitter for iPhone (Tweetie 2) as examples.

Step 1. Duplicate yourls-api.php and give it a unique name, something short. Edit this new file and delete the Line yourls_maybe_require_auth(); (this should be Line 4). This allows you to pass options to your API and not require a login. Typing the URL on a mobile device is hard enough as it is.

Using YOURLS with TweetDeck

In Preferences, go to Services and change the Short URL service from Bit.ly (or whatever it is currently set to) to Other. Now use the following URL as a template, modify the domain and the filename to the API file you just duplicated:

http://domain.com/filename.php?action=shorturl&format=simple&url=%@

Now pasting URLs into TweetDeck will use our own URL Shortening service.

Using YOURLS with Twitter for iPhone

Also known as Tweetie 2 before Twitter bought it. Go to the "..." button in the bottom toolbar and Accounts & Settings. Click on Settings, Services, URL Shortening. Select custom and very carefully type in the same URL used above, then hit Save.

http://domain.com/filename.php?action=shorturl&url=%@&format=simple

When you paste a URL into the New Tweet menu touch the little icon that displays how many characters you have remaining, and touch the Shrink URLs button. It will now shorten them using your YOURLS install!

Since we don't use WordPress, I can't speak for how easy it is to use that plugin, but it looks pretty strait forward. In my next post I will go over how to use Twitter Tools for Movable Type with YOURLS, which is what we do have setup for The BG News.

AnythingSlider for Movable Type

2010-08-29T04:34:35Z

Before the break for the summer semester, I sat down with Sean Shapiro and Heather Linder, or Web Editor and Editor-in-Chief, respectively, and we took a look at what they wanted to see on bgnews.com for the fall. Top of that list was an image-based carousel.

Feature-wise, the one we were currently using was not cutting the mustard. I took a good hard look at Agile Carousel, and even started writing Movable Type code to work with it. But its not exactly easy to use. Then I ran into AnythingSlider by Chris Coyier and eventually an even better fork of it by Dean Sofer on GitHub. That is the history lesson, now lets move on to AnythingSlider for Movable Type.]]> AnythingSlider for Movable Type consists of two plugins, one for changing all the settings of the carousel itself, and one for managing each slide. I am currently using this plugin on a few client web sites, bgnews.com being one of them, and am continuing to develop it - there are more options I want to expose in a Movable Type interface.

The download also comes with Mark Carey's TemplateInstaller, as I have created a set of templates, modules and widgets for AnythingSlider. Mark was nice enough to allow me to package his plugin in with mine.

AnythingSlider for Movable Type was written in Config Assistant for a couple reasons. Config Assistant makes development and upkeep a snap, and allows virtually anyone to make modifications to my AnythingSlider plugin. Say you want to use Pages instead of Entries in your carousel. This is a trivial change in the YAML code of the AnythingSlider plugin, and nothing else needs to be modified.

See the README for installing, including prerequisites. You will likely need to modify the CSS and the Template Modules to fit the size and style of your carousel. Currently there is an image-based slider, and an article-based slider (like on bgnews.com) installed with the Template Modules.

There is more to come soon, just watch GitHub for updates.

Fix WordPress Export User Interface

2010-04-27T03:00:00Z

Thanks to the CoPress Google Group and @nacin, my life in WordPress is that much easier. By about 100%. Let me explain.

The drop down menu on the Export page (in 2.9.1. and before) is an absolute mess. It does not list authors in alphabetical order. It lists them in the order they appear in the database. We have 10 years of archives to go through - that equates to a lot of authors! (Plus countless duplicates, thanks to the way College Publisher works.)

Quickly after posting my concern asking how to fix the $authors array, Andrew came up with a superb solution. You can find it on the WordPress Trac and make the modification yourself. This change will make it into WordPress 3.0. It also looks like the database query has been cleaned up quite a bit from the original code.

Many thanks to Andrew and his help. It has made the absolutely painstakingly headache-inducing task of going through our old College Publisher archives a little bit easier at the end of the day.

BG News Archives Update Feb. 19

2010-02-19T05:59:27Z

One of the biggest challenges in moving away from College Publisher has been the 10 years of archives we have had online. As I am sure you are aware, those were abruptly taken down in January.

Simply put, there was no other way to switch from their servers to ours.

We are working tirelessly to get the archive back online, and today I would like to share (a new) update on that. I sent out an update on our Facebook Fan Page on Feb. 8, and I wish I could say we have made progress since then.

Hit the jump to hear the (somewhat condensed) updated info.
]]>
Luckily I still had the CP4 export I had gotten in January 2009 from College Publisher, which does have authors and categories. So the import process had to be started again, from scratch.

Then when the CP5 era posts (January through December 2009) were imported, they lacked categories, a small problem with the import script. There was another problem with the media field, thanks to inconsistencies with the CP5 data structure. These issues have been resolved.

So the CP5 era posts have to be deleted and re-imported, again. This has been a very long process and I figured it would be a bear - and I was right! :/

Hopefully by Sunday I will have the CP5 era entries to work with, with categories. My job then requires me to combine categories and authors (some instances occur that we have 5 or 6 of the same author). Once that is done, I can load the articles into the live site on bgnews.com.

That is the best I can do for an update. I apologize to those who are seeking clips for resumes and job applications, or just searching for a past article. The best I can do is point you to our Issuu account.

As always, I will post here once there is a significant update.

The BG News is powered by Movable Type

2010-01-16T19:53:53Z

The launching of a web site is a stressful one, but the re-launching of one can be enough to kill you. Lucky for me things went smoothly in the wee hours of January 12 (and I am not typing this from the grave).

I would like to say the transition away from College Publisher has been a smooth one, but it in fact has not. Just today the domain name was finally transferred into our account, and it is still not resolving all over the Internets yet. And we do not have our database of past archives, last I talked to CP it looked like I would have them by Friday.

So if you are just tuning in, the entire BG Views Network of sites is running under Movable Type, including The BG News, which was previously partnered with College Publisher. We are by far not the first school to leave College Publisher in recent months, and no doubt won't be the last.

But this post is not about College Publisher, it is about Movable Type, and how we are using it to produce a daily newspaper online.
]]> The remainder of this post is going to seem a bit technical for some. Sorry, but you get no refund.

BG Views Network uses Movable Type Pro running under FastCGI, the actual BG News web site is made up of a number of "blogs." Movable Type Pro was required more for the Custom Fields than the community features, but those are a nice bonus. Here is the short list of MT plugins we use and rely on a daily basis. Some we could do without, some we could have gotten by with the "Lite" version, but in the end my goal in this re-launch was to not just match the feature set of our previous site, but exceed it - and we did that.

The Photo Galleries is built using Byrne Reese's Photo Gallery plugin, in a separate MT install that is not running under FastCGI. His template set switches menus and admin pages and because of how FastCGI caches the application, it just doesn't play nice. I hated to split Photo Galleries out like that, but it had to be done.

As with working with the Motion template set, it was much easier to port my existing BG Views design to Mid-Century (than incorporate it into my design), the theme the Photo Gallery plugin is built using. Using a secondary category archive and a Custom Field in the main BG News blog, I am easily able to embed a gallery within an Entry, such as here.

MT4 Custom Fields offer a lot, but I needed more, and as luck would have it, More Custom Fields by Dan Wolfgang offers just that. MCF is used a lot more in the Housing Guide, but the "Related Articles" you see here are one type of field the plugin provides. We actually use a lot of Dan's plugins; Better File Uploader is essential to sizing, thumbnailing, and lightboxing (in one fell swoop) photos for our Entry pages; Share is used for the "email to a friend" feature; and Poll Position is used for running polls in our blogs and in Entries.

The last "essential" plugin we use, and likely most important, is Byrne's Config Assistant plugin. Without it, updating things like the home page carousel, section pages, or breaking stories would take much more work for our news staff, and if I have one goal, it is to automate as much stuff as humanly possible. Config Assistant lets me do that, in spades. I need to do more with it, I just have not had the time.

There are plugins out there that will embed a Share This toolbar, but I felt it was much better to write my own, including using the bit.ly API for URL shortening.

The other plugin we rely on daily is Visitor Stats Pro, it provides our "Most Read" lists, and stats, referers, and search strings for our articles.

We use many more utility plugins from developers like Byrne and Mark Carey, too, they just makes my life so much easier.

The BG News has been online since 1998 and we have come a long way from hosting it ourselves in West Hall and doing the majority of the work in BBEdit. It is great to be publishing our site again, and Movable Type makes that a breeze.

Movable Type 5 Impressions

2010-01-09T07:09:59Z

It seemed like forever between the time MT5 was released in Japan at the end of November until it was just released in the U.S. We found out the day after, because of a security update to both MT 4.33 and MT 5, but they wouldn't tell us that.

Telling us it was due to "wanting more time for coordination of the release and associated documentation" was frankly bull shit. Sorry guys. There still is hardly any documentation, scouring FogBugz seems to have offered the best loot so far. MT5 was released 4 days ago, and I still cannot lookup information on mt:Websites tag or the parent/child/sibling modifiers, for example. The mt:BlogParentWebsite is another tag I would like to know more about, too.

Come on guys, I thought you were putting a big effort into developing better documentation.
]]>
Below is a list of what I like and don't like about what I have experienced with the final build. Now I am fully aware that some nut job is going to take my words and twist them around for personal gains, it happened before after all. Little piece of advice - don't be that nut job. I use the tool that is the best for the job at hand, that happens to be Movable Type.

Liked

New Website object is long overdue. It is a game changer for organization and coding alike.
Custom Fields for every object in the system, including Website, Blog, and Template. Blog level custom fields should have been there from the get-go in MT4. Setting custom fields on templates is also a time saver.
Revision history on everything. This is most welcome for template changes.
Batch Edit Entries, which was missing from the betas, is now back, thankfully!
They have made it very clear how entries/categories and pages/folders work together. Nothing has changed, it is just a much nicer way of displaying them.
Themes are an enormous update from template sets in MT4. I just wish there was better documentation on them so I did not have to reverse engineer the built in themes to develop an MT5 BG Views theme.
Assigning a sub-domain to a blog publish and document root is now easier than ever. It is a small tweak, but it is nice.
New Tool: Export Theme, which currently seems like the best option for designing your own theme. So there is no need for another TemplateExporter version.
While the Community template set still doesn't use the Facebook namespace by default, they have done a good job at restructuring some of the template modules, making them global instead of local.

Didn't Like

Would it have been that difficult to add Heading tags to the default Rich Text Editor? I know I can install others, but would it really have been too much to ask for a drop down menu of H tags?
Along the same lines, how about being able to toggle the window full screen for template editing? Yes, it is a bigger window, but the toggle would have been nice.
MT5 desperately needs a "Blog Mover" Tool at the System Overview level, especially because of the way MT4 is imported into MT5. This should not be that difficult to create, all the tool needs to do is offer a UI to manipulate the publishing and document root path of the blog.
We need a "Works with MT5" tag, or wiki page, or something started, that indicates what plugins work and do not work in MT5. This was done with MT4 and was very helpful.
Websites can only have pages, not entries. This is nice. But it is overly complicated when you just want a simple blog. Every Blog must be under a Website, and importing MT4 will produce just that, every blog inside its own Website.
I figured that MT5 would see the inclusion of native search support for Custom Fields. Currently the 3rd party CustomFieldSearch is the only solution for this.

I can't wait until I can upgrade BG Views Network to MT5, just for the new Website object alone. Being able to use the parent/child/sibling modifiers is going to be a boon for displaying data around the network.

I will keep this updated as I spend more and more time with the final version. Last updated 1/9/2010.

The Changing Face of Comment Spam

2009-12-27T07:49:38Z

It is hard to imagine, but I have been blogging for close to seven years now, and I have seen comment spam of varying degrees. It used to be pretty easy to spot. Services like Akismet and now TypePad AntiSpam are there to help - and they do - but even trained computers fail at finding spam. Both Akismet and TPAS have been failing me lately, let me show you why:

If you read that, it is actually mostly literate English. This is one of dozens of spam comments we have been getting. They usually do not put links in the body of the comment, that is so yesterday's tactic, but do use the Author URL to link to their spam site. And some of the spam sites don't even look like spam site - they actually take a careful eye.

Spam is getting smarter. This is scary.

One solution is to use a CAPTCHA source, such as ReCAPTCHA, but these can be defeated, I have seen it happen. The drastic answer to this problem is to just turn off anonymous comments altogether, but for us, that is not an option. We want people to comment, and registration drives some people away.

The only good answer is that it takes a lot of hard work to combat comment spam, and having good policies in place help, too. See our Privacy Policy, Terms of Use, and Comments Policy. You may think that is a lot of mumbo jumbo - and it is - but it is very important for our users to know where they stand.

Such policies are required to provide a safe, engaging place for the community to not only consume, but create and share content.

Database Move a Success, the Second Time

2009-10-04T00:54:25Z

On October 1st, can't remember now, I tried moving all databases including the one used for Movable Type from /var to /home, as it is a much bigger volume. Movable Type kept sending me to an infinite loop to the mt-upgrade.cgi script, then telling me everything was upgraded.

So I had to move everything back to /var and wait until the weekend. I moved it the second time, and everything is working again. I am glad I did not have to restore from a backup, I thought I had hosed the MT database. For what its worth, the Six Apart support could not give me any advice or answers to why I was getting the "Time to Upgrade" and then immediately "Your Movable Type installation is already up to date." endless loop.

YUI Editor 1.3 and Auto-tagging

2009-08-28T04:52:48Z

Richard Benson has updated his YUI Editor plugin (one of my favorite Movable Type plugins), and it has two great changes/additions. First, and not so exciting for most people, is the configurable options, normally handled in a configure.js file, has been moved into Plugin Preferences. But hey, that does make it easier to change things.

The thing that people will notice most of all is the new Tag button which will analyze the current text and suggest tags for the article. This is great for people who don't know what they should use as tags. It does a really good job, and works on the text in the Body and Extended field without having to save the document first.

Final 'Tweet This' Bit.ly Script

2009-08-13T07:12:32Z

Thanks to the WebmasterWorld forums, my Tweet This script opens in a new window now. I am pretty happy with it. I am not very happy with Safari though. Firefox warns you when an onClick action tries to run window.open, Safari just plays dumb and does nothing.

Download Script

Using the ShareThis API with Movable Type

2009-08-08T16:48:59Z

Yesterday (or was that this morning) I posted about adding your own "Tweet This" button to your blog. Today I will explain how you can better control the ShareThis button, and use some Movable Type template tags to do your bidding. This uses the ShareThis API and could easily be used with any CMS, not just Movable Type. Hit the jump for all the scary code.
]]> briefly described here. The example on that page is half of what we need. First add this to your global HTML Head template:

Mine is modified from that, you can view the source code of this page to see my changes. You can basically copy all the parameters from the auto-generated code block you get from your account and add them here.

Placing the ShareThis icon on your page can be done using inline CSS and images, or external CSS. I went the quick and dirty rout, but will likely clean it up soon.

Place the above code on the page where you want the image to show up. I put this in my Entry Detail template.

Social Bookmarking Links

2009-08-08T08:13:42Z

I have not made up my mind yet, so far we have been using ShareThis for social bookmarking links, for submitting to sites such as Twitter, Delicious, Digg, etc. I think I would rather pick the few that are the most important and write them myself into the site.

I am going to start by doing that with Twitter. Thanks to a post on the MT.org forums, posts now have a quicker way to add links to Twitter. It uses the bit.ly API. You just need to signup for an account to get an API key. Hit the jump to see my modified code.

Another option is to use TweetMeme but their badge is pretty big, and I wanted something less obtrusive.]]>

" onClick="BitlyClient.shorten(document.location, 'BitlyCB.shortenResponse');">

Setting Up RewriteRules for Profile and Tags

2009-08-07T04:15:15Z

I am adding .htaccess RewriteRules for all the domains we have so we have pretty clean URLs like this one:

http://bgviewsnetwork.com/profile/meancode

That is done by doing this:

RewriteEngine on
RewriteRule ^profile/(.*)$ /mt/mt-cp.cgi?__mode=view&blog_id=49&username=$1 [P,L]

Add a new RewriteRule for each domain you have. Just change the BlogID. Note I am not making a /profile/ RewriteRule for each blog, just one per domain. This also makes the profile_view_url template variable of no use anymore. Now, to modify the Entry Metadata template module, use this for your link:

<$mt:EntryAuthorDisplayName$>

Next on the list of pretty looking URLs are tags. I have both of these changes live on the Sports Blog. It will be live on every blog once I get the RewriteRules done, of which there are a lot - one for each blog in the system, no matter the domain. So now we have URLs such as this:

http://bgnewssports.com/tag/curtmiller

That is done by doing this:

RewriteEngine on
RewriteRule ^dev/tag/(.*)$ /mt/mt-search.fcgi?blog_id=41&tag=$1 [P,L]
RewriteRule ^tag/(.*)$ /mt/mt-search.fcgi?blog_id=49&tag=$1 [P,L]

Add a new RewriteRule for each blog you have. Just change the BlogID and path. Now, to modify the Tag Cloud widget, use this for your link:

" rel="tag"><$mt:TagName$>

It is worth noting that even tags that have spaces, such as "movable type" or "curt miller" work with the normalize attribute (which takes out spaces). Pretty slick.

iMT won't work with FastCGI

2009-08-07T02:55:56Z

iMT is the iPhone interface for Movable Type. Thankfully the CSS has been updated for iPhone OS 3.0, but alas, it won't work with FastCGI. This seems to be the same issue I am having with the Photo Gallery template set I am having, dynamically changing files don't work when the MT app is cached.

In this instance, the CSS and templates for the new entry screen will stay as the "mobile" version if they are accessed on an iPhone, even when viewing it on a desktop browser. So no more iMT for BG Views Network. Oh well.

Photo Gallery and FastCGI

2009-08-04T23:58:10Z

FastCGI has claimed its first victim. Byrne's Photo Gallery template set, and any other that dynamically switches the menu in Movable Type, does not work well with FastCGI. Since MT is cached into memory, every time I want to edit our Photo Gallery I have to restart Apache, this is not optimal. At all. Sadly I don't think there is anything that can be done. For those not familiar with the command line, this is how you restart Apache:

service apache restart

I don't want to leave you with nothing to look at, so I will leave you with this: a close-to-complete Entry template for our photo gallery. That URL will be broken soon, so if you are reading this very much past August 4, just look at the main Photo Gallery site. I have a little bit more work to do yet, but I have essentially taken the Mid-Centry Photo Gallery template and added the needed CSS to make it look like our BG Views site. Still having problems with commenting, though.

Byrne has released 2.4.2 of Photo Gallery which he states adds FastCGI support, but still requires a restart of Apache.