Jump to content

Archived

This topic is now archived and is closed to further replies.

zhonghao

Change Size of Featured Picture Boxes

Recommended Posts

zhonghao    1
zhonghao

Hi there - first of all I guess I should ask how / where I should post my question as there doesn't seem to be a 'place' for it.  It concerns adjusting the size for the Featured Picture Box section which I just purchased. I contacted the developer Ryan Varley who suggested I should go to (http://www.pagelines.com/forum/forum/68-store-products/) to post my question so that it can help other people. However there is no option to place a question for Ryan Varley sections and under the Pagelines section there is no option for Featured Picture Boxes. 

 

I would like to resize the boxes as my understanding is that they change dynamically depending on the size of the container they are in. So for example if i have 3 boxes they will be much larger than having 4 boxes in a row. Ryan said to change the padding via css but after looking at the page with the developer tools in Chrome I have no idea how to do this. I have selected and changed padding values for everything I can find relating to the boxes on the page but only seem to be able to chop off the top/bottom of the box or change the navigation menu placement ! I have temporarily solved the problem by just placing 4 boxes on the row but I would like to have only 3 so any help would of course be greatly appreciated.

 

Thanks and regards,

Richard

 

Share this post


Link to post
Share on other sites
ryanvarley    0
ryanvarley

Hi, Padding at either side of the boxes can be done by using (place in your custom css or theme css)

#featured-picture-boxes .plgrid-pad {padding: 0 15px 0 15px}

If you want to add spacing between boxes use this

#featured-picture-boxes .grid-element {
    width: 25%;
    margin-right: 8.3%;
}

Where width is the width of a box and margin right is the spacing between them. You should stick to % here to keep them responsive.

 

You make sure you get the calculation right aswell. do 100% / number of boxes (for 3 this is 33.3%) than make sure width + margin-right adds up to this.

 

This will effect ALL featured picture boxes on your page, if your using more than one across the site and only want this to effect a specific set of boxes then add a custom class to it in page options and change #featured-picture-boxes to .customclass (replacing custom class with whatever you called the custom class in page options)

 

If you need more specific help please post a link to your site and what you are trying to achieve.

Share this post


Link to post
Share on other sites
zhonghao    1
zhonghao

Hi Ryan,

 

Thanks very much for such a prompt and detailed reply. You've answered everything -this is just what I was after - much appreciated. Regards, Richard

Share this post


Link to post
Share on other sites
mortenoa    0
mortenoa

Hi Ryan,

 

I have two questions:

 

1. How to decrease the spacing between my boxes? They function as menubuttons and they should be placed closer to each other.

2. I made a lot of "invisible boxes" so I could place the visible boxes on the left. But is it possible to only place one vertical row of boxes on the left?

 

Hope you can help.

 

Many Thanks,

 

Morten 

Share this post


Link to post
Share on other sites
ryanvarley    0
ryanvarley

Hi, given the holidays ill take a look at this for you on thursday.

 

does the answer above not solve the spacing issue?

Share this post


Link to post
Share on other sites
ryanvarley    0
ryanvarley

I would start by setting one section with one box per row. this should get you the button style layout. You will then need to have the container section in the side (use a sidebar?) as the boxes fill that space. Alternatively reduce the width of the section with css. You certainly shouldn't need invisible boxes.

Share this post


Link to post
Share on other sites

  • Similar Content

    • angusryall
      By angusryall
      Hi, I installed your Featured Picture Box section, found the config area in the 'page Options', but I can't see how I apply this to boxes, there doesn't appear to be anything in the boxes area, and there is no WP menu item for Featured Picture Boxes. How do I do this? Urgent advice appreciated as I have to get some boxes running with a hover tonight!
    • manojgupta26
      By manojgupta26
      I want to show content using custom post types. How can I do this?
    • manojgupta26
      By manojgupta26
      Hi Ryan,
       
      Currently, the images floats and occupy almost entire width of the sidebar. How can I add padding? Also, is there any way to show thumbmail images in smaller size of my choice apart from adding to Boxes? Suppose I want to show 150x150 image into 120x120. Is it possible? If not, can you add the feature pls.
       
      Also, I want to add widget title for the section i added to the sidebar. You can check my site, the section is live. how can I add it?
    • manojgupta26
      By manojgupta26
      Hi,
       
      Today I purchased the section but don't know how to use it? Can you please post steps to use it..both using content box, recent post and using custom  post types..
       
      Where can I locate "more info boxes for help"?? as suggested by you?
       
      Regards
      MG
       
       
    • imagineutopia
      By imagineutopia
      hi. I'm close to pulling the trigger on Featured Picture Boxes but as I look at the demo site in chrome I see the images jitter and move a pixel or two when I hover over.
       
      this looks about perfect otherwise but I  know I'd be hearing it from the client if they noticed the movements.
       
      is this a known issue? if its cleared up I'm in.
       
      thanks,
×