Theme Joomla Extensions

Styles and titles in Power Slide

I have been successful in installing and publishing the Power Slide gallery. It's working great.

Now I'm ready for step 2: I'd like to customize the display. Here are the things I'd like to be able to do:

  1. Remove the Gallery Heading. The page I have the gallery on has a heading plus description text for the gallery. While I could make the heading disappear by giving it the same value as the background, it will still take up space. Is there a way to remove it entirely? When I delete the "Galleries" heading, the next time I am in the module it has been put back.
  2. I'd like to change font sizes and styles. I presume there are some CSS styles involved somewhere. You only allow for color changes in the Component control - is there a stylesheet that is used? If I were to modify this style sheet, would these get overwritten on a future version update? Is there a way to disable the display of some items?
  3. When I have two lines of descriptive text in thumbnail mode, the display, "6 pictures" gets pushed below the thumbnail. Is there a way to get the description to remain entirely to the right of the thumbnail, in kind of a mini-two-column look?
  4. When I have the component create thumbnails automatically, the small image looks like it has vestiges of the photo below and above the thumbnail. I can "fix" this by choosing a thumbnail height that is short enough, but since the photos have different aspect ratios, this is not always ideal. Is there a fix for this? I'd prefer a "short" photo to have a thumbnail with black bars above and below.
    5. Thanks for your help.

    LumoMongo replied To answer your questions...

    1. Remove the Gallery Heading.


    Add this to the bottom of your Power Slide CSS file: 

    .jdGallery .gallerySelector h2 
{display: none; position: absolute; top: -5000px; left: -5000px; }



    2. I'd like to change font sizes and styles. I presume there are some CSS styles involved somewhere. You only allow for color changes in the Component control - is there a stylesheet that is used? If I were to modify this style sheet, would these get overwritten on a future version update? Is there a way to disable the display of some items?


    In the Power Slide module folder there is a CSS folder with all CSS styles. You can edit this directly.
    As you will be editing the actual CSS file, yes it might get overwritten if you update - so good to keep a backup. We are working on a new version which allows for a lot more customization.

    3. When I have two lines of descriptive text in thumbnail mode, the display, "6 pictures" gets pushed below the thumbnail. Is there a way to get the description to remain

    entirely to the right of the thumbnail, in kind of a mini-two-column look?
    Hmm, not sure will have to look into this - perhaps editing the CSS will get this sorted...

    4. When I have the component create thumbnails automatically, the small image looks like it has vestiges of the photo below and above the thumbnail. I can "fix" this by choosing a thumbnail height that is short enough, but since the photos have different aspect ratios, this is not always ideal. Is there a fix for this? I'd prefer a "short" photo to have a thumbnail with black bars above and below.


    Well, the script finds the nearest matching width or height - and matches to that - therefore if you images are not in the same aspect ratio of the thumbnail box you get these gaps - this can be fixed by either setting the stretch image parameter, or by checking your image ratios... or creating your own thumbnails.

    panda replied Some new questions...

    Thanks for the prompt reply. I was able to modify the CSS file (took me a bit of time to locate the right one). I accomplished #1 and #2 on my list. The default titles were way too big (H2) and bright (I am using a black background on the page so it was glaring at white and 30px), but I was able to change them to my liking. I hope I can remember what I changed for when you have a program update.

    For #4 on my list - where are the thumbnails located, and how do I get the program to use custom ones?

    For #3 on my list - since you're using H2 for the photo caption titles, it forces a paragraph break after it and before the caption begins. You also force a paragraph break after the caption and before the "X pictures"

    Since your thumbnail seems to be align-left, that would be why the "X pictures" is pushed down below the thumbnail. Since the thumbnails are not very big, it makes for pretty odd visual spacing when the caption is just a few words. It also wastes two blank lines of vertical space. As a suggestion, perhaps you could simply style the Title in the captions and not use H2, then
    to the caption text. This way the title can still be large but the caption will start on the next line. Also, perhaps you could give the option of putting the "X pictures" at the end of the caption instead of on its own line.

    I have some new questions - let's number them from #5 to keep them separate from my previous questions...

    5. The "X pictures" text is white making it stand out on my very dark page - which style is associated with this? I'd like to tone it down to a more subdued shade of grey but can't figure out which of the styles in CSS is associated with it.

    6. I notice that the the View Gallery and Show/Hide links inherit the a.link color of the underlying template, while the gallery selection link color is controlled by CSS. What modification to the CSS file would I make to control the color of those two links.

    7. Is it possible to have more than one gallery on this site with different styles? I may want to stack completely separate galleries on the photo page, and I know I want to put a separate gallery elsewhere on the site. I realize I can copy the module and change the paths, but what would changing the XML filename do, and how will the Component control panel affect multiple galleries?

    LumoMongo replied For your new questions...

    Thanks for the prompt reply. I was able to modify the CSS file (took me a bit of time to locate the right one). I accomplished #1 and #2 on my list. The default titles were way too big (H2) and bright (I am using a black background on the page so it was glaring at white and 30px), but I was able to change them to my liking. I hope I can remember what I changed for when you have a program update.


    Cool, glad you got sorted.

    For #4 on my list - where are the thumbnails located, and how do I get the program to use custom ones?


    If you open up the module, in the module parameters, make sure image resizing is off, and then place your thumbnails with same file names in the thumbnail folder (also specified in the module parameters)

    For #3 on my list - since you're using H2 for the photo caption titles, it forces a paragraph break after it and before the caption begins. You also force a paragraph break after the caption and before the "X pictures"


    Since your thumbnail seems to be align-left, that would be why the "X pictures" is pushed down below the thumbnail. Since the thumbnails are not very big, it makes for pretty odd visual spacing when the caption is just a few words. It also wastes two blank lines of vertical space. As a suggestion, perhaps you could simply style the Title in the captions and not use H2, then
    to the caption text. This way the title can still be large but the caption will start on the next line. Also, perhaps you could give the option of putting the "X pictures" at the end of the caption instead of on its own line.
    - I hear what you saying, and will look into re-writing that section - only reason H2 were used was for SEO purposes.

    5. The "X pictures" text is white making it stand out on my very dark page - which style is associated with this? I'd like to tone it down to a more subdued shade of grey but can't figure out which of the styles in CSS is associated with it. 


    .jdGallery div.count (line 282)



    6. I notice that the the View Gallery and Show/Hide links inherit the a.link color of the underlying template, while the gallery selection link color is controlled by CSS. What modification to the CSS file would I make to control the color of those two links.


    .jdGallery a.carouselBtn (line 27) (also in module parameters - link color) 
.jdGallery a.gallerySelectorBtn (line 211) (also in module parameters - link color)



    7. Is it possible to have more than one gallery on this site with different styles? I may want to stack completely separate galleries on the photo page, and I know I want to put a separate gallery elsewhere on the site. I realize I can copy the module and change the paths, but what would changing the XML filename do, and how will the Component control panel affect multiple galleries?



    You cannot have more than 1 gallery module on the same site page - but you can have separate modules (copies) with different styling on separate pages. Of course, as this uses the same module files - this is rather limited. Only way I know of to get around this is to re-write the installation xml so that you install 2 separate copies of the module under different names, therefore they will have there own separate files.

    That being said we are actually working on module templating for version 2.0 - still a while though..

    You must be logged in to post a comment. Please register if you do not have an account yet.

    busy

    INSIDE: Forum / Extensions

members

search