New to the community? Start here

Add a blog newspage to the homepage below the slider

I know it isn't meant for it, but I would like to add an overview of blogposts under the slider in the gallery. Is there a way to do this easily, or do I have to program it from scratch?

Thanks!

Mason
- DEV MAN’s Sidekick: Earn your WPMU DEV membership
- 2,100 pts: Hero points 9,660 pts: Rep. points LEVEL 27
Hiya arnehulstein,

You're correct the theme doesn't provide an option for this. Shouldn't be too difficult to display a list of most recent posts with excerpts though. If you need any pointers to get ya started let us know.

Thanks!
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Ok, I'll take a look at it.

While we are at it, any way to slow down the slider? It changes images a tad too quickly for me.
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Btw. I did change: pauseTime: 3000 to pauseTime: 10000 in jquery.nivo.slider.js on line 531. But that does not seem to change much...

arnehulstein

Site Builder, Child of Zeus: Earn your WPMU DEV membership

67 pts: Hero points 117 pts: Rep. points LEVEL 4

Ok, getting there. I do have a slight problem with the jquery masonry I want to use. Wonder whether you would have an answer.

I have put the jquery.masonry.min.js in the libary/scripts/ folder and I call it in functions.php within the existing gallery_load_scripts:

if ( ! function_exists( 'gallery_load_scripts' ) ) :
function gallery_load_scripts() {
	$version = '1.3';
	if ( !is_admin() ) {
		wp_enqueue_script("jquery");
		wp_enqueue_script( "slideshow", get_bloginfo('template_directory') . "/library/scripts/nivo-slider/jquery.nivo.slider.pack.js" );
		wp_enqueue_script( "fancybox", get_bloginfo('template_directory') . "/library/scripts/fancybox/jquery.fancybox-1.3.4.pack.js" );
		wp_enqueue_script( "mousewheel", get_bloginfo('template_directory') . "/library/scripts/fancybox/jquery.mousewheel-3.0.4.pack.js" );
		wp_enqueue_script( "jqueryeasing", get_bloginfo('template_directory') . "/library/scripts/fancybox/jquery.easing-1.3.pack.js" );
		wp_enqueue_script("masonry", get_bloginfo('template_directory') . "/library/scripts/jquery.masonry.min.js");

		if ( is_singular() && get_option( 'thread_comments' ) && comments_open() )
		wp_enqueue_script( 'comment-reply' );
	}
}
endif;

On the homepage I have commented out the custom elements and I then call the masonry script in home.php through:

/*
locate_template( array( '/library/components/option-socialbuttons.php' ), true );

if (($homecontent == "") && ($socialbuttons == "") && ($slideshow == "")){
	locate_template( array( '/library/components/slideshow-partial.php' ), true );
}

locate_template( array( '/library/components/option-content.php' ), true );
*/

?>

<?php while (have_posts()) : the_post(); ?>
<?php if(has_post_thumbnail() ) { ?>
<div class="loop-entry">
        <div class="loop-entry-thumbnail">
            <a href="<?php the_permalink(' ') ?>" title="<?php the_title(); ?>"><?php the_post_thumbnail(); ?></a>
        </div>
  	<div class="loop-entry-details">
    	<h2><a href="<?php the_permalink(' ') ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
    	<?php the_excerpt(); ?>
<!--     	<a href="<?php the_permalink(); ?>" title="Read the rest of <?php the_title(); ?>" class="more-link">Read the rest of this entry »</a> -->
    </div>
    <!-- END loop-entry-details -->
</div><!-- END entry -->

<?php } ?>
<?php endwhile; ?>

My last problem now is that I would like masonry to show 8 posts in 4 columns. However, it seems as if it always wants to add an extra one. Any thoughts? Check: ikensocialmedia.nl

arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Oh, changed the method for getting the post thumbnails to get_the_post_thumbnail() to get the featured images, but they are still way to big to load. Annoying...

And I changed the loader in library/components/slideshow.php to:
```
<script type="text/javascript">
  jQuery.noConflict();
jQuery(function() {
    jQuery('#slider').nivoSlider({
	effect:'fade'
});
});
</script>
```
Instead of:
```
<script type="text/javascript">
  jQuery.noConflict();
jQuery(window).load(function()  {
    jQuery('#slider').nivoSlider({
	effect:'fade'
});
});
</script>
```
Which allows it to start without loading all images on the page first.

Now all that is left is to sort the size of the featured images and the fifth column for the masonry.

All suggestions are very, very welcome.
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Hi arnehulstein,

My last problem now is that I would like masonry to show 8 posts in 4 columns.

Fixing the grid display is a rather easy css fix (also discussed here: https://premium.wpmudev.org/forums/topic/single-product-on-category-page-sitting-alone-on-a-row-while-there-are-four-products-on-the-rows-above-and-below#post-198699 )

In your theme's stylesheet, modify the style rules for .loop-entry as follows:
```
.loop-entry {
float:none;
display:inline-block;
vertical-align:top;
margin-right:7px;
}
```
I can't say why the script is adding a 9th entry but, if you can't pin down the problem, that too could well be resolved with css. Try adding the following to your stylesheet:
```
.loop-entry:last-child {
display:none;
}
```
Hope this helps! :slight_smile:
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Aha, just saw you posted again while I was writing an answer :slight_smile:

Now all that is left is to sort the size of the featured images and the fifth column for the masonry.

Try changing the width in .loop-entry to 185px in your stylesheet, and add the following rules to .loop-entry-thumbnail img, like so:
```
.loop-entry {
width:185px;
}
.loop-entry-thumbnail img {
max-width:162px;
height:auto;
}
```
Hope this helps! :slight_smile:
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Ok, thanks for the suggestion. That got me on my way. Changing them as you said didn't quite work out as it then listed the items vertically. However, when I added the width for an item back on 235px, it miraculously worked. :slight_smile:

However, the last-child fix did not. :slight_frown: The changes have removed the last child from the middle of the page and have now moved it to the bottom...

Any new insights on this?
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Weird. For whatever reason, get_the_post_thumbnail just stopped working. Can get the images by using the_post_thumbnail though.
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Hi again arnehulstein,

Huh... Yup, I just refreshed the page on your site and saw that the images have indeed disappeared.

Odd, the last-child selector should work :slight_frown:
Let's try getting down and dirty with the last-child technique by getting real specific:
```
div.loop-entry:nth-last-child(1) {
display:none;
}
```
Also odd: in Firebug, setting the image width to 162px and the div width to 185px (along with the other rules) works to create a 5-column grid on your page.
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
I came across an article somewhere that said that there is a good chance that it has to do with masonry not being able to estimate the height of the whole thing. Apparently the slider makes that difficult. They suggested in that article to add an overflow:hidden to it, but that does not change anything either.
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Ah, the images are back... take 2! Gimme a few minutes...
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
While waiting I tried your
```
div.loop-entry:nth-last-child(1) {
display:none;
}
```
solution, but that makes no difference.
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
I have found that it does work fine if I limit the maximum number of blogposts that can be shown to 8 by assigning them to a separate category and filtering on that.

Wish there was something as easy as post_limit=(8); for this. :wink:
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Ok, I took a look at your stylesheet (lightroom.css) and everything looks fine. The changes I make in Firebug work fine too.

The only other suggestion I can come up with for now is to try and add the style rules to your theme's main stylesheet to see if they take.

On that note, I also see that you are using the Gallery parent theme. If you are customizing and don't want to lose those customizations when you update the theme, it's preferable to move all your custom work to the child theme and activate that instead. Styles would then go in _inc/css/child-style.css
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Dropping it into the main css did the trick.

However, I am not sure how to transfer all the changes to a child theme. I can rummage along quite nicely with php and all that, but I am not a real programmer. :wink:

However, I can take a stab at it. After I make this site work. :slight_smile: I will then restructure into a child theme. Will post questions about that later this week then.
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Yes, your 4x2 grid looks great! Maybe just add a margin-bottom:15px; to .loop-entry to give the entries a bit of breathing room.

Wish there was something as easy as post_limit=(8); for this. :wink:

Lol. That reminds me of a quote I recently came across from Bertrand Russell (while reading up on Occam's Razor) in his Introduction to Mathematical Philosophy: "The method of 'postulating' what we want has many advantages; they are the same as the advantages of theft over honest toil. Let us leave them to others and proceed with our honest toil."

:slight_smile:
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Handy links to learn all about child-themes here:
https://premium.wpmudev.org/the-buddypress-manual/what-are-parent-and-child-themes/
http://codex.wordpress.org/Child_Themes

See you later in the week then... have fun, and have a great day!
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
Thanks pcwriter, that was the end of that great day for me. Spent the rest in the garden fiddling with the pond. Anyway, back at it now and trying to get the rest of the theme sorted.
Patrick
- Support Monkey: Earn your WPMU DEV membership
- 6,814 pts: Hero points 10,288 pts: Rep. points LEVEL 28
Hi arnehulstein,

The page looks great now!

And thanks for the points... much appreciated :slight_smile:
arnehulstein
- Site Builder, Child of Zeus: Earn your WPMU DEV membership
- 67 pts: Hero points 117 pts: Rep. points LEVEL 4
:slight_smile:

And it isn't finished yet. I need to do new pictures for the blogposts and set caching for the site to speed it up.

And I am working on getting the event+ plugin to do what I want, but that isn't that easy just yet...