I’m woking on my portfolio and I’m using a wordpress theme called Gridly that uses masonry. I’m trying to make it so the posts align to the right rather than the left. I came across an option here that would allow me to do that by using “isOriginLeft”: false but now I just keep getting this error “Uncaught ReferenceError: Masonry is not defined” and I’m no closer to getting the posts to align right.
My portfolio is here: brittonhack.com/new/
jQuery is not my strong suit so ANY help would be greatly appreciated. Thanks!
Here’s the code that keeps producing the error.
// masonry code
$(document).ready(function() {
$('#post-area').masonry({
// options
itemSelector : '.post',
// options...
isAnimated: true,
animationOptions: {
duration: 400,
easing: 'linear',
queue: false
}
});
});
// hover code for index templates
$(document).ready(function() {
$('#post-area .image').hover(
function() {
$(this).stop().fadeTo(300, 0.8);
},
function() {
$(this).fadeTo(300, 1.0);
}
);
});
// comment form values
$(document).ready(function(){
$("#comment-form input").focus(function () {
var origval = $(this).val();
$(this).val("");
//console.log(origval);
$("#comment-form input").blur(function () {
if($(this).val().length === 0 ) {
$(this).val(origval);
origval = null;
}else{
origval = null;
};
});
});
});
// clear text area
$('textarea.comment-input').focus(function() {
$(this).val('');
});
var container = document.querySelector('#post-area');
var msnry = new Masonry( container, {
itemSelector: '.post'
});
You are initializing masonry already at the top of your document:
And at the end you initialize again (without jQuery):
The second block is redundant and throws the error. Just delete it.