Cant get imageblock to display random image from an album on external website

evobenno

Joined: 2012-02-08
Posts: 18
Posted: Wed, 2012-02-08 04:38

Hi im using imageblock in a way that can shrink images to a smaller size and not distort or blur the image so it still stays readable

I couldnt find a way to do this with mediablock

Meanwhile, the following code is failing to display a random image each time

there are 3 images in the album but it always shows the same one, never the other 2

----------------------------------------------------

<?php @readfile('http://www.mysite.com/gallery2/main.php?g2_view=imageblock.External&g2_blocks=randomImage&g2_itemId=386&g2_exactSize=200&g2_show=none'); ?>

-------------------------------------------------------

whats going on guys? anything you can see wrong with this, or do u know a better way

Thanks so much for any help....

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Wed, 2012-02-08 13:52

You can use mediaBlock and easily style the images any way you want w/ CSS

<style>
.imagetable img{
    height: auto;
    width: 300px;
}
</style>
<div class="imagetable" >
<?php @readfile('http://www.yoursite.com/gallery2/mediaBlock.php?g2_itemId=32&mode=dynamic&g2_view=dynamicalbum.RandomAlbum&limit=4&column=4&g2_maxImageHeight=500&g2_maxImageWidth=500'); ?>
</div>

see these examples http://www.flashyourweb.com/gallery2/embed_samples/benno.php

-s
FlashYourWeb and Your Gallery with The E2 XML Media Player for Gallery2

 
evobenno

Joined: 2012-02-08
Posts: 18
Posted: Wed, 2012-02-08 15:08

thanks is kind of working

the random functions well, after installing Dynamic aalbum plugin

but the image resize doesnt

i must have the image at 200 width and i dont want to have to resize them manually,any ideas?

<style>
.imagetable img{
height: auto;
width: 300px;
}
</style>
<div class="imagetable" >
<?php @readfile('http://www.mysite.com/gallery2/mediaBlock.php?g2_itemId=105&mode=dynamic&g2_view=dynamicalbum.RandomAlbum&limit=1&column=1&g2_maxImageHeight=100&g2_maxImageWidth=200'); ?>
</div>

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Wed, 2012-02-08 15:17

Basically you want to use a larger image and let the css scale it down.
So your css would be:

.imagetable img{
height: auto;
width: 200px;
}

and you'd want to query for a larger resize so you don't upscale: &g2_maxImageHeight=640&g2_maxImageWidth=640
if you're worried about the few extra kilobytes of bandwidth have gallery build a resize closer to the size you want:
Edit Album -> Album Tab -> Resized Images -> Each item in your album can have multiple sizes. Define the default sizes here -> Apply album setting to resized images && Build resizes too

-s
FlashYourWeb and Your Gallery with The E2 XML Media Player for Gallery2

 
evobenno

Joined: 2012-02-08
Posts: 18
Posted: Wed, 2012-02-08 16:06

Thanks that actually worked out well.

For a single image its great no probs.

The next issue is lower down the page i have mediablock displaying random images but this time there are 3 on 1 row

also here im showing the title, and ive also set it up to showSummary

problems now are...

# the text underneath (title & summary) are all left aligned to the image, where id prefer them to be CENTERED directly under each image

# also there is strange padding and huge gaps appearing inbetween, create huge blank space between the image and it title

any ideas??

<style>
.imagetable3 img{
height: 75px;
width: auto;
}
</style>
<div class="centreAnywhereDiv">
<div class="imagetable3" >
<?php @readfile('http://www.hhffffh.com/gallery2/mediaBlock.php?g2_itemId=366&mode=dynamic&g2_view=dynamicalbum.RandomAlbum&limit=2&column=2&g2_maxImageHeight=75&g2_maxImageWidth=75&noShadow=1&showTitle=1&showSummary=1'); ?>
</div>
</div>

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Wed, 2012-02-08 16:19

in this example, using the thumbs would be more efficient.
mediaBlock allows you to scale thumbs with useMicro like my second example here
&useThumb=1&useMicro=75
this way the largest side of the image is 75px but keeps aspect. I also use that technique in the first and second examples here.
Of course if your technique gleams the effect you want by all means use it.

You'd also want to add some css to the <h4 /> to remove the extra margin and padding and center the text and possibly adjust font size:
.imagetable3 h4{ margin: 0; padding: 0; text-align: center; font-size: .80em; }

-s
FlashYourWeb and Your Gallery with The E2 XML Media Player for Gallery2

 
evobenno

Joined: 2012-02-08
Posts: 18
Posted: Wed, 2012-02-08 16:53

brilliant mate, help has been enourmous

its almost perfect but i am finding there is still random spacing around the images

it only minimal, but it is causing the alignment to still be a little off centre in conjuction with the title underneath

is there a way to take the padding/margin away from the image itself...???

here is the code ive established so far...

<style>
.imagetable3 img{
height: 75px;
width: auto;

}

.imagetable3 h4{ margin: 0; padding: 0; text-align: center; font-size: 11px; }

.imagetable3 p{ padding: 0; text-align: center; font-size: 11px; color: #936; margin-top:2px; font-weight:bold;}
</style>
<div class="imagetable3" >
<?php @readfile('http://www.mesite.com/gallery2/mediaBlock.php?g2_itemId=366&mode=dynamic&g2_view=dynamicalbum.RandomAlbum&limit=3&column=3&noShadow=1&showTitle=1&showSummary=1&useThumb=1&useMicro=75'); ?>
</div>

maybe its flawed cos of the thumb combination with the CSS img?

all this code is within a <td></td> on my home page

any flaws there?

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Wed, 2012-02-08 17:07

I really cannot say without looking at the offending page.
Your site's stylesheet could have defined a loose cannon style that is affecting the tables or something.

-s
FlashYourWeb and Your Gallery with The E2 XML Media Player for Gallery2