I don't speak the jargon so I have to use human language

[Cinderunner]

My apologies. I do not know enough about this to even know what forum to post. My issue is with my Tumblr blog. I am using the following theme: http://minimalism-theme.tumblr.com/ For reference, here is my blog- http://properglamourposh.tumblr.com/
I took the free minimalism theme, used Tumblrs options to modify it to a 5 column setup. I post in 5 photo increments. With each subsequent 5 photo post, the 5 photos below automatically change to best accommodate the size of the photos above. This is an issue for me because my blog is visual and the photos are successive. Is there a place in the HTML that I can change some command for the columns that says- keep the integrity of the photos with each new column? Not sure If I am making sense. Sorry and hope someone can help. thank you.

[nkrisc]

The theme uses Masonry.js http://masonry.desandro.com/ to handle the columns. I don’t know enough about that particular library to give you the answer but it probably lies with some setting there. However, bear in the mind the entire purpose of this library is to do what you don’t want it to do.

[bearhead]

I believe the option you need to use is:

isResizeBound: false

You need to declare this where masonry is being initialized… I’m not sure how the theme is setup, but it might be somewhere in the one of the template files, look for something that looks like:

<script>
  $('.grid').masonry({
    itemSelector: '.grid-item',
    columnWidth: 160,
    isResizeBound: false <--this is what you'll add
  });
</script>

[Cinderunner]

Thanks for the help. I went to the edit html and ctrl f for “masonry” but it was not found. I then left the edit and went to view page source, and masonry is not found.

What I did figure out, however, is that I am thinking the theme is in rows when in fact it is in columns. I searched for a row theme but haven’t found any.

Anyway, I will continue to look around the language but there is so much of it.

[Cinderunner]

Might be in the “body grid spacing”. However, reading nkrisc response, I’m defeating the whole purpose of the theme. That said:
<meta name=”select:Body Grid Columns” content=”cs-3″ title=”3″>
<meta name=”select:Body Grid Columns” content=”cs-1″ title=”1″>
<meta name=”select:Body Grid Columns” content=”cs-2″ title=”2″>
<meta name=”select:Body Grid Columns” content=”cs-4″ title=”4″>
<meta name=”select:Body Grid Columns” content=”cs-5″ title=”5″>
<meta name=”select:Body Grid Spacing” content=”12px” title=”24px”>
<meta name=”select:Body Grid Spacing” content=”0px” title=”0px”>
<meta name=”select:Body Grid Spacing” content=”1px” title=”2px”>
<meta name=”select:Body Grid Spacing” content=”2px” title=”4px”>
<meta name=”select:Body Grid Spacing” content=”3px” title=”6px”>
<meta name=”select:Body Grid Spacing” content=”4px” title=”8px”>
<meta name=”select:Body Grid Spacing” content=”5px” title=”10px”>
<meta name=”select:Body Grid Spacing” content=”6px” title=”12px”>
<meta name=”select:Body Grid Spacing” content=”24px” title=”48px”>

(a bit further down):

        ::-webkit-input-placeholder {
            color: {color:Body Text};
        }

        ::-moz-placeholder {
            color: {color:Body Text};
        }

        input:-webkit-autofill {
            -webkit-box-shadow: 0 0 0 1000px white inset;
            -webkit-text-fill-color: {color:Body Text};
        }


        .preload.pd-line:after {
            border-bottom-color: {AccentColor};
        }

        .preload.pd-spin:before {
            background-color: {color:Body Background};
        }


        .grid {
            margin: -{select:Body Grid Spacing};
        }

        .grid > .item {
            padding: {select:Body Grid Spacing};
        }

[Cinderunner]

Now I’m just being a pest. lol. Sorry. However, I am not at all bothered by the masonry effect as it relates to the resizing of the photos…its the moving of the photos around within a “row” which irks me. I need a theme based on rows and not columns.

[bearhead]

I took a closer look at how the theme is set up, and I think Masonry is being initialized in this file: minimalism.main.min.js

Open the file and look for this section:

if (t.masonry({itemSelector: ".item",columnWidth: ".item-sizer",

Try adding isResizeBound: false, after columnWidth: ".item-sizer",

Yeah, you might be better off with a different theme… the effect from isResizeBound might not be quite what you’re looking for anyway.

[Paulie_D]

you might be better off with a different theme

This…definitely.

[Author]

Posts