Remove sidebar 2?

Hi Martin, give the following CSS a try.

.widget-area {
    width: 294px;
}
.content-area {
    width: 882px;
}
.site::before {
    width: 25%;
}

If you have not yet done so, I would suggest creating a child theme so that any customizations you make will not be overwritten by a future theme update. Alternately you can use the Edit CSS function in the Jetpack plugin, or use one of the other Custom CSS plugins that will keep CSS changes from being overwritten.

Child Themes
Child Theme creation plugins
Jetpack plugin
Custom CSS plugins

Thank you very much, it worked perfectly ??

One more quick question if you don’t mind – I’m trying to double the size of the post image, i typed in the following:

.post-thumbnail {
	width: 288px;
	height: 192px;
}

The image doesn’t scale, but it makes the extension from the image completely black. Do you know whats wrong here?

Thank you once again ??

Glad Richard’s code worked well for you!

The image doesn’t scale, but it makes the extension from the image completely black. Do you know whats wrong here?

I don’t recommend using CSS to change image sizes, as the image quality will degrade as it becomes stretched out. (And as you’ve seen, it’s not a reliable method in any case.)

Could you provide a link to show me where exactly you’re trying to reduce the size of the image, and I’ll help you with a better method. Thanks!

Hi Kathryn,

https://www.martytravels.co.uk is the site,

the default featured post image is 144px x 96px, using the code I put above just makes that black extension instead of making it scale bigger. So strange!

What do you think could be up?

Thank you!

Oh i’ve come across a little problem, on my phone everything is cut off because of the removal of a side bar, in the CSS code it looks as if it has different themes for different resolutions…

I tried to use this code `@media screen and (min-width: 1056px) {
.widget-area {
width: 220px;
}

.content-area {
width: 950px;
}

.site::before {
width: 20%;
}

.post-thumbnail {
width: 288px;
height: 192px;
}’

But the Edit CSS within jetpack doesnt allow it and deletes it for some reason.

Any ideas on this one?

Sorry for all the questions, haha!

And thank you ??

Looks like you’re missing a closing } in your code above – try adding it to the very bottom of your code chunk there.

Aha. Oops.

Thank you very much ??

Do you see what I mean with the post images not scaling properly?

The .post-thumbnail code doesn’t seem to scale it properly.

I’ll have a fiddle and let you know

the default featured post image is 144px x 96px, using the code I put above just makes that black extension instead of making it scale bigger. So strange!

Right – that’s because the featured image size is set using a function in the theme, which outputs a height and width in the HTML. It’s not possible to change this properly just with CSS:

<img width="144" height="96" src="https://www.martytravels.co.uk/wp-content/uploads/2015/08/Sapa1.jpg" class="attachment-post-thumbnail wp-post-image" alt="This is a test" />

To do what you want properly, you’ll need to create a child theme and add a new function. Making a child theme means your tweaks won’t be overwritten when updating the theme. Here are some guides in case you haven’t made one before:

https://codex.www.ads-software.com/Child_Themes
https://op111.net/53/
https://vimeo.com/39023468

Would you be comfortable doing that? Let me know if you want to go the child theme route and I can help you with the necessary function. (Once you have a child theme set up, you could transfer your custom CSS there – you don’t need both.)

Wow, thank you very much for the info on child themes!

I have two 14 hour shifts at work, so I won’t be able to give it a go for a couple of days, but I’l be sure to reply here if I have any issues!

Thanks again, Kathryn!

Good luck and let me know how it goes!

Hey I’m back – I managed to get the child theme to work, I cut the code from the edit css on the backend to the style.css on my child theme, activated the child theme and it seems to be working same as before ?? !

I’ve got the following in my functions.php

<?php
/**
* Enqueues child theme stylesheet, loading first the parent theme stylesheet.
*/
function themify_custom_enqueue_child_theme_styles() {
wp_enqueue_style( 'parent-theme-css', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'themify_custom_enqueue_child_theme_styles' );

not sure if that’s correct but I copied it from somewhere ??

Just making sure you haven’t forgotten about me ??

Hi there – glad you got your child theme working, I checked your site and the child theme is indeed active.

So let’s say you want to double the size of the maximum dimensions for the thumbnail featured image on the blog page.

Try adding this to your child theme’s stylesheet:

.post-thumbnail {
  width: 288px;
}

You’ll also need to add this function to your child theme’s functions.php:

function publication_child_featured() {
  set_post_thumbnail_size( 288, 288, true );
}
add_action( 'after_setup_theme', 'publication_child_featured', 11 );

This should work for newly uploaded images. If you want to resize images you’ve already uploaded, you’ll need to run a plugin like Regenerate Thumbnails.

Let me know how it goes.

Just making sure you haven’t forgotten about me ??

No need – I get an email for everything posted in our forums here and answer every thread. It was a holiday long weekend here. ??

You’re awesome, thank you very much, it worked great!

1 last question – I promise!

Is there a way to move the content to the left a bit more? I’m guessing this would be a padding fix, but there are so many on the site I have no idea which is which haha!

I increased the content area width to 1100, just to see how it would look, but it makes it wider by increasing it’s width to the right, if that makes sense?

So right now there is a white space on the left side of the screen, especially when you go into a post.

Am hoping you know how to move it to the left a bit more?

Again, thank you so much ??