Drupal

Announcing TWBS jQuery: Simple jQuery Update for Drupal 7

During TWBS development upgrade Drupal 7 core jQuery libraries into its latest version for Bootstrap is a must. BTW jQuery Update seems not my cup of tea because it give me too much trobule within previous site building experience: too complicated, bundle everything within its own archive (which I love to manage 3rd party libraries with drush make and Libraries API), and it is really too much for my use case. So why not just work out a simplified version?

After some research and development during Christmas holiday, I would like to introduce my helper module named "TWBS jQuery". The goal of TWBS jQuery is to provide a handy support for jQuery upgrade and act as the helper module for on going Drupal-Bootstrap-Remix development.

All replacement will be handled automatically. No additional configuration is required.

Key Features

NOTE: We don't officially support overlay.module as deprecated in favour of using together with TWBS.

Getting Started

Download and install with drush manually:

drush -y dl --dev twbs_jquery
drush -y make --no-core sites/all/modules/twbs_jquery/twbs_jquery.make

Package into your own drush .make file (e.g. drustack_core.make):

api = 2
core = 7.x
projects[twbs_jquery][download][branch] = 7.x-3.x
projects[twbs_jquery][download][type] = git
projects[twbs_jquery][download][url] = http://git.drupal.org/project/twbs_jquery.git
projects[twbs_jquery][subdir] = contrib

Live Demo

TWBS jQuery is now integrated into DruStack distribution, so you can try it in a live sandbox with simplytest.me.

Why Another jQuery Module?

For general and generic jQuery update functionality, you should always consider another jQuery Update module which started since 2007-04-26.

On the other hand you should consider about using this module because of:

  • Purely design for assist TWBS, which means you will have the best compatibility when using both together
  • Fetch libraries directly from original repository and handle initialization with Libraries API; jQuery Update bundle all libraries into it's own code repository and initialize manually
  • Only support latest official version of libraries which result as no additional configuration required; jQuery Update support multiple version of jQuery
  • Much simple implementation which handle all upgrade and replacement automatically; jQuery Update provide more customization options

Author

Please feel free to test it out and comment with your idea. Let's enjoy simplified jQuery update experience ;-)

Announcing TWBS LESS: Simple LESS Support for Drupal 7

During TWBS development I figure out that introducing LESS support in Drupal 7 would be a great idea when combine with Bootstrap and Font Awesome. After some research and development during Christmas holiday, I would like to introduce my helper module named "TWBS LESS". The goal of TWBS LESS is to provide a handy support for LESS and act as the helper module for on going Drupal-Bootstrap-Remix development.

Add your files just like any other CSS file, just with .less as the extension, and they will be automatically processed. No additional configuration is required.

Key Features

  • Provide drush make file for library download
  • Confirm library successfully initialized with hook_requirements()
  • Support both LTR *.less and RTL *-rtl.less, as like as that of locale_css_alter() supported
  • If Drupal's CSS aggregation enabled, all .less will automatically pre-compile as .css at server-side by lessphp before Drupal CSS aggregation
  • If Drupal's CSS aggregation disabled, all .less will link with rel set to "stylesheel/less" individually, so less.js will handle in client-side live- compile
  • Support FireLESS for .less debug with Firebug in client-side compile mode

Getting Started

Download and install with drush manually:

drush -y dl --dev twbs_less
drush -y make --no-core sites/all/modules/twbs_less/twbs_less.make

Package into your own drush .make file (e.g. build-drustack.make):

api = 2
core = 7.x
projects[twbs_less][download][branch] = 7.x-3.x
projects[twbs_less][download][type] = git
projects[twbs_less][download][url] = http://git.drupal.org/project/twbs_less.git
projects[twbs_less][subdir] = contrib

Live Demo

TWBS LESS is now integrated into DruStack distribution, so you can try it in a live sandbox with simplytest.me.

Why Another LESS Module?

For general and generic LESS support you should always consider another LESS CSS Preprocessor module which started since 2010-03-04.

On the other hand you should consider about using this module because of:

  • Purely design for assist TWBS, which means you will have the best compatibility when using both together
  • Support both server-side pre-compile / client-side live-compile with debug mode enable; LESS CSS Preprocessor support server-side pre-compile
  • RTL support with *-rtl.less just as simple as CSS *-rtl.css that Drupal core supported; LESS CSS Preprocessor RTL support will work as long as your files are named "somename.css.less"
  • Server-side pre-compile CSS will name based on its original .less md5_file() result, which means even you add a single space the cache file will also be regenerate; LESS CSS Preprocessor calculate based on filemtime()
  • Much simple implementation which handle all LESS support automatically as like as that of Drupal core CSS support; LESS CSS Preprocessor provide more customization options

Known Issues

IMHO, below limitation as not directly due to our current implementation:

  • Can't package into Drupal distribution hosted under drupal.org GIT repository directly (but able to include into your own build-*.make or simplytest.make), because:
  • LESS variables and mixins that defined by other else module/theme can't be reuse directly (e.g. You can't reuse . fa mixin that provided by TWBS Font Awesome into your own module/theme), because:
    • If using server-side pre-compile, all LESS/CSS should be sorted in correct order, all url() and @import should replace as correct absolute URL, and aggregated into a single-fat-file before compile into CSS at once
    • If using client-side live-compile, external .less should be referenced by @import with absolute URL correctly

Author

Please feel free to test it out and comment with your idea. Let's enjoy simplified theme development with LESS ;-)

Sync Drupal Distribution Profile With GIT Managed Project

As managing my Drupal distribution - DruStack, with both Drupal.org version and GitHub version, one of the daily duty is to keep their submodules in synchonize. E.g. in case drupal-org.make say we would like to fetch drustack_core as below:

projects[drustack_core][download][branch] = 7.x-23.x
projects[drustack_core][download][type] = git
projects[drustack_core][download][url] = http://git.drupal.org/project/drustack_core.git
projects[drustack_core][subdir] = drustack

In GitHub submodule I need to check out the corresponding branch with "7.x-23.x". Moreover, in case drupal-org.make say we would like to fetch multiflex3 as below:

projects[multiflex3][subdir] = contrib
projects[multiflex3][version] = 3.2

In GitHub submodule I should check out the corresponding tag with "7.x-3.2", too.

So How to sync it in a handy way?

cat profiles/drustack/drupal-org.make | grep branch | while read LINE; do \
    echo $LINE; \
    PROJECT=`echo $LINE | sed 's/projects\[\(.*\)\]\[download\].* = \(.*\)/\1/g'`; \
    BRANCH=`echo $LINE | sed 's/projects\[\(.*\)\]\[download\].* = \(.*\)/\2/g'`; \
    GIT="git --git-dir=`find . -type f -name '.git' | grep \"\/$PROJECT\/\" | grep -v libraries`"; \
    $GIT fetch; \
    $GIT checkout $BRANCH; \
    $GIT pull; \
    $GIT status; \
done

cat profiles/drustack/drupal-org.make | grep version | while read LINE; do \
    echo $LINE; \
    PROJECT=`echo $LINE | sed 's/projects\[\(.*\)\]\[version\].* = \(.*\)/\1/g'`; \
    TAG="7.x-`echo $LINE | sed 's/projects\[\(.*\)\]\[version\].* = \(.*\)/\2/g'`"; \
    GIT="git --git-dir=`find . -type f -name '.git' | grep \"\/$PROJECT\/\" | grep -v libraries`"; \
    $GIT fetch; \
    $GIT checkout $TAG; \
    $GIT status; \
done

Virtualmin + Drupal 7.x on Ubuntu 12.04 HOWTO

Virtualmin is a powerful and flexible web hosting control panel for Linux and UNIX systems based on the well-known Open Source web-based systems management GUI, Webmin. By using Virtualmin we can simply create a virtual hosting environment for Drupal development/hosting within few clicks, including both Linux user account, Apache virtualhost, MySQL database, PHP5 in FCGI, FTP access, and even more.

This HOWTO will guide you though the Virtualmin installation on top of Ubuntu 12.04, then demonstrate the virtual hosting functionality by installing a Drupal 7.x website.

Before start I will assume you have a clean Ubuntu Server 12.04 installed with minimal packages requirement. It is strongly recommend to install Virtualmin for a new host, as it will modify a lot of default settings; from the other point of view, don't install Virtualmin on top of an online production that already well configured ;-)

Virtualmin on Debian Squeeze for Drupal HOWTO

Virtualmin is a powerful and flexible web hosting control panel for Linux and UNIX systems based on the well-known Open Source web-based systems management GUI, Webmin. By using Virtualmin we can simply create a virtual hosting environment for Drupal development/hosting within few clicks, including both Linux user account, Apache virtualhost, MySQL database, PHP5 in FCGI, FTP access, and even more.

This HOWTO will guide you though the Virtualmin installation on top of Debian Squeeze, then demonstrate the virtual hosting functionality by installing a Drupal 7.x website.

Before start I will assume you have a clean Debian Squeeze installed with minimal packages requirement. It is strongly recommend to install Virtualmin for a new host, as it will modify a lot of default settings; from the other point of view, don't install Virtualmin on top of an online production that already well configured ;-)

HKDUG September 15 Meetup

Join the Hong Kong Drupal User Group for the September 15 meetup. We will focus on setting up your own virtual hosting environment with Virtualmin (http://www.virtualmin.com/), moreover how to tweak your website performance based on YSlow (http://developer.yahoo.com/yslow/) analyzes and suggestion. Special thanks to CNNGo.com once again offered us use of their office in Quarry Bay.

HKDUG July 7 Meetup

Join the Hong Kong Drupal User Group for the July 7 meetup. First of all, we are glad to announce the formal formation of Hong Kong Drupal User Group. Hong Kong Drupal User Group has continuously growth in Hong Kong since 2007, and act as a community for knowledge sharing, user supporting and fun. With the formal formation, we aim to continuously develop niche Drupal knowledge, sharing the fantastic user experience to all potential stakeholders in Hong Kong.

Meanwhile, our longtime member – Dave Hansen Lange will relocate to Canada after this meetup. He is an active Drupal contributors and a helpful person in community during these four years. We would like to organize a farewell party to him and wish him all the best in future.

Also, we will provide a sharing section about a relationship management contribution named 'CiviCRM' (http://civicrm.org/). It's functions are well developed to cope with basic community needs. If you are interested, you may try their demo which integrated with Drupal 7.X here (http://d7.sandbox.civicrm.org).

Special thanks to CNNGo.com once again offered us use of their office in Quarry Bay.

Logistics:

Schedule (TBC):

  • 19:00 ~ 19:10: Farewell party started.
  • 19:10 ~ 19:30: Sharing from longtime members in Hong Kong Drupal User Group's long-time members :)
  • 19:30 ~ 19:50: Introduction of CiviCRM
  • 19:50 ~ 20:10: Break. Feel free to ask your question and our volunteers will give you a hand!
  • 20:20 ~ 20:40: Meeting focus in Hong Kong Drupal User Group formation related issues
  • 20:40 ~ 21:00: Discussion of implementation of CiviCRM in Hong Kong Drupal User Group.
  • 21:00 ~ 22:30: After event drinks. A 5mins walk from Oxford House, we'll have a cafe sharing section with a free drink at East End Brewery (http://bit.ly/foF3Mg).

Sponsorship:

  • CNNGo.com, for meeting room reservation.
  • PantaRei Design Limited, for after event drinks.
  • There are sponsorship opportunities still available. Email kpyan0l [at] pantarei-design [dot] com for details.

Volunteer:

  • Volunteers wanted, contact hswong3i [at] pantarei-design [dot] com to help.

HKDUG June 2 Meetup

Join the Hong Kong Drupal User Group for the June 2 meetup. This meetup will focus on Search Engine Optimization (SEO) + Drupal 6.x/7.x backend. Is honorable to invite Mr. Eddie Choi, Managing Director of FrontiersDigital (F-D), to give us some SEO tips from macro e-marketing point of view. Special thanks to CNNGo.com once again offered us use of their office in Quarry Bay.

Mr. Eddie Choi [1],[2],[3] had been invited to speak for many marketing conferences in Asia, conducted numerous private workshops held by the government and commercial organizations in Asia, specialty is search and social marketing particularly with a deep understanding of the market in China, too.

The Hong Kong Drupal User Group are open to everyone with an interest in Drupal and are a great opportunity to learn more about what Drupal can do and what folks are building with it.

Here are the meetup details so far:

  • SEO tips from macro e-marketing point of view.
  • How's Drupal 6.x/7.x SEO related functionality can boost your website overall traffic.
  • Live website demo of Drupal SEO related functionality.

Logistics:

Schedule (TBC):

  • 19:00 ~ 19:10: Kick-off Session. Introduce yourself; enjoy with free pizza and drinks :-)
  • 19:10 ~ 19:30: First Session. SEO tips from macro e-marketing point of view.
  • 19:30 ~ 19:50: Second Session. How's Drupal 6.x/7.x SEO related functionality can speed up your website overall traffic.
  • 19:50 ~ 20:20: Break. Feel free to ask your question and our volunteers will give you a hand!
  • 20:20 ~ 20:40: Third Session. Live website demo of Drupal SEO related functionality.
  • 20:40 ~ 21:00: Q&A Session. Don't wait and let us know about your issues :D
  • 21:00 ~ 22:30: After event drinks. A 5mins walk from Oxford House, we'll have a cafe sharing section with a free drink at East End Brewery (http://bit.ly/foF3Mg).

Sponsorship:

  • CNNGo.com, for meeting room reservation.
  • FrontiersDigital, for SEO tips presentation.
  • PantaRei Design Limited, for after event drinks.
  • There are sponsorship opportunities still available. Email mhyiu4c [at] pantarei-design [dot] com for details.

Volunteer:

  • Volunteers wanted, contact hswong3i [at] pantarei-design [dot] com to help.

HOWTO Create Zen 7.x-3.x Subtheme in Step-by-step (Part 2)

This is the Part 2 of the HOWTO, and you should interested with:

You may hope to stylize your Drupal 7.x blog by yourself; you may have a eyes-catching open source design and would like to implement as Drupal 7.x theme; you may hope to contribute something to Drupal community. Yes, you may have a lot of reason to start your own Drupal theme development.

In Part 1 we cover the basic of GIT command, setup a new subtheme from Zen STARTERKIT, backup original version as reference, preform some basic hack in overall Zen skeleton, and finally update the css/html-reset.css (Oh! It looks so many changes; But actually this is the the beginning!). Up to this point your theme should at least "a bit" looks similar as your design, and now we can go ahead.

This Part 2 will give you some hints for basic Drupal elemenets themeing, e.g. node, comment, block and so on; then we will handle some design-specific implementation, e.g. header, background, sidebar, footer, navigation and so on. Onec finish your theme should be 80% similar as your original design. Ok let's start :D

HKDUG April 21 Meetup

Join the Hong Kong Drupal User Group for the April 21 meetup. During last March 30 Meetup we have a quick review of Drupal 7.x Zen 3.x subtheme development with live demo; this time we will change the meetup as "side-by-side, step-by-step workshop" style. Special thanks to CNNGo.com once again offered us use of their office in Quarry Bay.

The Hong Kong Drupal User Group are open to everyone with an interest in Drupal and are a great opportunity to learn more about what Drupal can do and what folks are building with it.

Here are the meetup details so far:

  • The target of the workshop is to provide a brief example and idea of HOWTO create your own Drupal 7.x Zen 3.x subtheme.
  • You may use your own design besides example provided as below (BTW, you may need to request volunteers to give you a hand).
  • Please prepare your own Drupal 7.x setup before join the meeting (e.g. install XAMPP in your notebook and setup with Drupal 7.x).
  • Please follow Edison's HOWTO Create Zen 7.x-3.x Subtheme in Step-by-step (Part 1, Part 2), trial and error, and prepare your question before meeting (We will try to shorten the workshop section into Q&A style if possible).
  • Your idea here - Suggestions welcome - Feel free to comment on this post or contact us directly!
  • Don't forget that we need AS MANY VOLUNTEERS AS POSSIBLE! We hope to have a 1-on-1 assistance style. Please check below for more information ;-)

Logistics:

Schedule (TBC):

  • 19:00 ~ 19:10: Kick-off Session. Introduce yourself; enjoy with free pizza and drinks :-)
  • 19:10 ~ 19:30: First Session. A quick introduction of workflow.
  • 19:30 ~ 19:50: Second Session. Start development and work out the changes.
  • 19:50 ~ 20:20: Break. Feel free to ask your question and our volunteers will give you a hand!
  • 20:20 ~ 20:40: Third Session. Some finishing and polishing (As much as we can, refer to time restriction).
  • 20:40 ~ 21:00: Q&A Session. Don't wait and let us know about your issues :D
  • 21:00 ~ 22:30: After event drinks. A 5mins walk from Oxford House, we'll have a cafe sharing section with a free drink at East End Brewery (http://bit.ly/foF3Mg).

Sponsorship:

  • CNNGo.com, for meeting room reservation.
  • PantaRei Design Limited, for after event drinks.
  • There are sponsorship opportunities still available. Email mhyiu4c [at] pantarei-design [dot] com for details.

Volunteer:

  • Volunteers wanted, contact hswong3i [at] pantarei-design [dot] com to help.
  • With Zen development experience recommended.
  • With general XHTML/CSS experience recommended.

Pages

Subscribe to Drupal