Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Photo gallery styling WordPress

  • SOLVED

I am using a plugin call fotobook,

I have modified the gallery to organise in a grid however it doesn't look visually appealing. I need someone to clean it up using the same css from the blog page.

url: www.justbgraphic.org/pictures
user: wpquestions
password: wpquestions

Answers (1)

2011-05-16

Duncan O'Neill answers:

Hi Kayode,

I just added a clear:both; to two of the divs produced by your fotobook, in your fotobook settings under your wp-admin. That has meant that the divs surrounding the photos are actually lined up, because they are now clearing the divs which precede them.

Those divs are fotobook-main, and fotobook-subheader.

Please do a hard refresh of your page to see the changes.

If there are other adjustments required, please let me know.

best,

Duncan


Duncan O'Neill comments:

Added some more css for the hover opacity. To get this working cross-browser you'll need to add a couple of lines to JQuery file. All css updates are commented. Again, please let me know if you need further edits / help.

best,

Duncan


kayode brown comments:

Thank! is there anyway we can get the images to be bigger, similar to the blog page?


Duncan O'Neill comments:

Hi again Kayode,

The images on the /pictures/ page are displayed at their actual sizes. So they've been imported at those sizes. We could try changing them via css, but that's likely to be messy because you have some landscape- ( horizontal ) and some portrait ( vertical ) -orientated pix.

I suggest you try changing the max thumbnail size under fotobook settings to 260px ( the same width as your blog pages ) and re-importing your pictures from Facebook. Please let me know how it works.

best,

Duncan


Duncan O'Neill comments:

Oh, if you're successful with re-importing the images at the larger size, you'll need ( help ) to re-edit your css.

This because the wrapping div ( #fotobook-grid-album ) on the images on the pictures page is set at width 170px.


kayode brown comments:

I've re-imported the albums and it isn't displaying properly. Any suggestions?


Duncan O'Neill comments:

Kayode,

you haven't changed the thumbnail size settings to 260px as I suggested, so the images are being imported at the same size they were.

Are the images being imported at the same size as they are on your facebook page, or is the plugin changing the image size during the import process?

best,

Duncan


kayode brown comments:

What file ate you referring to? i can't find that line


Duncan O'Neill comments:

The thumbnail settings are on this page;

http://justbgraphic.org/wp-admin/options-general.php?page=fotobook/options-fotobook.php

And the images I'm referring to are those which are being imported from your facebook profile. Are the images on your facebook profile the same size as the images on the /pictures/ page?

You can also contact me via [email protected] .It may be easier to sort it out via email.

best,

Duncan


Duncan O'Neill comments:

Kayode,

I've done what I can as far as styling the images. But as far as the album image sizes go for the /pictures/ page, I can't help you there without your responses. If I can get an answer to the above question, I may be able to edit the fotobook plugin or settings to alter the album image sizes.

best,

Duncan


Duncan O'Neill comments:

Hi again Kayode,

I made another couple of small css adjustments to the inline css here;

http://justbgraphic.org/wp-admin/options-general.php?page=fotobook/options-fotobook.php

so that the lines wrap properly ( set image containing divs' height ), and so that the border color changes on mouseover as it does on pages containing the individual albums.

Again, it's difficult to tackle the question of the image sizes without your help.

best,

Duncan


kayode brown comments:

Thanks for your help.

Sorry for the delay in responding I've looked into the coding and can't figure it out myself. I have made the size 240 px in the plugin options, how ever it isn't reflecting any change. The gallery layout looks a lot better however the image sizes is an issue.

However if you feel it cannot be fixed then I guess I have to live with it.


Duncan O'Neill comments:

Hi Kayode,

Neither can I see from the coding how the image size might be updated.

I suggested that changing the size to 260px, not 240px, might effect a change because 260px is the width of the images on the /blog page.

I also asked whether the album thumbnails were the same size as their source? i.e. whether they were the same size as your Facebook images?

best,

Duncan


kayode brown comments:

I will make that change, in regards to the album thumbnail size I don't know, I will have to double check. In any event thanks for your help. I've awarded you the money.