drupal

Using Custom Skins for jCarousel in Drupal

jCarousel is a very nice slide show plug-in for jQuery. There is also a Drupal module for jCarousel.

Using jCarousel in Drupal is quite easy. After enabling jCarousel module, you just assign an ID to a list and call a PHP function jcarousel_add('#your-list-id') in your theme file or somewhere like a view's header (don't for get to choose PHP input).

But what if you want to create your own skin for jCarousel? It can be quite confusing for those who don't code much (or enough - like me) so I will explain here step by step.

  1. You have to know that the function jcarousel_add() can take up to 4 parameters (I couldn't find this in the jCarousel module's help page so I looked in the jcarousel.module file itself), $selector, $options, $skin, and $skin_path.
  2. $selector is your jQuery selector for the list you want to enable jCarousel. $options is an associative array for jCarousel configuration. The details are here. $skin is the skin name. $skin_path is your custom skin's css file path (it has to be an internal path such as "sites/all/modules/jcarousel/jcarousel/skins/tango/skin.css" for Tango skin).
  3. You need to create a wrapper element, such as div, with class="jcarousel-skin-skin_name" for your jCarousel-enabled list.
  4. You may copy and modify skin.css from the existing skins (tango or ie7). Don't forget to change the class selector .jcarousel-skin-tango or .jcarousel-skin-ie7 to your own one. This is where I got stuck -_-".
  5. Make sure that your $skin_path is correct and enjoy theming. :D

Overriding Drupal Views with .tpl.php Files

After being away from customising Drupal for a while, I have forgotten in some details about how to override (or customise) Views using my own .tpl.php files.

In my opinion, overriding Views this way is very comfortable because you just put a template file with a specific name in the theme's directory and let Drupal scan for this new template and that's it!

Beforehand, you need to know that specific name of your .tpl.php file. You have to take a look at "Theme: Information" in "Basic Settings" in the View edit page. Decide which kind of overriding you need here. The file names are ordered by level of specification.

You will find a button labeled "Rescan template files" here. You will need to activate your newly-created template file(s) here again in the future.

Then you can create your own .tpl.php file(s) now. You may wonder how your template file will look like. This is also where I got stuck - and got motivation to write this entry :)

The clue is that you can find all the default Views in the Views module's directory itself. In my case it's /sites/all/modules/views/theme. Copy what you need and enjoy theming :D

One solution for "Javascript is required to view this map." in Drupal 6 GMap module

I've been using GMap module for Drupal 6 for a while. Once I changed the theme from Garland to my own. The map page said only "Javascript is required to view this map".

I googled and found that I should include a javascript tag via drupal_add_js() function, but the scripts are already there when I did view source. Comparing with the working source, the missing piece is

<script src="http://maps.google.com/maps?SOME_VALUE" type="text/javascript"></script>

which is not included in a Drupal variable $script.

After comparing the page.tpl.php of the two themes line-by-line, the problem is that there was no $head in my new theme. I just inserted

<?php print $head ?>

before the line

<?php print $styles ?>

and the map appears.

Syndicate content

Links

Recent comments