Hi all,

I'm new to Drupal, have been blundering my way forward for two months now. I'm using jcarousel with the views module, which I have successfully installed and gotten working. The problem is that I have been trying to get a custom skin to work. I used two different methods:
1. Creating a custom module and linking it to jcarousel with the skins hook ie.

function custom_skins_jcarousel_skin_info() {
$skins = array();

2. Creating a folder inside the jcarousel skins folder and adding the skin into the array in the jcarousel.module file.

Both of these methods added my skin to skin list in the image settings of my view, but when I select them it doesn't actually change the way the carousel looks. I've since tried tango and default and they both look exactly the same as well. Theres obviously some form of formatting happening, as the thumbnails are nicely spaced with an arrow, but there's no container. Is there some sort of setting somewhere that I'm missing? I'm using Drupal 7.9 if that helps.

Thanks in advance for any help!

Comments

quicksketch’s picture

quicksketch
he/him
commented

Hi Che, welcome to drupal.org. :)

This seems pretty related to #393562: More Documentation on creating skins, it may have been better if you posted to that issue rather than starting a new issue, but considering the specifics of your request it's probably fine that we start this new issue here.

2. Creating a folder inside the jcarousel skins folder and adding the skin into the array in the jcarousel.module file.

This sounds like it may be a problem, but I'm not clear from your description what you've actually done. You shouldn't need to modify anything in the jcarousel module folder. The purpose of the hook is to make it so that you can extend the jcarousel module without modifying it (otherwise it would difficult to update the module in the future). You should put the skin in your own module folder.

Both of these methods added my skin to skin list in the image settings of my view, but when I select them it doesn't actually change the way the carousel looks. I've since tried tango and default and they both look exactly the same as well.

The view preview won't show the actual styling I think. You need to save the view and look at it on it's own page or block to see the end-result.

monster_che’s picture

monster_che commented

Hi quicksketch,

Thanks for your reply :)

2. Creating a folder inside the jcarousel skins folder and adding the skin into the array in the jcarousel.module file.

I followed a tutorial that recommended simply making a new skin and placing it in the skins folder of the jcarousel module. This wasn't showing up in Drupal so I changed this

/**
* Implements hook_jcarousel_skin_info().
*/
function jcarousel_jcarousel_skin_info() {
$skins = array();

$skins['default'] = array(
'title' => t('Default'),
'file' => 'skins/default/jcarousel-default.css',
);
$skins['tango'] = array(
'title' => t('Tango'),
'file' => 'skins/tango/jcarousel-tango.css',
);

return $skins;
}

to this

/**
* Implements hook_jcarousel_skin_info().
*/
function jcarousel_jcarousel_skin_info() {
$skins = array();

$skins['default'] = array(
'title' => t('Default'),
'file' => 'skins/default/jcarousel-default.css',
);
$skins['tango'] = array(
'title' => t('Tango'),
'file' => 'skins/tango/jcarousel-tango.css',
);
$skins['dark2'] = array(
'title' => t('dark2'),
'file' => 'skins/dark2/jcarousel-dark2.css',
);

return $skins;
}

dark2 being a copy of the first skin I created, dark.

When I'm checking the appearance of the skins I've been saving the view, clearing all cache's and navigating to the page they're displaying on. Still showing up with no container.

quicksketch’s picture

quicksketch
he/him
commented

Oh dear, no no no. Don't modify the jcarousel.module. If you do that you'll never be able to upgrade without reapplying your changes every time. You should make a new module to just contain the hook_jcarousel_skins() implementation.

I've said it plenty of times before, but really I recommend not using custom skins at all. Just put the CSS you want in your theme's style.css file and use either the default skin (if you want to work off the CSS it provides) or just not use a skin.

monster_che’s picture

monster_che commented

Hi quick_sketch,

Ok, I've taken the mod out of jcarousel.module file. Didn't mean to upset you, I'm just a noobie! Will use the hook_jcarousel_skins() implementation.

Any ideas why my carousel isn't implementing skins? Not too much of a biggie as I'm starting to like the plain carousel, but it's something I would like to be able to theme in future sites.

quicksketch’s picture

quicksketch
he/him
commented

Any ideas why my carousel isn't implementing skins?

So a "skin" is really just 2 things:

1) A class on your jCarousel. So you should have the class "jcarousel-skin-dark2" on a DIV that wraps around your view content. That's the first half.
2) Then the stylesheet will be added to the page. View the source of your page and see if your CSS file (skins/dark2/jcarousel-dark2.css) is being added to the source of the page. Make sure you have CSS aggregation turned off (under Admin -> Developer -> Performance) so that you can see the list of CSS files.

That's really all there is to it. Figuring out which of these two fails will help determine the problem.

And once again, not making a skin at all and just putting the CSS in your site's style.css is easiest solution and what I use on my sites.

quicksketch’s picture

quicksketch
he/him
commented

I've since tried tango and default and they both look exactly the same as well. Theres obviously some form of formatting happening, as the thumbnails are nicely spaced with an arrow, but there's no container.

This doesn't sound right. Selecting the Tango skin should change the appearance almost completely. Though as I said above, the View preview won't immediately reflect it.

monster_che’s picture

monster_che commented

Hi Quicksketch,

That's my problem, and the entire reason for my post, the jCarousel is appearing simply as a row of squares, with absolutely nothing around it no matter what skin I use. This is how it looks on the actual post page, as I have been saving changes, clearing caches, and then navigating to my front page to check it.

Still wondering if I'm missing something basic here... I might just try editing through my css :)

quicksketch’s picture

quicksketch
he/him
commented

Could you check the two things I mentioned in #5? That A) the CSS file for the skin is present and B) the class is added to the carousel?

monster_che’s picture

monster_che commented

Hi quicksketch,

I used the inspect element option in google chrome, it seems the carousel is using the default skin even when tango is selected.

quicksketch’s picture

quicksketch
he/him
commented

I used the inspect element option in google chrome, it seems the carousel is using the default skin even when tango is selected.

So you mean that the class on the wrapper div is "jcarousel-skin-default" instead of "jcarousel-skin-tango"?

monster_che’s picture

monster_che commented

Yes, any ideas?

charcotrill’s picture

charcotrill commented

Voice of sheepish experience: make sure your function matches your module name. For example, jcarousel_skin_showcase_jcarousel_skin_info() with jcarousel_skin_showcase.module. That fixed the issue for me!

dbrogdon’s picture

dbrogdon commented

I'm seeing this behavior as well and I've verified that the function matches the module name.

dbrogdon’s picture

dbrogdon commented

I realized what I was doing wrong. I had my css in 'jcarousel/skins/' instead of 'my_module/skins/'.