Skip to content

Commit

Permalink
Improved 404 page styling
Browse files Browse the repository at this point in the history
  • Loading branch information
@blutz
blutz committed Jan 2, 2013
1 parent ef21a73 commit 09ee2b5
Show file tree
Hide file tree
Showing 3 changed files with 48 additions and 45 deletions.
53 changes: 10 additions & 43 deletions 404.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,52 +2,19 @@

<div class="row">
<div class="span8">
<div class="page-header">
<h1><?php _e('File Not Found', 'roots'); ?></h1>
</div><!-- end div.page-header -->
<div class="alert alert-block fade in">
<a class="close" data-dismiss="alert">&times;</a>
<p><?php _e('The page you are looking for might have been removed, had its name changed, or is temporarily unavailable.', 'roots'); ?></p>
</div><!-- end div.alert -->
<p><?php _e('Please try the following:', 'roots'); ?></p>
<ul>
<li><?php _e('Check your spelling', 'roots'); ?></li>
<li><?php printf(__('Return to the <a href="%s">home page</a>', 'roots'), home_url()); ?></li>
<li><?php _e('Click the <a href="javascript:history.back()">Back</a> button', 'roots'); ?></li>
</ul>
<?php get_search_form(); ?>
<div class="fourohfour">
<span class="f-title">Oops...</span>
<span class="f-desc">Looks like we couldn't find the page you were looking for.</span>
<span class="f-verbose">404 Error</span>
<p>An administrator has been notified. If you keep getting this error email us at <a href="mailto:online@media.ucla.edu">online@media.ucla.edu</a> and we'll do our best to get it fixed.</p>
<div class="f-search">
<?php get_search_form(); ?>
</div><!-- end div.f-search -->
</div><!-- end div.fourohfour -->
</div><!-- end div.span8 -->

<aside class="span4" id="sidebar" role="complementary">
<div id="sidebar-inside">
<?php get_template_part('ad','side'); ?>


<div id="sidebar-popular">
<div class="side-head">
<h2><a href="#" id="popular-select" class="activetab" data-target="side-info-popular"><i class="ticon-eye"></i>Popular</a> <a href="#" id="commented-select" data-target="side-info-commented"><i class="ticon-personchat"></i>Most commented</a><br style="display:block;float:left;clear:both" /></h2>
</div><!-- end div.side-head -->
<div class="side-info" id="side-info-popular">
<?php wpp_get_mostpopular('limit=5&range="weekly"&pages=0&wpp_start="<ul class=\'side-popularlist\' id=\'side-popularlist-popular\'>"&wpp_end="</ul>"&order_by="views"&do_pattern=1&pattern_form="{image} {title} {stats} Comment(s)"&thumbnail_selection="usergenerated"'); ?>
</div>
<div class="side-info" id="side-info-commented">
<ul id="side-commented">
<?php
// From http://stackoverflow.com/questions/3328560/how-to-sort-posts-by-views-comments-rating-etc-wordpress
global $wpdb;
$most_commented = $wpdb->get_results("SELECT comment_count, ID, post_title FROM $wpdb->posts WHERE post_type='post' AND post_status = 'publish' ORDER BY comment_count DESC LIMIT 0 , 5");
foreach ($most_commented as $post) : setup_postdata($post); ?>
<li><a href="<?php echo get_permalink($post->ID); ?>"><?php the_title(); ?></a> <?php comments_number('0 Comments','1 Comment','% Comments'); ?></li>
<?php endforeach; ?>
</ul>
</div><!-- end div#side-info-commented -->

</div><!-- end div#sidebar-popular -->

</div><!-- end div#sidebar-inside -->
</aside><!-- end aside#sidebar -->

<?php get_sidebar(); ?>


</div><!-- end div.row -->
Expand Down
34 changes: 34 additions & 0 deletions css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1897,6 +1897,40 @@ a.page-numbers:hover {
height: 383px !important;
}

/* ====== 404 ===== */
.f-title {
display: block;
font-weight: bold;
font-size: 8em;
text-align: center;
line-height: 1.4em;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}
.f-desc {
display: block;
text-align: center;
font-family: Georgia,serif;
font-size: 1.5em;
text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
}
.f-verbose {
font-family: Georgia,serif;
display: block;
text-align: center;
font-size: 0.9em;
opacity: 0.6;
}
.fourohfour > p {
width: 90%;
margin-top: 31px;
margin-bottom: 20px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.f-search {
text-align: center;
}


/* =============================================================================
Expand Down
6 changes: 4 additions & 2 deletions searchform.php
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<form role="search" method="get" id="searchform" class="form-search" action="<?php echo home_url('/'); ?>">
<label class="hide-text" for="s"><?php _e('Search for:', 'roots'); ?></label>
<input type="text" value="" name="s" id="s" class="search-query" placeholder="<?php _e('Search', 'roots'); ?> <?php bloginfo('name'); ?>">
<input type="submit" id="searchsubmit" value="<?php _e('Search', 'roots'); ?>" class="btn">
<div class="input-append">
<input type="text" value="" name="s" id="s" class="search-query" placeholder="<?php _e('Search...', 'roots'); ?>">
<input type="submit" id="searchsubmit" value="<?php _e('Search', 'roots'); ?>" class="btn">
</div>
</form>

0 comments on commit 09ee2b5

Please sign in to comment.