Announcement

**NumNum** · 11-13-2018, 02:49 PM

Where in the page should the code go?

**glennrocksvb** · 11-13-2018, 03:13 PM

Inside the <head></head> tags

**NumNum** · 11-13-2018, 03:25 PM

There are no head tags in the index.php file.

**glennrocksvb** · 11-13-2018, 05:13 PM

After looking at the gallery setup and seeing the lack of customization, I thought of another approach. Try this one on the HTML module.

HTML Code:

<script>
function galleryLoad() {
    var iframe = document.getElementById('chapterphotos');
    iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 'px';
}
window.addEventListener('resize', galleryLoad);
</script>
<iframe id="chapterphotos" src="chapter_photos/index.php" onload="galleryLoad();" style="border: 0; width: 100%; height: 100%; overflow: auto;"></iframe>

**NumNum** · 11-13-2018, 05:24 PM

That did it! Appreciation sent!

**glennrocksvb** · 11-13-2018, 05:32 PM

Thanks!

I checked the page and it's working. But there's one thing that I want to fix. As you navigate through the gallery slideshows, the vertical scrollbar in the iframe flashes as the script is waiting for the images to fully load to be able to calculate the iframe content height.

Try changing overflow: auto; to overflow: hidden; in the iframe style. That should prevent showing the iframe scrollbars.

**NumNum** · 11-14-2018, 01:36 AM

Made the change and still see it momentarily.

**NumNum** · 11-14-2018, 01:52 AM

Would there be a way to change the color of [powered by iGalerie] using css?

**glennrocksvb** · 11-14-2018, 08:27 AM

You need to edit the /chapter_photos/template/minimalist/style/white/white.css file to add custom CSS:

Code:

/* for text */
#ig2_footer {
    color: blue;
}
/* for link */
#ig2_footer a {
    color: red !important;
}

You can also get rid of the flashing scrollbar there with this CSS:

Code:

body {
    overflow: hidden;
}

**NumNum** · 11-14-2018, 08:48 AM

What about the underline for the hyperlink and the arrow?

I'd like to change those colors too.

**glennrocksvb** · 11-14-2018, 10:12 AM

Code:

/* for text */
#ig2_footer {
    color: blue;
}
/* for link */
#ig2_footer a {
    color: red !important;
    border-bottom-color: red !important;    
}

For the arrow, it's a background image. You have to provide your own image if you want to change it.

**NumNum** · 11-14-2018, 10:29 AM

Thanks Glenn

Announcement

Embed page withing vbulletin

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Users Viewing This Page

Latest Posts