You are hereOther / UI help

UI help


JQuery, Javascript and CSS tips, tricks and hacks

Authoring information and permissions

User 1 has all the privilegies. But for other you need to set them. If you want that user has ability to change who authored node you will need to give him "administer nodes" permission. Usually overlooked, this permission is unde node module permission set.

Fusion theme classes for node add and node edit pages

I almost always use Fusion theme as my base theme, one thing its missing and developers of it seem not to care is a class that is in body and is different for node add and node edit pages, so I usually go to template.php and around line 64, after

else {
$body_classes[] = (arg(0) == 'forum') ? 'forum' : ''; // Forum page
}

I add this two

$body_classes[] = (arg(1) == 'add') ? 'node-edit' : '';
$body_classes[] = (arg(2) == 'edit') ? 'node-edit' : '';

Hiding History in User profile view

This option of showing user history seems more obsolite then useful, se lets hide it.

For Drupal 6, copy this file from your /sites/modules/user directory:
user-profile-category.tpl.php, put the copy into your custom theme directory and within that file, replace the code with this

<?php if ($title && $title != t(History)) : ?>
<h3><?php print $title; ?></h3>
<?php endif; ?>

<?php if ($title != t(History)) : ?>
<dl<?php print $attributes; ?>>
<?php print $profile_items; ?>
</dl>

Lightbox or Colorbox

Lightbox or Colorbox. I would say colorbox, its successor to thickbox, which i always liked, its smarter and just feels better. Maybe Lightbox has more features, but i see its missing one i really need and like, which is "Per post gallery" so all images on the post/page can be looked at with modal view(that black screen that goes over the content) continuous. Also it has option for login screen and has better looking default theme.

CKEditor and IMCE file button

You installed your CKEditor and IMCE but there is only image dialogue on your node edit screen and you want to add plain file link.

Fastest way to edit files, change CSS etc

Fastest way i found to make small changes on your site is to use FTP program like FileZilla. Then you just go to file you want to edit and click view/edit. File is downloaded locally and opened in your default (or the one you set in FileZilla) editor. Then you just change what is needed and after all is done just confim on FileZilla that you want to upload changes.

Lightbox2, hiding flash content

Having problem with Flash when using lightbox for overlay? Just add transparency to those flash embed codes and they will be in the dark.

<param name="wmode" value="transparent" />
<EMBED src="swf.swf" quality=best bgcolor=#FFFFFF wmode="transparent" WIDTH="550" ...

IE stylesheet Limit

There is a "31 stylesheet limit in IE 6 & 7" so sometimes your page will break in this browsers. You will go crayze, asking yourself whats going and, checking CSS and tags. But all you need to do is put under performance, CSS to optimize and you will have one stylesheet and will have this problem fixed.

CSS for iphone

When you decide to make page for iphone, or maybe just make additional css to change how its views on iphone you should add this code, as iphones ignore other code. With this you set it depending on the size of the screen, so you hide sidebar for all devices that have screen smalled than 480px (widescreen iphone format). More info can be found on linke below

You can specify that a set of CSS rules apply only when the screen is smaller than a certain resolution:

Setting a form value with jQuery

If you want to select form value, for example hidden field for subject in mail form you can set the form values with jQuery using the val() function.

If the form element is <input id="subject" name="subject" type="hidden" value="someweb.com" /> you set it with  $('#subject').val(itemId);

so put it in function

<script type="text/javascript">
 function toggleDescription(itemId) {
 $('#subject').val(itemId);
 window.alert( $('#subject').val() );
 }
</script>