Delete right column from wordpress

I’m sorry that this is going to be probably a very basic question, but am just starting out with wordpress for a client.

I downloaded the allegiant theme, and just started looking at it, and need it as a website rather than a blog.

But when I look at the home page there a section on the right that has the following titles, Recent Posts, Recent Comments and so on, and basically I dont want all that on the right side of any of my pages.

This is here - http://www.accend4web.co.uk/ridgeway/

Check your widgets area (find Widgets in the dashboard under Appearance). Those items might be placed in the right sidebar as widgets. If so, all you need to do is drag them off that section in the widgets area.

If you are going to make structural changes to a ready-made theme, it’s probably best to build a child theme on top of it, instead of changing the theme itself.

Ah great ye thats done it, but does that then mean that there still a right column there that will take up the space, even though there nothing in it.

Umm ye I did get some advice on the child theme idea, and what I have done so far is put the sitemap in a child theme, and have made some changes there, and then loaded the child theme in.

I’m thinking of upgrading them theme to the pro version as it seems to give you a lot more options to style the pages, what would you do?

It depends on how many changes you want. If you buy the pro version, even if there are more options for styling you will still be restricted to what they allow you to do with the theme. And it sounds to me like you want to make quite a few changes, so I would go with a child theme where you can adjust the code to suit your own needs.

The right column will still be there even if empty if it is given some kind of a width in the css, or if the main area is given a width less than 100%. But you can remove the right sidebar altogether in the child theme.

Ah I got you, so I can dictate these things in the style sheet in the child theme.

So with the child theme if for example I wanted to make a home page, do I put that in the child them and reference it like I did for the sitemap.

In honesty, I’m gutted that the client wants to go down the wordpress route, I think its much easier to build the site by hand and then put a small cms on it so they canchange a few htings, its seems an awful lot of hasstle for not much reward.

Sorry also on the home page, the Hello Word post thats there, is that still a blog option, and is that a widget?

Hey thanks for the help too, should have said earlier

You can also change the theme code in the child theme (never use the main theme). So yes, you can make a home page. Often this template is called front-page.php.

Once you learn how a WordPress theme is structured, it is as easy to build a theme from scratch as it is to build a static website. That’s what I do. You don’t need all the extras that ready-made themes have. Then you don’t have to worry about child themes either.

But there is a bit of a learning curve, so try it on a personal project first if you have time.

The “Hello World” post is just a sample post that comes with the WordPress installation. You can find it if you go to Posts > All Posts in the dashboard. You can change that or delete it if you want.

So to use the child theme, do i literally take a copy of the main theme and put all that in the child theme and work on it from there.

So basically all you do is copy the file you want to change with its file structure to the child theme folder, work on it, save and upload and that will work.

Do I have to tell it to use the child theme file instead of the main theme file, thats the bit i dont get.

WordPress will look for the file in the child theme and then if it can’t find it there it will go find it in the main theme.

I see, ok. I have only so far put the style.css file into the child theme, and at the top I added this

/*
Theme Name:     Allegiant Child Theme
Theme URI:      https://www.elegantthemes.com/gallery/foxy/
Description:    Allegiant Child Theme
Template:       allegiant
Version:        1.0.8
*/

@import url("../allegiant/style.css");

/* =Theme customization starts here

So do I add that at the top of every file that I customise in child theme, and the file that I do customise has to be in the same folder order I presume as the original theme, but tailor the path for import to the one I’m editing.

Why I am asking, is that there is a style sheet called base.css and I have added the code below and any changes I make to that file in the child theme, are not being picked up.

/*
 Theme Name:     Allegiant Child Theme
 Theme URI:      https://www.elegantthemes.com/gallery/foxy/
 Description:    Allegiant Child Theme
 Template:       allegiant
 Version:        1.0.8
*/

@import url("../allegiant/core/css/base.css");

/* =Theme customization starts here
------------------------------------------------------- */ 

Maybe its the path thats wrong, I’m not sure. Do I call the original file from the position of where the file is withing the structure?

I’m wondering as its my first go, to maybe stick with the upgrade for now and work around it best I can. The client isnt demanding, and could get away with it and use it to get used to this way of doing websites.

But I suppose if I was to take an exact copy of the theme put it in the child theme, I could like you say design it almost like a normal site, I’ll have a think, but if you could let me know if I use that code above on every child page I edit, that would be a start for me.

Cheers

That code only goes on the main style sheet, not on any of the php template files.

Have you read the section in the WordPress documentation about child themes? Their instructions are pretty good.

Morning, ye I just found a video and a tutorial but I’m still struggling with a different css file.

I have worked out what to do with style.css and functions.php, they are now files inside the child theme folder, but there another css file and thats called base.css in the theme and I need to change things in there. So I created a new css file in the child theme and called it base.css, pasted in the code I wanted to change, saved, uploaded and nothing.

So as this css file in the main theme isnt directly inside the theme folder, I copied the folder path, and placed base.css file in that, so basically inside the child theme I now have /core/css/base.css, that is how it is in the main theme and again the changes arent being shown.

Good morning. It’s still very esrly here. If you can wait a few hours I will try to duplicate this on my laptop and see what the issue is…

Oh brilliant, and no worries your in the US are you.

I have moved it on though, got the index, header and footer working fine in the child theme, just cant work out that other stylesheet, but thank you for getting back to me

Actually, I’m in Canada. :slight_smile:

In the meantime, have you taken a look at the cascading effect of the stylesheets? There might be something that is over-riding the change you want to make. And as a last resort (not recommended except rarely) did you try adding !important after the style you want to change?

Ah Canada, beautiful country, would love to live there, Wales Im at.

Thanks again for getting back to me, but ye just added !important and nothing, and I am right to keep the same file structure arent I?

I just tried to add some new css into it and again had no effect, you can see it if you go to the site and use the inspector and what I have tried to do is reduce the padding between the top of the slider and the bottom of the header by changing this

.main {
overflow: hidden;
padding: 30px 0 10px !important;
}

to

.main {
overflow: hidden;
padding: 0px 0 10px !important;
}

In base.css in the child theme. Here is my site again - http://www.accend4web.co.uk/ridgeway/

You may be using old child theme practice.

https://codex.wordpress.org/Child_Themes

The only required child theme file is style.css, but functions.php is necessary to enqueue styles correctly (below).
The final step is to enqueue the parent and child theme stylesheets. Note that the previous method was to import the parent theme stylesheet using @import: this is no longer best practice, as it increases the amount of time it takes style sheets to load.

If your child theme style.css contains actual CSS code (as it normally does), you will need to enqueue it as well. Setting ‘parent-style’ as a dependency will ensure that the child theme stylesheet loads after it.

1 Like

Hi Mittineague,

So by the looks I take the @import away and instead reference it via the functions.php page using the script shown in the link.

It does mention about a second style sheet, and its a bit heavy, so could you with what I have posted the path and the base.css file, show me what that code should possibly look like that I post in functions.php

Would this be the issue me and WebMachine have been trying to work out?

I have been experimenting with the free SitePoint Base theme.

According to the readme.txt file

If you do decide to use a child theme with Sitepoint Base, there’s no need to use CSS @import or even enqueue the parent stylesheet. Sitepoint Base will automatically enqueue the parent stylesheet for you. Cool eh!

So I don’t know if I got things right or the theme is doing magic. My current functions.php fie is

function my_theme_enqueue_styles() {

    $parent_style = 'sitepoint-base-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'sitepoint-base-child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

The trouble is I have literally just started using wordpress this week, so this is so much different than the tutorials that I found to get me started.

But I think I understand the above, and so is it that this goes into the function.php file and we lose the @import thats at the top of the style.css file.

But I have the problem of that stylesheet base.css down the folder structure /core/css/base.css inside the theme folder ‘allegiant’, thats not forcing the change with the changes I’m making to it in the child theme folder

If you want the main content area to take up the entire width, you can add this to the site style.css file in the child theme (I added it just under the .wrapper styles). It seems to over-ride the css in the base.css file.

.content {
	width: 100%;
}

and if you want it to just affect the home page (which has a body class of home) you can use this instead:

.home .content {
	width: 100%;
}

That is one possible solution.