Posted 4 months ago #
Currently, the Continue Reading on all my posts is not lined up. I would like all my post to be lined up and understand it can be done thru excerpts. I read the information and how you have to put the code in the loop ... but not sure where to do that. My blog is http://www.commonpeople.sg/v1/.
Thank you.
You're already using the_excerpt() and I don't think that replacing it with the_content() is really going to help. One way to get all of the Continue Reading links to line up is to use the Optional Excerpt on each Edit Post page and tweak each one until all of the links line up.
Or you'd need to amend your template to incorporate a new class that encloses the_excerpt() and give that class a fixed height via CSS.
Posted 4 months ago #
Thank you esmi ....ehr ... how do I do the last option please?
Or you'd need to amend your template to incorporate a new class that encloses the_excerpt() and give that class a fixed height via CSS.
Posted 4 months ago #
In your style.css find:
.featured-content P and add height 150px
and in .featured-content also height 150px
that did it for me.
Posted 4 months ago #
Thanks Henk ... tried that but it does not do it for me ... maybe it has to do with the template ... or my poor skills ... keke :)
I pretty much figured out how to do most of the coding ... except this one ... don't seem to be able to find a solution and it freaks me out ... arghhh.
Try editing index.php and look for <div class="featured-content">. Immediately after that line, you should see <?php the_excerpt();?>. Change it to:
<div class="excerpt">
<?php the_excerpt();?>
</div>Then, edit style.css and add the following to the bottom:
.excerpt {height:200px;}`
Posted 4 months ago #
On second thoughts, this is what I get now:
<div class="front-post">
<div class="featured-post">
<div class="featured-title">
</div>
<div class="featured-image">
</div>
</div>
<div class="postMeta-featured">
</div>
<div class="clear"/>
<div class="featured-content">
<p>
</p>
<p class="moretext">
<a href="http://www.commonpeople.sg/v1/?p=747">Continue Reading...</a>
</p>
</div>
</div>What happens when you (in index.php ) move the <p>moretext etc </p> piece to just before the last div ; saying take it out of divclass featured content and move it beyond the next div so that it is included in divclass front-post.
Next give in your css the class featured content a fixed height so that the longest excerpt shown fits in the box.
Posted 4 months ago #
Hum .. still don't get it to work. Looks like with Esmi's solution, I get the featured section to work. But not sure how to line up the Lastest posts.
This is my index.php. Does this help?
<?php get_header(); ?>
<div id="featured">
<h2>Featured</h2>
<!-- Edit Below -->
<?php query_posts('cat=3&showposts=2'); ?>
<?php while (have_posts()) : the_post(); ?>
<div class="front-post">
<div class="featured-post">
<div class="featured-title">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?>
</a></h2>
</div>
<div class="featured-image">
<?php image_attachment('image', 303, 231); ?>
</div>
</div> <!-- END Featured-post -->
<div class="postMeta-featured"><span class="date"><?php the_time('F j, Y') ?></span><span class="comments"><?php comments_popup_link('0', '1', '%'); ?></span></div> <div class="clear"></div>
<div class="featured-content">
<?php the_excerpt(); ?>
<p class="moretext"><a href="<?php the_permalink() ?>">Continue Reading...</a></p>
</div> <!-- END Featured-Content -->
</div>
<?php endwhile; ?>
<!-- Edit Below 2 -->
<?php query_posts('cat=3&showposts=1&offset=2'); ?>
<?php while (have_posts()) : the_post(); ?>
<div class="front-post-last"> <!-- Featured-Last -->
<div class="featured-post">
<div class="featured-title">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?>
</a></h2>
</div>
<div class="featured-image">
<?php image_attachment('image', 303, 231); ?>
</div>
</div> <!-- END Featured-post -->
<div class="postMeta-featured"><span class="date"><?php the_time('F j, Y') ?></span><span class="comments"><?php comments_popup_link('0', '1', '%'); ?></span></div> <div class="clear"></div>
<div class="featured-content">
<?php the_excerpt(); ?>
<p class="moretext"><a href="<?php the_permalink() ?>">Continue Reading...</a></p>
</div> <!-- END Featured-Content -->
</div>
<?php endwhile; ?>
</div> <!-- END Featured -->
<div class="clear"></div>
<div id="front-bottom">
<div id="latest-wrap">
<h2>Latest Posts</h2>
<div class="content">
<!-- Edit Below 3 -->
<?php query_posts('cat=-3&showposts=50'); ?>
<?php while (have_posts()) : the_post(); ?>
<div class="latest-post-wrap">
<div class="latest-post">
<div class="latest-title">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?>
</a></h2>
</div>
<div class="latest-image">
<?php image_attachment('image', 162, 118); ?>
</div>
</div>
<div class="latest-content">
<div class="postMeta-front"><span class="date"><?php the_time('F j, Y') ?></span><span class="comments"><?php comments_popup_link('0', '1', '%'); ?></span></div> <div class="clear"></div>
<p><?php
$excerpt = get_the_excerpt();
echo string_limit_words($excerpt,10);
?></p>
<p class="moretext"><a href="<?php the_permalink() ?>">Continue Reading...</a></p>
</div>
</div>
<?php endwhile; ?> <!-- END -->
</div>
<div class="clear"></div>
</div>
<?php get_sidebar(); ?>
<div class="clear"></div>
</div>
<?php get_footer(); ?>
Posted 4 months ago #
Hi micadz,
I don't see it working in Featured; the left one is still lower. And in the index.php you supplied I do not see that you applied Esmi's trick.
I still would try to change this:
<div class="featured-content">
<?php the_excerpt(); ?>
<p class="moretext"><a href="<?php the_permalink() ?>">Continue Reading...</a></p>
</div> <!-- END Featured-Content -->
</div>into this:
<div class="featured-content">
<?php the_excerpt(); ?>
</div> <!-- END Featured-Content -->
<p class="moretext"><a href="<?php the_permalink() ?>">Continue Reading...</a></p>
</div>that is putting the p class moretext below te next div
If that works you have to do the same for latest-content which controls your Latest Posts.
INSTEAD of the above:
Also in style.css doing this cleaned up featured:
.featured-content p {style.css (regel 118)
height:170px;
margin-top:1em;
}I added height 170px
Also in style.css doing this cleaned up the latest posts:
.latest-content p {style.css (regel 180)
color:#222222;
font-size:1.2em;
height:55px;
line-height:1.5;
margin-bottom:1.5em;
margin-top:8px;
text-align:left;
}I added the height of 55px
Normally I use Stylizer, but you can see all this in Firefox, by using Firebug to show and test the code (you cannot save from firebug so the changes are temporarily and only visible on your computer, not for the public unless you copy them into your style.css)
Have a go and try it.
Posted 3 months ago #
Thanks for the info. Tried all suggested options but failed miserably ... not sure why it works for you and not for me. Arghhh
Posted 3 months ago #
it is looking good now Micadz!
You must log in to post.
