A bunch of questions

[Steven Bill]

Hi Bill,
Okay, so here are a bunch of questions I have – thanks again for your patience!

1. In the demo, when I click on a Podcast or a Staff, I get a full picture and an overlay of the text. But when I do it with my content (and even the content from the demo I still have) I don’t get a pic at all. I’ve set the featured image – but still nothing. Take a look: http://grassrootschurch.info/podcast/the-pursuit-of-discipline-part-2-bible-reading/

2. Is there a way to get a feed of “Latest Podcasts” into a widget?

3. Can I make the sidebar below the slider the same width as the slider? You’ll notice what I’m talking about here: http://www.grassrootschurch.info – and also would this allow me to put in a 4th widget in there?

4. If I make changes to the PHP and then later update the template to the latest version, won’t I lose it? What do I need to ensure the changes I make don’t get lost upon an update?

5. When the page loads, it takes a long time to show. Sometimes 8-10 secs before the slider/top box shows up. Is this fixable? See attached screenshot.

Attachments:

1. 

   Screen-Shot-2014-10-03-at-11.43.56-PM.png
   

[Bill Robbins]

Good questions. Let’s find answers for you:

1. You’ll want to use the image “format” to have that layout appear. When you’re editing a podcast, page or post, look on the right hand column and you’ll see a box labeled format. Choose image from there and update your podcast. That should place the featured image and content into a layout that’s similar to the home page.

2. You can get your latest podcast episodes in a widget. The simplest option would be to use a plugin like Ultimate Posts Widget (https://wordpress.org/plugins/ultimate-posts-widget/) which will let you add a list to a widget.

3. You can make the lower widget area wider to match and also fit in four widgets across. Add this to the Custom CSS:

@media only screen and (min-width: 1250px) {
	
	.front {
		min-height: 770px;
	}
	
	.home #home-sidebar {
		height: 890px;
	}
	
	.lower-sidebar {
		width: 1200px;
	}
	
	.lower-sidebar aside {
		width: 275px;
		margin: 17px;
	}
	
}

.lower-sidebar {
	min-height: 340px;
}

That will make it wider for you. The only other thing we’ll have to do is disable the masonry script that runs in the bottom sidebar. It lets items of varying heights line up nicely, kind of like Pinterest.

To do that, go to the Appearance section and select Edit. From the list of files on your right, choose custom-js.php and find these lines:

		var $jcontainer = jQuery('.lower-sidebar');
		$jcontainer.imagesLoaded( function(){
			$jcontainer.masonry({
				columnWidth: 320, 
				itemSelector: '.widget' 
			});
		});	

and delete them. Then save your changes. That will allow the widgets to have a new width on the larger sized screens.

4. The best way to make changes to a theme is with a child theme. I have a quick post at https://support.organizedthemes.com/child-themes/ that can walk you through how to create them.

5. The slideshow is what sets the layout on the home page and it doesn’t pop open until all the slides have loaded. So you’ll want to make sure you keep the images there as small as possible files size wise. That will speed things up.

I also added in a min-height in one of the styles I pasted above for the slider. That will cause it to be open even before the images appear there. That way the rest of your page’s content should be visible.

Let me know about questions you have.

Have a great week,
Bill

[Steven Bill]

Hi Bill,

Thanks again for your response. I need to do some more work on this but essentially when I created the child theme I seemed to have lost all of my settings? And then when I went to put them back in, my slider didn’t widen.

Additionally, my lower widget is now wider but the 4th widget goes down below. How can I adjust it so that it would stay on the same level?

I’ll have more questions, no doubt. BUt thanks for getting to these first.

Cheers,
Steve

[Bill Robbins]

Good Morning Steve,

Let’s tackle the footer widget first. It looks like we need it just a bit smaller. In the snippet from earlier, change this:

	.lower-sidebar aside {
		width: 275px;
		margin: 17px;
	}

to this:

	.lower-sidebar aside {
		width: 265px;
		margin: 17px;
	}

I believe that will let four widgets fit across. You can adjust the width there to make further adjustments if you need to.

Looking at the custom CSS via the child theme, it looks like only the snippet from this form post is in there. You may just have to manually add it back in.

Here’s how I would approach moving these customizations to a child theme. Activate the parent theme. In the appearance section, go to the options import/export and export your options. Then activate the child theme. If the settings aren’t there any longer, then you can import them using the same tool you exported them.

Also since you’re using a child theme, I would skip on using the Custom CSS box and instead add the CSS snippets to the bottom of the child theme’s style.css file. That will be a bit more efficient too.

Let me know how it goes,
Bill

[Steven Bill]

Okay great – things are cooking now. I still need to master the Mega Menu but we’re getting somewhere here.

1. Somehow I removed my logo via CSS I think. I have no idea how I did this. I can display a text logo but not an image. I’m seeing CSS is a powerful tool! Any idea where this might have gone?!

2. Also, what would you say is the optimal size for my images now? 960×620 isn’t since I’ve increased my size. It’s hard to know what size I ought to be making things.

3. When I edit a file like archive-staff.php – will that not update to the original when I update the theme down the road?

4. Also, I notice that my podcasts no longer have images behind them on the archives page. Where did I mess that up? Was that somehow connected to the staff archive page?

5. Now I don’t know if this has anything to do with your theme, but the menu (Mega Menu) doesn’t show up on the Upcoming Events page. Do you know why this might be?

Again, your prompt responses have been awesome and greatly appreciated. Thanks a million for this!

[Bill Robbins]

Good Morning Steven,

Hope all is well today. Let’s see if we can find answers for your questions:

1. CSS is quite powerful indeed. Looking in the child theme’s style.css file, I believe this line is the culprit in hiding your logo:

a img, a:visited img, a:hover img { border: none ; display: none;}

The display: none; there means that all links that have an image inside them will not be displayed. If you do need to hide some image links, I would shoot for something with more specificity so you’re not affecting ones unintentionally.

---

2. I would shoot for 1200 by 780 for the new image sizes. If you’ll look at https://support.organizedthemes.com/forums/topic/site-widening/ it’ll show you how to change the size in WordPress so it gets the correct image size to your site.

---

3. What you’ll want to do is copy any files you need to edit from the parent theme to the child theme. That way you can edit them there and the changes will be preserved when an update is applied.

Most files can be edited that way. The ones that can’t be are the ones in the “includes” folder. Those are a bit trickier because you have to create a new function to replace the one in the parent theme. It can be done if you need to though.

---

4. I think the podcast images are missing for the same reason as the logo. Once that’s changed they should come back.

---

5. Great question there. In the Events Calendar settings, there is an spot where you can specify a template to use for the calendar page. Try going with the full width template and see if that doesn’t bring everything back up like it should be.

---

I hope that helps out. Let me know if you need anything else,
Bill

[Steven Bill]

Hi Bill,
3. To move the files do I do this via FTP then? And it looks like I would need to make changes to the include folder as I’m adjusting the images.php file in that folder.

The rest of these answers are great – was able to make the appropriate changes. Thanks!

[Bill Robbins]

Yes, FTP is a great way to move those files over. Honestly, I would just edit the images.php in the parent theme. That’s not hard to change again if you need to in the future.

Have a good night,
Bill

[Author]

Posts