나쁜 벽돌 요소 : null - 워드 프레스 사용

나는 php에서 wordpress plugin을 쓰고있다. 그 플러그인에서 나는 작은 텍스트로 그림을 출력하고 그것을 벽돌로하고 싶다. 나는 HTML에 벽돌을 초기화하면나쁜 벽돌 요소 : null - 워드 프레스 사용

, 작동하는 것 같다,하지만 사진은 중복 (? 같은 개발자) 따라서 나는 "Imagesloaded"를 사용하는 것을 시도하고있다

<div id="container" class="js-masonry" data-masonry-options='{ "columnWidth": 200, "itemSelector": ".item" }'>

하지만 ImageLoaded를 사용하려면 먼저 Masonry를 설치하고 자바 스크립트를 실행해야합니다. 내 plugin_scripts.js에 벽돌을 초기화 할 때 나는 프론트 엔드에 오류가 :

plugin_scripts.js : 프론트 엔드에서

jQuery(function() { 

alert("hallo"); 
var container = document.querySelector('#container'); 
var msnry = new Masonry(container, { 
    // options 
    columnWidth: 200, 
    itemSelector: '.item' 
}); 

});

콘솔 오류 :

Bad masonry element: null 
masonry.min.js?ver=3.1.2:1 
q masonry.min.js?ver=3.1.2:1 
d masonry.min.js?ver=3.1.2:1 
(anonymous function) schnoogle_scripts_frontend.js?ver=3.9.2:10 
j jquery.js?ver=1.11.0:2 
k.fireWith jquery.js?ver=1.11.0:2 
n.extend.ready jquery.js?ver=1.11.0:2 
K jquery.js?ver=1.11.0:2

당신이 도와 드릴까요?

출처

2014-09-12 Ben Spi

벽돌이 어떤 이유로 든 컨테이너를 찾을 수없는 것 같습니다. 나는 당신이 분명히하려고 노력했다고 가정합니다. #container이 실제로 페이지에 있는지 확인하십시오.

jQuery (현재)를 사용하는 경우 jQuery의 선택기 엔진을 사용할 수 있습니다. 페이지의 나머지가 준비 후에 당신이 그것을하고있는 있도록

var $container = $('#container'); 
// initialize 
$container.masonry({ 
    columnWidth: 200, 
    itemSelector: '.item' 
});

이가 document.ready 호출 내에 있는지 확인하십시오.

출처

2014-09-12 08:42:42 Mike

나는 WordPress에서 이것이 작동하지 않는다고 생각한다 : $ $는 WP에서 다르게 사용된다 –

당신은'noConflict' 모드에 있을지도 모른다. 단순히'jQuery ('# container')'를 대신 사용하십시오. – Mike

나쁜 벽돌 요소 : null - 워드 프레스 사용

답변

관련 문제