Lake Placid timelapse

In the playlist below, there are 4 time lapses that I took while vacationing in Lake Placid. My wife and I stayed at the High Peaks Resort and these time lapses were taken from our balcony.

Equipment/tools used: Nikon D5100, Amazon basics tripod, Adobe After Effects

I shot all the photos as RAW, then used After Effects for post processing.

Sharing content between Drupal multi-sites with RESTful and Feeds modules

At Oswego, when we decided to go with Drupal multi-site, one of the biggest drawbacks was the ability “out of the box” to share content between sites. But when you think of it, how much of Drupal works just as you’d like right out of the box? We looked at a few options but what we ended up settling on was a combination of modules that is doing the trick nicely.

Problem

We have a branch campus that needs to pull in program information from another site (graduate studies). The branch campus editors should not be able to edit the content being brought in since they are not the content experts on the subject. Graduate studies maintains the “master” content, then needs to be periodically pulled into the branch campus site. Then, using views we can display a list of content that we pulled in.

Solution

Being a semi-Drupal-newbie, this took quite a bit of trial and error before I figured out something that will work. If you know of another solution to this, by all means leave a comment! I’d love to hear it.

First thing I did was set up the RESTful module on the graduate studies site. This module makes it very easy to be able to expose our graduate program data as a read-only REST endpoint. I experimented with exporting it as RSS, or trying to build something to export the graduate programs as CSV or some other form of structured data but ended up going with JSON via the REST module. JSON is so widely supported, readable, and consumable by so many other applications that it seemed like it was the best route to go.

I’m currently working on a post about setting up the RESTful module! Sign up for email updates to get notified.

The feeds module alone doesn’t consume JSON, but luckily there is a really nice module called Feeds Extensible Parsers.

I’m also working on a post about setting up the Feeds Extensible Parsers module to read JSON!

I currently have it set up to update the branch campus’ program content every 3 hours. Using Drupal’s role and permissions, I can configure it so the branch campus editors can only read the program content, keeping it in sync with the “master” copy.

Where do you see yourself in five years?

This is a question I’ve been asking myself lately over the past couple months. I’ve never really thought about my life long term. In my late teens / early twenties I was mostly concerned with having some individual freedom. From my early to mid/late twenties I was mostly concerned with partying. From my late twenties until now (currently 30), I’ve been concerned with learning as much as possible. At 26 I went back to school for information and computer science and for the past 4 years I’ve been learning so much. Even on a month to month basis I’m realizing I know so much more than I did the previous month.

I’m reaching a point, however, where instead of just grinding away day to day on the task at hand, I think it’s a good time to take a step back and think about strategy. How can I position myself to be in the best position for my own well being and stability? In order to answer this, I think it helps to envision yourself in 5 years. Picture — in your ideal world — where you’re living, what you’re doing, and how you’re feeling. Then construct a long term plan to get you there within 5 years.

Where I see myself in five years

In five years, I’ll be 35 years old. I’ll be coming up on 10 years of solid web development experience. I have a master’s degree in Human-Computer Interaction. Professionally, I’ve spent the past five years honing my development and organizational skills. I’m a much better problem solver than I was in the past and am excited about solving new problems in an efficient manner. Constructing interfaces and experiences that people use and enjoy helps me wake up excited every morning.

I’m working remotely for a distributed company doing some kind of front-end development/UX work. I sometimes work long days, but I enjoy the challenge and am compensated appropriately. My wife and I are living in a home in the country. Not too far into the country, but far enough not to outside street and foot traffic outside our home. Far enough into the country to hear absolute silence at night and get a clear view of the stars. But not too far in the country to disrupt broadband internet access.

At this point in my life, I’m at a crossroads. I wonder whether I should keep doing development work or begin focusing on project management and bigger picture issues. I’ve also thrown around the idea of going back to school for my PhD to become a professor. Learning and growing is still extremely important to me.

I’m much more health conscious than I was in my late 20s and early 30s. A routine runs my life and keeps it in balance. Much of our food is sourced from the garden outside our home. I have a regular exercise routine and enjoy the energy it brings me.


 

I don’t want to get too specific, but I believe this is a good blueprint for where I’d like to see myself in five years.

Making it happen

Professionally, I’m going to keep doing what I’m doing. I’m going to work hard and learn as much as I can. I’m going to try as hard as I can to be a unicorn.

In addition, I will be spending a set amount of time to external projects. Committing at least 5 hours per week to open source or side projects will help grow my skills. I wish it could be more, but for now I have to start with something realistic.

Creating a hero page template in Drupal

Prerequisites

  • Using Panopoly + Panels + Panelizer

Our current sub-pages look like this:

Screen Shot 2015-04-30 at 3.56.24 PM

 

Drupal is really good at having a consistent header throughout the site. But what if you want to have a landing page that looks like this:

Screen Shot 2015-04-30 at 3.58.00 PM

At first this seemed impossible to me, but after reading about theme_hook_suggestions and preprocess functions, I began to see the light.

  1. Create Hero Landing Page content type with appropriate fields
  2. Create image style to ensure the image is always the right size for the hero area
  3. Add theme_preprocess_page function to grab the image from the node
  4. Add a theme_hook_suggestion to load a different page template file
  5. Disable the hero image field in the default panels
  6. Profit

1. Create Hero Landing Page content type with appropriate fields

You don’t technically have to create a separate content type, but you do need a specific field to hold your hero image. I created a separate content type for landing pages because our landing pages will have some differences from basic pages within our system.

First thing I needed to do was create a “Hero Landing Page” content type that would be able to crank these types of pages out. Within this content type, I created a “Hero Image” field that would be used to hold the appropriate image. Keep note of the “field_landingpage_hero_image” field. That’s what we’ll need later to grab our image.

fields2. Create an image style for the hero image

If you don’t create an image style, you’ll be stuck with Drupal’s defaults which probably won’t suit your needs. In our case, we need the hero image to be 1920px x 768px in order to fit nicely within the theme. Navigate to admin/config/media/image-styles and create a new Image Style called “Landing Page Hero Image”. Under “Effect” choose “Scale and crop” and enter in 1920 for the width and 768 for the height. Once we apply this image style to the hero image field, this will take any image the user uploads and wrangle it into those dimensions.

image_style

3 + 4. Pull out the hero image so we can use it within our page template file & and a theme_hook_suggestion

Using Drupal’s hook system, we can override the template_preprocess_page() function to grab the hero image (if it exists) and make it accessible to the page template file. The way template_preprocess_page works is, you substitute your theme’s machine name for the word ‘template’, and pass in a reference to the $variable’s array. Now within the function you can play with the variables that Drupal is about to render on the page.


/**
* Implements template_preprocess_page().
*/
function oswego_preprocess_page(&$variables) {

  // Check to see if a hero image field is set
  if (isset($variables['node']->field_landingpage_hero_image[LANGUAGE_NONE][0])) {

    // Store the image into $img for easy reference
    $img = $variables['node']->field_landingpage_hero_image[LANGUAGE_NONE][0];

    // Build the $hero array to be used in templates/page/page--hero.tpl.php
    $variables['hero']['path'] = image_style_url('landing_page_hero_image', $img['uri']);
    $variables['hero']['alt'] = $img['alt'];
    $variables['hero']['title'] = $img['title'];

    // Add a theme hook suggestion to load templates/page/page--hero.tpl.php
    $variables['theme_hook_suggestions'][] = 'page__hero';
  }
}

Note the function ‘image_style_url’ that is being called. The first parameter takes the machine name of an image style. In our case, we created our image style in step 2, so I’ll use the machine name of that image style. The function will then return the URL of the image using the specified image style.

By making a $variables[‘hero’] array, we can now access items within it on our page template file using $hero. For example, $hero[‘path’] will point to the URL that image_style_url built in our preprocess function. You can see within the code comments above that I make reference to a file called page–hero.tpl.php. By adding ‘page__hero’ to $variables[‘theme_hook_suggestions’], Drupal will now look for a page template file named page–hero.tpl.php.

Copy your existing page.tpl.php and name it page–hero.tpl.php. I won’t go into the specifics of how I used CSS to style it, but now it is possible to add the hero image in the new page–hero.tpl.php file. Example:


<div class="hero-image">
  <img src="<?php print $hero['path']; ?>" alt="<?php print $hero['alt']; ?>" title="<?php print $hero['title']; ?>">
  <?php if ($title): ?>
    <div class="hero-header">

    <div class="row">
      <div class="section-title-container">
        <div class="section-title-inner">
          <?php print $breadcrumb; ?>
        </div>
      </div>
    </div>

    <h1 class="hero-title"><?php print $title; ?></h1>
    </div>
  <?php endif; ?>
</div>

Disable the Hero Image within your panels configuration

This step will differ greatly depending on how you’re using panels/panelizer. For us, we have a default template that the content type goes into. By default I disabled the node:field_landingpage_hero_image pane so that the image wouldn’t display twice and confuse editors.

disable


And that’s all! Quite a different process than I’m used to when I used to make WordPress themes, but still very effective. Drupal’s powerful hook system allows you to tap into the process and modify data, giving a themer and developer a ton of control. Drupal’s ability to separate logic (template.php) from the theme (*.tpl.php) files is pretty nice as well.

A local Oswego counseling practice gets a website

Heather Rice CounselingMy wife, who is currently in grad school studying mental health counseling, is logging practicum hours with a local practitioner. Their old site was in Wix and had terrible SEO value and wouldn’t properly display on mobile phones. To remedy this, I whipped up a WordPress theme using Bootstrap v3, and gave them a fresh new site to build their practice off of. The site features a blog, which will educate the community on topics relating to mental health. Heather Rice, who offers counseling services in Oswego, NY, now has a simple new website built on WordPress that can grow with her business.