This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Tagged: 

Post Showcase and Post Grid page templates with masonry display

  • Creator
    Topic
  • #19727
    askwpgirl
    Participant

    Hi Jason,

    I don’t see a difference between the masonry and grid style when I choose the Post Grid or Post Showcase Templates in Jump Start 2.0.

    My Theme Options are set to use the masonry by default with the variable image height.

    If I insert the shortcode on the page, the masonry layout displays fine for both grids and showcase, but it doesn’t seem to work at all with the Post Grid or Post Showcase Templates.

    Maybe a glitch?

    Thanks! We had our meet up on Monday night, and everyone was very excited to see and play with the new Template Builder.

Viewing 15 replies - 1 through 15 (of 16 total)
  • Author
    Replies
  • #19739
    Jason Bobich
    Keymaster

    Hey Angela,

    Hmm, I’ve tested on my end, and can’t reproduce what you’re saying. On theme options I set both Post Grid and Post Showcase to display masonry with a variable image height. Then, when I create a new page and apply the Post Grid or Post Showcase page template, I’m able to see the masonry.

    Is it possible the masonry is being outputted but you’re getting javascript conflicts on the page from something else on the page? That’s the thing with masonry – that it’s all setup with javascript when the page loads. If the outputted javascript were broken in any way, you’d end up with just a standard looking grid.

    #19742
    askwpgirl
    Participant

    I am only running JS and JS plugins on a demo site for my students. Here’s the page using the Template called “Post Showcase” — in my Theme Options, I have the Showcase defaulted to Masonry and the variable height images:

    http://jumpstart.askwpgirl.com/test-masonry/

    Here is a page with the masonry shortcode which works fine:

    http://jumpstart.askwpgirl.com/page-templates/post-showcase-masonry/

    If I put the shortcode on the SAME page as the template, then both the shortcode and template display the masonry style. Weird! But if I am only using the Template, then the masonry does not work.

    I misspoke about the Grid template. It does work if you switch to Masonry in the custom field options, but you have to have the variable height image selected in the Theme Options. So the issue seems to be with the Showcase Template.

    http://postimg.org/image/w64alsdkr/

    #19743
    askwpgirl
    Participant

    Okay, here’s the issue:

    1 – Default Theme Options are set – so clear ALL your theme options to default by clicking the Clear Options button.

    2 – Add a page using the Post Showcase template. Choose full page width for effect. Page will not display in Masonry.

    3 – Go to Theme Options and save a different image size for the GRID — NOT THE SHOWCASE BUT THE GRID. Choose 300 x 300 for kicks.

    4 – Visit your Post Showcase page. You’ll see that the showcase displays in masonry but using the width of the image from the grid (ignores the height).

    So something is jacked up with theme options. A cross-wiring in which the Showcase is getting some part of the Grid image size, then it gets the grid width but it’s own height.

    #19754
    Jason Bobich
    Keymaster

    1 – Default Theme Options are set – so clear ALL your theme options to default by clicking the Clear Options button.

    2 – Add a page using the Post Showcase template. Choose full page width for effect. Page will not display in Masonry.

    When you click “clear options” you’re clearing the options from the database; you’re not setting the default options. Now at this point you have no options saved. In order for the theme to work 100% correctly, you need to setup your theme option page.

    So, if you want to effectively “reset” your theme options page, you’d click “Clear Options” and after the options page refreshes, then click to Save the options page. Now the options page is saved to your database with all default settings.

    3 – Go to Theme Options and save a different image size for the GRID — NOT THE SHOWCASE BUT THE GRID. Choose 300 x 300 for kicks.

    4 – Visit your Post Showcase page. You’ll see that the showcase displays in masonry but using the width of the image from the grid (ignores the height).

    This, however, is the bug! It’s just a simple matter of the Showcase template is pulling the crop size option for the Grid option opposed to the Showcase option. I’ve fixed it for the next update.

    =======

    One thing to note I should point out about how my setup of masonry works, in case it’s not already obvious, and maybe a good note for students. In order for masonry to work right, all of the images need to be the same width.

    So this means you should select a crop size that is NOT a soft crop. For example, the 300×300 crop sizes you mentioned is a soft crop. This means that your images aren’t always going to be 300px wide.

    #19755
    Jason Bobich
    Keymaster

    Just for reference:

    Hard crop vs soft crop: When you register an image size, you can designate whether its crop mode is hard or soft. A hard crop is most common; this means that the image will always be cropped to the exact dimensions specified, which generally means some of the image will be cut off. Alternatively, a soft crop will never cut off any of the image; WordPress will scale the image down until it fits within the dimensions specified, maintaining its original aspect ratio.

    Source: http://dev.themeblvd.com/tutorial/crop-sizes/

    #19758
    Jason Bobich
    Keymaster

    Also, maybe worth mentioning, I’ve added a warning (seen when logged in) that shows if your theme options are not saved properly — which in your example steps you would have seen when you viewed your site after step #2, and probably would have helped you.

    #19764
    askwpgirl
    Participant

    The only reason I said to reset the options was so you could see the problem.

    Clearing options is not mandatory.

    The showcase masonry grid does NOT work out of the box

    The showcase masonry grid ONLY works of you change the standard post grid image size. This is the bug.

    To reproduce, do clean install of JS or clear your options. Save your options but don’t touch normal grid. Showcase post template does not show masonry until you toggle the default post grid image size. There is something deeper wrong.

    Under no circumstances will the masonry showcase grid work UNTIL you have fiddled with the default post grid image sizes and saving them. So the masonry showcase is dependent on the default post grid thumbnail being CHANGED and options saved. Saving options for Showcase will not do the trick.

    #19765
    askwpgirl
    Participant

    You need to examine how theme options are being stored in DB as they are crossing wires now resulting in showcase post template not working. Masonry showcase shortcode is fine.

    #19766
    askwpgirl
    Participant

    My point about the 300px crop was that that was the hard crop for the post grid NOT THE SHOWCASE. The showcase is picking up on post grid and doesn’t show masonry layout at all UNLESS you change image size option FIRST for post grid to ANYTHING. That then allows Vertical part of showcase to work with width coming from grid setting. Changing showcase image size doesn’t do anything unless you FIRST do something with default grid. You have been testing too much in your current install. So you have to do this from clean install because you’ve already primed the pump numerous times by messing with the default grid.

    #19767
    askwpgirl
    Participant

    Note: again this is only issue with showcase post template. Showcase shortcode is fine. So maybe it’s how template is reading the options? 🙂

    #19769
    Jason Bobich
    Keymaster

    Can you possibly link me to a page where you’ve initially set the post showcase template on a site with all fresh default options saved? So I can see the masonry not working?

    #19770
    Jason Bobich
    Keymaster

    On my end the only bug I see is that simply the post showcase is pulling the post grid image size. Masonry works, but initially, since it’s the tb_grid size, it seemingly has no effect because all images are the same size.

    #19771
    askwpgirl
    Participant

    To clarify, I think this is much simpler: showcase template is simply using grid image size. That’s all.

    #19772
    askwpgirl
    Participant

    Yes! That’s the bug!

    #19773
    askwpgirl
    Participant

    I’m writing back on my phone, so sorry messages crossed. Since grid is set to fixed height by default and showcase template is reading that not the showcase settings, then that’s why showcase masonry doesn’t work. Showcase template is using grid image size. So, yes, simple fix. Sorry to make it complicated. 🙂

Viewing 15 replies - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.