Lewis Bilsland Design

Illustration

T-Shirt concept artwork

blog

Archive for January, 2010

Read more function

I decided to place some excerpts on my home page, this helps give users an insight to the blog before clicking through, it’s something that gives a reader more choice which can’t be a bad thing.

To do this you need to insert the following code into your function.php file, there is a part of the code where you can design your own arrow or more link button:

add_filter('excerpt_length', 'my_excerpt_length');
function my_excerpt_length($length) {

return 35; }
//function to replace invalid ellipsis with text
function elpie_excerpt($text)
{

return str_replace('[...]', '<a href="'.get_permalink().'"><img src="yourpathhere/readmore.jpg" alt="" /></a>', $text);
}
add_filter('the_excerpt', 'elpie_excerpt');

Now all you need to do is edit your page template to include the following code, you can wrap with a css style to colour the fonts, rollovers etc:

<ul id="recent-items">
<ul>
<?php
$recentPosts = new WP_Query();
$recentPosts->query('showposts=2');
?>
<?php while ($recentPosts->have_posts()) : $recentPosts->the_post(); ?>
<li><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a><br /><?php the_excerpt(); ?></li>
<?php endwhile; ?>
</ul>
</ul>

January 26, 2010 Posted by Lewis Wordpress, php No Comments »

Slinkachu

Slinkachu is a London based artist who creates minature street-based installations and then photographs them. The tiny people are crafted from model train set figures and are placed in urban settings to capture a slice of everyday life in minature. The image below is named “Company Car” check out the Slinkachu site for more of these amazing scenes.

January 26, 2010 Posted by Lewis Art No Comments »

Nextgen Gallery

The best slideshow that I have found for wordpress is the nextgen gallery, the main plus point is that it can be controlled via the admin area, making it easy for clients to upload images to specific pages, it can be fully customised, with options for multiple slides, captions and transitions.

It uses the the JW image Rotator which costs around £35.00 for a licensed version.

January 17, 2010 Posted by Lewis Wordpress No Comments »

Styling comments

Wordpress is great when used as a cms, one thing many forget to apply is styling to the comments pages, comments can be fully configured and styled to tie in with the overall look and feel of a new site, using graphics and css styling can also enhance the usability of the comment feature, to style the comments on my site i used the following code:

The php code

This was added to the comments.php file:

<ol>
<?php foreach ($comments as $comment) : ?>
<li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>">
<cite>
<?php if(function_exists('get_avatar')) { echo get_avatar($comment, '35'); } ?>
<span><?php comment_author_link() ?></span><br /><span><?php comment_time() ?></span> on <a href="#comment-<?php comment_ID() ?>" title=""><?php comment_date('F jS, Y') ?></a> <?php edit_comment_link('edit','&nbsp;&nbsp;',''); ?>
</cite>
<div><?php comment_text() ?></div>
<?php if ($comment->comment_approved == '0') : ?>
<em>Your comment is awaiting moderation.</em>
<?php endif; ?>
</li>
<?php
/* Changes every other comment to a different class */
$oddcomment = ( empty( $oddcomment ) ) ? 'class="alt" ' : '';
?>
<?php endforeach; /* end for each comment */ ?>
</ol>

Stylesheet

All you need to do is add this to your stylesheet, and create a background image for the comment list ul, the comments are also gravatar enabled.

.commenttext{
padding: 10px 0px 0px 0px;
line-height: 18px;
}
.commentsheading {
padding: 3px 5px 3px 0px;
margin: 0px 0px 8px 0px;
text-decoration: none;
}
.alt {
margin: 0;
padding: 10px;
}
.commentlist {
padding: 0;
text-align: justify;
}
.commentlist li {
background: #f3efec url('images/comment_background.jpg') repeat-x left top;
margin: 15px 0 10px;
padding: 15px 15px 10px 15px;
list-style: none;
}
.commentlist li ul li {
margin-right: -5px;
margin-left: 10px;
}
.commentlist p {
margin: 10px 5px 10px 0px;
}
.children { padding: 0; }
#commentform p {
margin: 5px 0;
}
.nocomments {
text-align: center;
margin: 0;
padding: 0;
}
.commentmetadata {
margin: 0;
display: block;
}
.commentlist li, #commentform input, #commentform textarea {
font: 0.9em Helvetica, Arial, sans-serif;
}
.commentlist li ul li {
font-size: 12px;
}
.commentlist li {
font-weight: bold;
}
.commentlist li .avatar {
float: left;
padding: 0px 10px 0px 0px;
}
.commentlist cite, .commentlist cite a {
font-weight: bold;
font-style: normal;
font-size: 12px;
}
.commentlist p {
font-weight: normal;
line-height: 18px;
text-transform: none;
}
#commentform p {
font-family: Helvetica, Arial, sans-serif;
}
.commentmetadata {
font-weight: normal;
}
#commentform input {
width: 170px;
padding: 2px;
margin: 5px 5px 1px 0;
}
#commentform {
margin: 5px 10px 0 0;
}
#commentform textarea {
width: 100%;
padding: 0px;
}
#respond:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#commentform #submit {
margin: 0 0 5px auto;
float: left;
}

January 17, 2010 Posted by Lewis Wordpress No Comments »
RSS Feed
Follow me on twitter