HOW TO: Drupal 6 Multilingual with Views and i18n

I'm working right now on building a multilingual website. I've done that already, it was an preaty easy job. But now, I'm also using the "Views" module (and others). While the "Views" module is a great tool that makes your life easier, it can't do one major thing: work with i18n. After lots of reading, I came across this, this and this issues. Everybody complains about the lack of compatibility between these two great modules.

I saw that there are two modules ("Insert view" and "Viewfield") trying to solve this major issue, but none of these provide an elegant solution. The first one is actually an input filter and you have to manualy write something like this: "[view:name of view=name of display=arg1,arg2,arg3]" into the node's body. That's not a very user-friendly approach. The second one is an CCK field module. When you create a new node, you can select from a dropdown list, the view you want to use. The problem is that this module is still in development phase, so there's no stable version for Drupal 6.x.

Since the "CTools" is a new module, I guess there aren't too many people using it so this could be the lack of online help provided for this issue. Now, all you have to do is to download and enable these modules: CTools and Panels (and also Views and i18n).

Follow these steps:

  1. create the view you need
  2. after you set up the fielters you need, you add one more: the "Node translation: Language" filter (screenshot)
  3. set the "Operator" to "Is one of" and the "Language" to "Current user's language" (in this filter settings). You now have a view that show only the nodes for the selected language (screenshot)
  4. create a "Panel" node
  5. in the "Panel content" tab, click the "Add content" link (screenshot)
  6. now select the view you want (screenshot)
  7. translate this node into any language you need, repeating the steps 5 and 6 for this new node and you're done.

Now, the language switcher block work just fine and you have a multilingual website.

Table Pager

I wanted to do this a long time ago but I had no time. This is a simple jquery plugin that add a pager to any html table you want. 

Demo

This is the table header
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

How to use

$(".table-pager").addTablePager();
or
$(".table-pager").addTablePager({results : 5, position : "top"});

New Drupal 6 Theme

After a few hours of hard work, my new Drupal 6 Theme is ready. I wanted something simple for this website so this is the final result. webDev 1.0 is a 2 column CSS based (no tables) theme developed for Drupal 6. It is W3C CSS and W3C XHTML 1.0 Strict valid.

Theme specifications

  • 2 columns ( content + sidebar )
  • screen resolution: 1024x768 px ( best user experience: 1280x1024 px )
  • W3C XHTML and CSS valid
  • cross browser tested (Firefox 3, Google Chrome, Safari, Opera, Internet Explorer 6 and 7)

Simple tooltip - jQuery plugin

A few weeks ago I needed to display a tooltip for a field in a form. There are lots of jQuery plugins for that but I just needed a simple one. I wanted to display a message on mouseover. Since I thought it is very easy to do it myself, I started to work on it. After a few minutes, it was ready.

Demo

Display tooltip on mouseover

How to use

$("#some-element").simpletooltip()
or
$("a.some-class").simpletooltip()

Make Internet Explorer behave like a standards-compliant browser

First of all, when you start a new project, you should not forget about the IE7.js project from google code. This is a java script library that makes Internet Explorer behave like a standards-compliant browser. It also fixes transparent PNG's and now are displayed correctly.

All you have to do is to add the following code to the HEAD element on your webpage. This makes IE5-6 to be compatible with IE7.

About webDev

On this website I wanna group all my latest and future work regarding web development. Since I just love jQuery, I think I'm gonna spend a lot of time writing about it. Drupal is also one of my favorite "things" so I wont forget writing about it.

Also, here you'll find any useful articles about web development. Popular jQuery / Java Script plugins, Drupal modules, CSS tutorials, tips and tricks, cross browser optimization and much more.

Syndicate content