Support » Themes and Templates » Twenty Twelve – Integrate jQuery Masonry

  • Hi,

    I’m new to WordPress and looking for a way to integrate Masonry into my homepage. The goal is to give a clean Twenty Twelve child theme a Masonry index page. The rest of the site unaffected. I only managed to enqueue jQuery and call the Masonry JS script which isn’t much. Tried several integration instructions with no success. I’m really a beginner at this and I’m not comfortable with PHP. Is there a simple way to make this happen or is it better for me to just go for a theme which already has the Masonry integated?


Viewing 5 replies - 1 through 5 (of 5 total)
  • WPyogi


    Forum Moderator

    Have you looked at the galleries in JetPack?

    Tiled Galleries in Jetpack are nice example. But, if I understand correctly they organize pictures in tiles within the posts and what I’d like to get is one level up in the organization. And that is organizing posts in tiles/boxes within homepage. This theme is nice example: I’d like to get similar tiles/boxes on my homepage but using the default Twenty Twelve leaving the rest of the theme unchanged.

    I tried adding this to functions.php in my TwentyTwelve child theme:

    function my_masonry() {
    	if (!is_admin()) {
    		wp_register_script('jquery_masonry', get_template_directory_uri(). '../../twentytwelvechild/js/jquery.masonry.min.js', array('jquery'), '2.0.110526' );
    		add_action('wp_footer', 'add_my_masonry');
    		function add_my_masonry() { ?>
    						itemSelector: '.post',
    add_action('init', 'my_masonry');

    This seems to work.




    Thanks, this worked great!

    Hi Matija80,

    I’ve tried your code (with only the script name is different)…

    But nothing gets changed.

    Do we need to change the HTML (e.g. Post content area has ID = content… Posts have class = …. post… ?

    I commented out the get_sidebar PHP… Now… The index page with the posts in reverse chronological order without blank space on the original side bar position …

    Would you mind sharing what you did to make masonry work for twenty twelve theme?

    Many thanks …

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Twenty Twelve – Integrate jQuery Masonry’ is closed to new replies.