New CSS style rules for excerpts – not displaying

  • Resolved rc169

    (@rc169)


    14 years, 5 months ago

    I am using WP 3.0.1 and am modifying the twentyten theme.

    The client wants the post extracts on the relevant category pages to feature a thumbnail image at the left hand side; with post title, brief extract from the text, followed by ‘read more…’; then a button with a link to the relevant page on his other website – all to the right of the thumbnail.

    I have installed the ‘regenerate thumbnails’, ‘advanced excerpt’ and ‘superslider-excerpt’ plugins, and these seem to be working satisfactorily to generate a thumbnail, using a custom field on the post. So far, so good.

    For the content of the excerpt, I have used some div tags with classes, and have added styles for these classes in style.css – but the browser (Firefox) is simply ignoring them! I am developing in Dreamweaver CS3, using a copy of the HTML source of the relevant page from the blog (according to the method described here:-

    https://www.adobe.com/devnet/dreamweaver/articles/creating_wordpress_theme_with_dreamweaver_pt1.html )

    Even in Dreamweaver, the changes don’t take effect.

    Some styles have been included inline by the client for the post, and I have copied these for the extract for the time being. The code I have added for the excerpt is as follows:-

    <div class="cat_prod_right">
<div class="cat_prod_para">
<p><strong>Product name </strong>product brief description goes here</p>
</div>
<div class="cat_prod_prices">
<h2><strong><span style="text-decoration: line-through;">RRP: ￡16.99</span><span style="font-family: Arial, Helvetica, sans-serif; font-size: 22px; color: #d9262c; margin: 0; text-decoration: none;"> Our Price: ￡13.50</span></strong></h2>
</div>
<div class="cat_prod_buy">
<a href="https://my-domain/gbu0-prodshow/product-name.html"><img title="buy-button" src="https://www.my-domain.co.uk/wp-content/uploads/2010/09/buy-button.gif" border="0" alt="Buy From Our Shop" width="293" height="34" /></a>
</div>
</div>
<br class="clearfloat" />

    Presumably I am missing something to make this work, but searching on the forum has not revealed anything. Can anyone advise?

    Thanks in advance, Nigel

Viewing 5 replies - 1 through 5 (of 5 total)

  • Some styles have been included inline by the client for the post

    inline styles in the post will most likely get stripped by ‘the_excerpt’ function.

    without seeing the result or even the new styles in style.css, no one will be able to give you any purposeful advice.

    Thread Starter rc169

    (@rc169)

    Thanks.

    The CSS is as follows:-

    .cat_prod_right {
	float: left;
	width: 400px;
	padding-left: 10px;
}

img.excerpt_thumb {
	float: left;
	width: 150px;
}

.clearfloat {
	clear: both;
}

    As I am developing on a local machine, I cannot provide a working URL. If there is a way of showing a screenshot, then I can provide that. However, the principal issue is that the ‘description’ part of the excerpt (i.e. within the cat_prod_right div tags) is appearing under the thumbnail, not to the right of it.

    The inline styles are working fine.

    Thanks, Nigel

    Thread Starter rc169

    (@rc169)

    Alchymyth, it looks as if your answer on this thread

    https://www.ads-software.com/support/topic/change-the-font-size-in-twentyten

    regarding the lines of media print styles in style.css is the clue to the problem. Before the media print styles, there are also styles for mobile Safari, iPods etc, so I have moved my additional styles before those – around line 1240 – and they seem to be taking effect now. So thanks for that!

    Nigel

    that is great ??

    because I was actually wrong with my comment –
    the print styles are closed properly in style.css of Twenty Ten, and styles added after would normally take effect.

    Thread Starter rc169

    (@rc169)

    It looks as if I had inadvertently removed the closing “}” from the CSS file. I have now unzipped the download file again, and the untouched version is correct.

    I can also add new styles in Dreamweaver at the end of the file, and they are now working fine.

    Nigel

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘New CSS style rules for excerpts – not displaying’ is closed to new replies.