Custom 404 page

[DARKF3D3]

I'm trying to customize my 404 page, i would like to remove the left column (i don't use the right column in my theme) and show the center column at 100%, so the width of the body.

 

I try in this way but it doesn't works:

#404 #center_column { width:100%; }
#404 #left_column {display:none !important; }

If i change #404 with #category it remove the left column from the category page, so i don't understand why it doesn't works with 404 page. Any help?

[juanmlg]

Css ID identifiers ("#") are not allowed to start with a number you cant use #404.

 

Change id="404" with something similar to id="pagenotfound" and then use.

 

#pagenotfound #left_column {display:none!important;}
#pagenotfound #center_column {width:100%;}

 

That is all.

Edited April 18, 2013 by Voltiosin (see edit history)

[DARKF3D3]

Thanks Voltiosin, i try to do that but i don't understand where is set the 404 id for the body.

I looked at the 404.tpl and 404.php file but it's not there.

[DARKF3D3]

EDIT

Edited April 18, 2013 by DARKF3D3 (see edit history)

[DARKF3D3]

No one know how can i change the body id of 404 page?

[Bob Wagstaff]

The 404.tpl simply puts text in wherever the index.tpl has set the home content.

 

Whether a page has a left column is set in the header.tpl. The right column is set in the footer.tpl. You can put an "if" command in your header.tpl, so that if the page is or is not a certain page it outputs a different page layout.

 

I have done exactly this on the home page of my site (you can click on my logo below if you want to see it in action), where for the home page only I wanted there to be no left or right column.

 

To do this in the header.tpl I surrounded the following code which sets the left column

 

<div id="left_column" class="column grid_2 alpha">
 {$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">

 

with an if command to look like this

 

{if $page_name != index}
<div id="left_column" class="column grid_2 alpha">
 {$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">{/if}

 

I then did the same in the footer.tpl to remove the right column

Edited June 22, 2013 by Bob Wagstaff (see edit history)

[DARKF3D3]

Thanks Bob, that method works but i think that's not the best to use it for the only the 404 page, because the if check every page loaded so though small, but it's still a waste of resources.

 

At the moment i'm using this method but i'm still waiting to find which is the prestashop file that give 404 id to the body for replace it with another name.

Edited June 23, 2013 by DARKF3D3 (see edit history)

[Bob Wagstaff]

The format of your page is that it has below the header a div called columns and in that div further divs called left_column and center_column. Inside your center_column is a div called not-find into which your page not found text is going.

 

If you find a way to alter this without using if commands I would be interested in seeing it.