In the following I present the modifcations I made to several themes of elegantthemes.

The changes include

  • integrated page numbers with css (was integrated in some themes but without css support)
  • breadcrumbs in all themes
  • Link for ‘edit’ and ‘print page’ (using wp-print plugin)
  • css support for tables. This is unfortunately missing in all themes
  • alternating colors in table rows with js file, using alternate_rows.js (see forum with discussion). If you can recommend a better solution I would like to know about it.
  • css for wp_syntax and toc plugin.
  • some general bug fixes in php and css. (All bugs have been reported to the theme author, but I have no information if he fixed any of these.

Any comments, especially hints and code for improvements are welcome.

The code here is not complete. Changes that I have applied to every theme are only shown once, and tiny changes to the main css file are mostly not discussed, though these are often fixes for visible bugs. The full code can not be made availabe anyway, because these are commercial themes. The changes were applied to themes downloaded in september 2009.

Not all bugs can be fixed though. Especially the images that are loading in the css files, but are missing in the themes. With the 404 logfile I found out that these are missing:

  • themes/GrungeMag/images/content-bg.gif
  • themes/PureType/images/bullet.gif
  • themes/Simplism/images/pages-bg.png
  • themes/EarthlyTouch/images/pages-hover.gif
  • themes/EarthlyTouch/images/dropdown-bottom.png

(no guaranty that this is a complete list.

[TOC]

EarthlyTouch

Screenshots

Code

Example code which is used to integrate the breadcrumps and the edit and print link, here for page.php

<div id="container">
<div id="left-div">
    <div id="left-inside">
        <?php if (have_posts()) : ?>
        <?php if(function_exists('bcn_display')): ?><div id="breadcrump"><?php bcn_display(); ?>
        </div><div style="clear: both;"></div><?php endif; ?>
 
        <?php while (have_posts()) : the_post(); ?>
        <!--Begin Article Single-->
        <div class="post-wrapper">
            <h1 class="post-title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
                <?php the_title(); ?>
                </a></h1>
            <div style="clear: both;"></div>
            <?php the_content(); ?>
            <div style="clear: both;"></div>        
            <div class="pagenumbers"><?php wp_link_pages(array('before' => '<p>Pages:','after' => '</p>', 'next_or_number' => 'number'));  ?></div>    
            <?php edit_post_link('Edit entry.', '', ' | '); ?>
            <?php if(function_exists('wp_print')) { print_link(); } ?>
            <div style="clear: both;"></div>
        </div>

example code for page numbers, here in blogstyle.php.

<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } 
else { ?>
<p class="pagination">
	<?php next_posts_link('&laquo; Previous Entries') ?>
	<?php previous_posts_link('Next Entries &raquo;') ?>
</p>
<?php } ?>

in single.php and post.php the following code is used instead

<div class="pagenumbers">
    <?php wp_link_pages(array('before' => '<p>Pages:','after' => '</p>', 'next_or_number' => 'number'));  ?>
</div>

the ‘wp_link_pages’ code does not nearly achieve what I want from a page numbering display, but the wp-pagenavi plugin does not work on pages/posts and others do not fit my requirements of code and css styling.

additional css for sidebar listnavigation

.sidebar-box ul li a:link, .sidebar-box ul li a:visited, .sidebar-box ul li a:active { display: block; color: #373434; width: 100%; padding: 3px 3px 3px 3px; background-image: none !important; border-bottom: 1px solid #dedede; } 
.sidebar-box ul li { color: #373434 !important; list-style-type: none;}
.sidebar-box ul li a:hover { width: 100%; display: block; color: #393939; padding: 3px 3px 3px 3px; background-color: #fff; }
.sidebar-box ul { margin-left: 0px; padding-left: 0px}
.sidebar-box ul li ul { margin-left: 0px; padding-left: 20px}  
.sidebar-box h2 { margin-top: 5px; font-size: 20px; color: #4A493F; padding-top: 4px; padding-bottom: 4px; margin-left: 0px; }

Additional css file: pospiech.css

#breadcrump { background-color: #f6f6f6; padding: 5px 15px; margin-bottom: 10px; width: 583px; border: 1px solid #EBEBEB; }
 
h1 { margin-top: 20px; }
h2 { margin-top: 20px; }
h3 { margin-top: 20px; }
h4 { margin-top: 20px; }
h3.post-title{ margin-top: 0px; }
 
.articleinfo { border-bottom: 4px solid #F0EACA; margin-bottom: 14px; padding-bottom: 7px; color: #57554B; }
 
 
.current_page_item { font-weight: bold; }
.current_page_item .page_item { font-weight: normal;}
.current_cat_item { font-weight: bold; }
 
.related-posts {
	background-color: #FFF; 
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	padding-left: 15px;
	padding-top: 0px;
	display: block;
	margin-bottom: 15px; 
	margin-top: 15px;
}
 
.landingsites{
	background-color: #FFF; 
	border: 1px solid #e7e7e7;
	padding: 5px 15px; 
	display: block;
	margin-right: 15px;
	margin-bottom: 15px; 
	margin-top: 15px;
	padding-top: 15px;
}
 
/* TOC Plugin */
.toc {
  border: #ccc solid 1px;
  /*float: left;*/
  font-size: .9em;
  margin: 0 0 15px 0px;
  width: 50%;
}
 
.toc ol {
  margin: 5px;
  padding-left: 30px;
}
 
table{
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid #ebebeb;
	margin: 10px 0px;
} 
 
.blanktable {
	width: auto;
	border-collapse: collapse;
	border: none;
} 
 
 
td, th{
	line-height: 130%;
	vertical-align: top; 
	font-weight: normal; 
} 
 
 
table thead tr {
	border: solid #3badef;
	border-width: 1px;
}
 
table thead th{
	letter-spacing: .1em; 
	color:#fff; 
	background: #3badef; 
	font-weight: bold; 
	text-align:left;
} 
 
table tbody th{
	border: solid #53718b;
	border-width: 1px 0;
	text-align:left;
	background: #88b0d4; 
} 
 
table tbody tr {
	border: solid #dadada;
	border-width: 1px;
}
 
 
td, th { padding: 6px; margin: 0px; }   
table tr.even th, 
table tr.even td {background: #f6f6f6; } 
table tr.odd th,
table tr.odd td {background: #fff; }
 
tr td.tablesubheader,
tr.odd td.tablesubheader,
tr.even td.tablesubheader  {
	background: #dadada; 
	border: 1px solid #dadada;
	color: #000;
}
 
.wp-pagenavi{
	margin-bottom: 10px;
}
 
.wp-pagenavi a, .wp-pagenavi a:link {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e7e7e7;
	color: #1d8dcb;
	background-color: #FFFFFF;	
}
.wp-pagenavi a:visited {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e7e7e7;
	color: #1d8dcb;
	background-color: #FFFFFF;	
}
.wp-pagenavi a:hover {	
	border: 1px solid #3b3b3b;
	color: #3b3b3b;
	background-color: #FFFFFF;
}
.wp-pagenavi a:active {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e7e7e7;
	color: #e56100;
	background-color: #FFFFFF;	
}
.wp-pagenavi span.pages {
	padding: 4px 6px 4px 6px; 
	margin: 2px 2px 2px 2px;
	color: inherit;
	border: 1px solid #e7e7e7;
	background-color: #FFFFFF;
}
.wp-pagenavi span.current {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	font-weight: bold;
	border: 1px solid #e7e7e7;
	color: inherit;
	background-color: #FFFFFF;
}
.wp-pagenavi span.extend {
	padding: 4px 6px 4px 6px; 
	margin: 2px;	
	border: 1px solid #e7e7e7;
	color: inherit;
	background-color: #FFFFFF;
}
 
.pagenumbers{
	margin-bottom: 10px;
}
 
.pagenumbers a, .pagenumbers a:link {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e7e7e7;
	color: #1d8dcb;
	background-color: #FFFFFF;	
}
.pagenumbers a:visited {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e7e7e7;
	color: #1d8dcb;
	background-color: #FFFFFF;	
}
.pagenumbers a:hover {	
	border: 1px solid #3b3b3b;
	color: #3b3b3b;
	background-color: #FFFFFF;
}
.pagenumbers a:active {
	padding: 4px 6px 4px 6px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e7e7e7;
	color: #e56100;
	background-color: #FFFFFF;	
}