Groupon is bad at lying

It seems Groupon is a horde of liars. I’ve compared the ‘total value’ price on multiple offers and found each one to be inflated. Consider this offer on an AB ‘Beer School’ brewery tour

groupon beer school offer
Groupon beer school offer

Two tickets and a $15 credit at the gift shop for $44 dollars with a $68 total value listed. However, buying this straight from the Budweiser tour website

ab-tour
Same offer, right from the seller

would look like this:

$15 x 2 (tickets) + $15 (gift shop) = $45

Groupon advertises I would save $24 when I would only save $1. Unacceptable.

JSConf 2014

I had the privlidge of attending JSConf 2014 with the always-classy @wilson353. Here is the recap in pictures.

And a panoramic:

the marsh panormic Panoramic of The Marsh

And a few videos:

Questions to Ask in a Design House Interview

I’ve been on the design house scene for the better part of a year now. As a new team member joins the company today, it brings to mind some questions I wish I would have asked prospective employers during my interview:

  • How often do developers get new workstations?
  • Do your devs have dual HD monitors?
  • How would you rate your office internet access on a scale of 1-10?
  • What does the process of reporting weekly time look like? Can I watch someone enter their time right now?
  • What versioning system will I be required to use for each project, if any?
  • What training & professional development resources do you offer? Does this include attending conferences?
  • Do I have the option of working on a Mac or are you PC only?
  • Can I speak with your best developer about the competency of your team on the whole?
  • When is the last time someone was fired, and what were they fired for?
  • Can you give a synopsis of the best project and worst project of this past year, and how they earned their titles?

Anyone else have questions they would have asked?

EDIT:

Here is another gem – “Describe a time when one of your teams made a short-term sacrifice for a long-term gain?

Prefixing a Custom Taxonomy in WordPress

I’m currently working on a website with a custom portfolio section. It’s making use of a custom post type called project and two attached custom taxonomies called market, and service. The portfolio page exists here:

example.com/portfolio/

displaying all the projects. Each project live here:

example.com/projects/<project-slug>

Everything was going fine until I realized that my custom taxonomies were not as separated from the main blog as I would like them to be. Consider the following taxonomy archive URLs:

example.com/market/<market-slug>
example.com/service/<service-slug>

and the very similar pages already on the site:

example.com/services/
example.com/services/service1
example.com/services/service2

etc. What I needed to do was to group the taxonomy archives under the portfolio page in the URL structure, turning

example.com/market/<market-slug>

into

example.com/portfolio/market/<market-slug>

But how does one prefix a custom taxonomy URL in WordPress with a static value such as ‘/portfolio/‘ ? The answer is pretty easy, it turns out.

Put That Slash in the Slug

All you need to do is add the static prefix value to the slug portion of the rewrite argument when registering the taxonomy. For example:

$serviceArgs = array(
		'labels'     => $serviceLabels,
		'query_var'  => 'service',
		'rewrite'    => array( 'slug' => 'portfolio/service' ) //was 'service'
	);
	register_taxonomy( 'project_service', null, $serviceArgs );

After you make the update, flush your rewrite rules and you are good to go!

More info on register_taxonomy().

Restoring a single WordPress site to a Network

I’ve been attempting to move my localhost development copy of a WordPress environment to a test site on a client’s server. When talking it over with the team, we decided that the test site should be a WordPress network with one site for testing, and one site for production. This will allow for a much more manageable environment in the future, but presents an initial problem.

The Problem

I want to do a database transfer from my localhost WordPress install to a web server running a WordPress network. However, I can’t blindly drop the DB and import my own because multiple options are set differently and there are extra tables in the network DB. I would use an export / import with the XML file, but that wouldn’t be able to download my media files, not to mention the plugin configuration & widget settings.

7 of 9 from star trek: voyager
“Insufficient”

After mulling it over a bit, the easy solution hit me.

The Solution

Why not first restore my localhost WordPress DB to a single install on a web server, then use the export / import XML on the network! I’m still out the plugin settings, but at least my media files can be downloaded. For this particular project, the site had hundreds of media files and 1 plugin, so I figured that option was close enough. Here are the steps I took in list form:

  1. Export localhost DB
  2. Install a single (non-network) WordPress on a web server
  3. FTP plugins, themes, and uploads to the single site
  4. Drop / Import the localhost DB to the single site
  5. Edit the DB to replace all URLs as appropriate -> eg change all “localhost:1337/dev” instances to “example.com” (I like this tool)
  6. Create the export XML from the single site ->Dashboard > Tools > Export
  7. Import the file to the appropriate site on the network, selecting to download file attachments after the upload
    wordpress import media files
  8. All done. Yay!

 

A Responsive Theme

I was in OfficeMax the other day looking at new tablets and saw a setting on a tablet’s browser that said “format web pages to fit this screen”. That was the scariest setting I have ever seen in my life. Whereas styling and formatting have previously been solely in the hands of the web designer – it is now shifting to the user. Thus the age of the responsive website is here.

With the appearance of tablets, iPhones, and Andriods, the idea of a website being viewed at a single, desktop-sized resolution is going the way of the chimney sweep and IE6. Websites must be able to adapt fluidly to multiple resolutions or respond, rather, to different screens.

Redesigning my portfolio website seemed like a good way to get my feet wet in responsive web design, primarily because I now have a smartphone and time to kill. Let me show you what I’ve done to danielhoenes.com. The pictures are about to get meta in here, so hold on.

First

Firstly, some decision making was in order. I was really fond of my WordPress theme, Showcase, because of it’s attractive typography and custom post types (projects & portfolios). However, it had a nasty habit not being responsive. I decided to remake Showcase instead of starting with a new theme from sratch. The goal was to make it better, stronger, faster, etc.

front page desktop
A screenshot of the homepage, in desktop form

Showcase used a 960px grid for layout, but immediately that wasn’t going to work, so I went through  all the theme files and restructured (more-or-less) the grid to use percentage-based widths, margins, etc. Thankfully, there were a few good tutorials on fluid layouts and styling techniques.

In case you are curious, the page’s wrapper element gets a max-width set in ems (a relative unit) and all its children follow the formula “target / context = result”.

Second

Secondly, it was just a matter of deciding how I wanted it to look on devices with narrower screens. The best source of inspiration for this was an exciting website I found on the topic, mediaqueri.es. I’ve taken my best guess on the ideal content flow and pushed the sidebar past the main content for tablet widths and smaller.

front page tablet
A tablet-sized view of the homepage.

Heavily using the float:left; css, I was able to make the discrete page elements play nice with each other in tight spaces. With two out of three formats down, all I had left was phone-sized styling. Thankfully, it wasn’t much different from the tablet rules.  I changed some heading text sizes and margins, but nothing major.

front page phone
A phone-sized view of the homepage.

One last noteworthy item would be the issue of image resizing. When you get down to the low width of a phone screen, some images are bigger than the page can handle. While there are 22 ways to handle responsive images, I chose a simple WordPress Plugin (WP Fluid Images) for the present time. Though if anyone would like to discuss techniques in the comments, I’m all ears.

DH

Epic Swing Combo

Swing Dance Video (Flash)

This is a video of Ally and I one night at Lindenwood’s Swing Dance Club. The moves excluding basic steps and turns are:

  1. Pretzel (twice)
  2. Sliding Doors
  3. Tandem Charleston
  4. Air Guitar
  5. Boogie Swivels
  6. Floor Slide
  7. Mop
  8. Humiliation
  9. Freestyle
  10. Airplane
  11. Side Flip
  12. Around the World (twice)
  13. Shoot the Moon
  14. Cliffhanger
  15. Pancake (low)
  16. Pancake (high)
  17. Dip over knee
  18. Cradle Flip
  19. more random stuff
The songs are ‘DC-10’ by Audio Adrenaline and ‘Mr. Pinstripe Suit’ by Big Bad Voodoo Daddy. We didn’t practice or rehearse this routine. It was more of a “hey, we should record all the moves we learned this semester”. Thus, every few moves you can see me pulling out a notebook on which all the moves are written. Also the few moves we messed up.
More to come.

 

Advanced Links

So, I’ve spent most of the day with my good friend, Mr. Anchor Tag, and I thought I would share something I have learned about him today. Primarily…

Slashes Matter

Quick, what is the difference between <a href=”page.html”> and <a href=”/page.html”> ? It’s totally the beginning slash (/) before “page”. But does this make a difference? Turns out, yes it does. The first link without the slash is a  relative link – the server will give the requested file from the same directory as the file that contains the link. The second link containing the beginning slash is called an absolute link. This means that the server will start from your website’s document root (www.example.com) instead of the current directory. For example, suppose the page containing these links is located at www.example.com/stuff/index.html. The link, <a href=”page.html”>, will go to  www.example.com/stuff/page.html if the server has it. However, the link, <a href=”/page.html”> will go to www.example.com/page.html.

But What Does This Mean?

I’m Glad you asked. Suppose you are editing a page that is going to end up at danielhoenes.com/2011/12/archives/whatever/tag/blah or perhaps you are using a web application or CMS that is going to display your page at different URLS. The shortest way to link to a fixed resource (such as danielhoenes.com/logo.gif) is to use the /absolute link. No matter which sub directory your page gets put, the static resource will be found. You could also just include your whole domain in the link (http://www.example.com), but that is at least 10 extra characters and another problem. Domain dependency. Suppose you are now sitting between multiple domains. Your client has said “hey, I’d like to use this theme you are making me on tomatos.com and relish.com. Can you make that happen?” Well, with the absolute link – you can.