May 27 2016
May 27

Easy Drupal Development with Drush ScriptingWhether you work on one Drupal site or multiple, it is often necessary for your local dev environment to be slightly different from your site's server.  Perhaps you need to disable Secure Pages because you don't want to set up SSL on your local environment, or there are modules specific to your website's server config.  If you work on multiple sites in a sporadic fashion its possible you need to synchronize your local database with the dev server between tasks, that way you aren't missing any updated configurations.

Sure, you can pull this off manually by grabbing the database, reloading your local, and updating your Drupal site's config; but why not add a little automation to help out?

Using a Shell Script with Drush

Recently I was setting up a local environment and had the opportunity to use a script created by Colan Schwartz. If you are running Linux or OSX then you can easily use this script and modify it to your own needs.  If you haven't done much shell scripting, or you use an alternative OS such as Windows, you may want to get a quick overview from howtogeek.com

Now that you're an expert on shell scripting you should check out Colan's very well documented script on gitlab. You may need to update the command path variables

# Set command paths.
DRUSH=/usr/local/bin/drush
GZIP=/bin/gzip
CUT=/usr/bin/cut
GREP=/bin/grep
ECHO=/bin/echo
DATE=/bin/date
SUDO=/usr/bin/sudo
CHOWN=/bin/chown
ID=/usr/bin/id
MKDIR=/bin/mkdir

Also, the default USER_WEB settings may be incorrect for you setup and your web server user is not one of: php-fpm, nginx, apache, or www-data.

The MODULES_DISABLE variable controls what modules are disabled on your local environment, and you can modify MODULES_ACQUIA and MODULES_ADVAGG with your own variables and module lists.  

If you'd like to test out the script make sure you have a backup of your code and databases.  Once you get the base settings adjusted for your setup, updating the settings for subsequent sites will be quite easy.  Running the script executes the following commands:

  1. Saves a cache-cleared dump of the destination database (DB) as a backup.
  2. Overwrites the destination DB with the source's.
  3. Updates the DB schema.
  4. Imports the latest configuration saved in code.
  5. Disables modules that shouldn't be enabled during development.
  6. Enables modules that are helpful for development.
  7. Clears all caches.
  8. Overwrites the destination's files directory with the source's.
  9. Runs cron.

I hope this helps your development workflow, if you were able to adjust the script for your specific setup please share your results.  Happy scripting!

Some additional items:

If all you need to do is rebuild your local dev environment then check out this cool project which turns the process into a simple drush command: Drush Rebuild.

Here are a few other scripts that you might find useful or inspirational:

Jan 29 2014
Jan 29

So a client wants a slideshow. No problem! Oh, they want full WYSIWYG for the captions. No problem. What about an option to let a user grab embed code? Easy. It must be responsive, full screen option, attach to nodes, hide and show captions, add branding logo, and make sure you can attach AND embed on the same page. Sure, done deal. Right?

A Drupal Slideshow

Turns out it was a bit larger of a project than I first expected. After researching various slideshow modules I was unable to find a drop-in solution that fit every requirement, so I decided to go start with the basic Views Slideshow and extend from there. From a previous project I knew that it was possible to make a standard Views Slideshow responsive, and with some jQuery / JavaScript I could make the necessary updates to the styling.

Creating the Content Type

I started out with a new content type using field collections in order to streamline the user interface. With field collections the user would be able to manage all the images from one location. The wrinkle came with the “attach to node” requirement. This was accomplished using a node reference, however this made it much more difficult to use field collections.

After asking around I was pointed towards using the standard one node per slideshow item, but this made management much more difficult and would rely on Nodequeues, or something similar to manage the display order. Thankfully Phil, a very knowledgeable member of our team, suggested Inline Entity Form. If you have not heard of this module, check it out. It is great for content management!

Inline entity form screen example

So now I could create a single node to house all the fields for images and WYSIWYG captions, and users could create and attach new slide items from the node edit interface. That still leaves a lot of nodes, but management of each slideshow remains simple.

Building the View

Once the content type was in place I could begin creating the actual slideshow. The end result was a standard Views Slideshow using jCarousel for the pager, and some custom jQuery for extended functionality. The View had two displays:

  1. A Block display that attaches a slideshow to a regular content node via node reference.
  2. A Page display that uses a blank template to embed the slideshow without any of the original site theme.

From here it was a matter of custom CSS and jQuery to build out the rest of the functionality.
Slideshow with embed code displayed

Responsive Layout

From a previous project I had learned that with styling updates a regular Views Slideshow could be made responsive. There was one tricky issue that occurs with images any time you want to have them responsive. Do you use the height or the width to 100%? You can't do both, or your image will skew according to the container size. If you choose width 100%, then any portrait type images will become taller than their landscape counterparts, and either get chopped off or bump the page content all over the place. Custom jQuery to the rescue!

After some fiddling around it also became clear that jQuery could apply CSS changes to not only handle the width/height issue, but to create the full window effect and handle simple buttons to show/hide captions. By processing the aspect ratio of each image and comparing it to the average I determined which images should be width: 100%, and which should be height: 100%.

Finally, using the slideshow node ID I was able to create a URL for the Page display of my View, and thus create the iframe embed code for a user to copy. Some small customizations and styling fixes here, some debugging there, and I had a working slideshow!

What customized slideshow have you put together?

Slideshow in fullscreen

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web