ThemeShaper Forums » Thematic

[closed]

Listing articles from more than one category

(10 posts)
  • Started 4 years ago by lqunta
  • Latest reply from lqunta
  • This topic is not resolved
  1. lqunta
    Member

    Greetings Guys,

    Probably, this may have been asked before...pardon me for this. I'm trying to list articles in my home page as follows:

    - Articles from 6 different categories separated into columns [ see code below ]
    - Have the Category Title, Category Thumbnail, and Category Description appear at the top
    - Have the Post Title, Post Thumbnail, and Post Excerpt appear


    <!-- begin content container -->
    <div class="secondary pngfix">

    <!-- clearing div -->
    <div class="clear"></div>

    <!-- 1st column -->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title One</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  2. <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  3. <!-- end 1st item -->
    <!-- 2nd item -->

  4. <h4>Second Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb2.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - In aeque partem sensibus ius, quaeque voluptaria dissentiunt ei pro. Clita viderer appellantur his te.
    </p>
  5. <!-- end 2nd item -->
    <!-- 3rd item -->

  6. <h4>Third Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb3.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Ei etiam nostrud eam, brute facilisis voluptatibus mel cu, eam cu diceret definitionem conclusionemque.
    </p>
  7. <!-- end 3rd item -->
    <!-- end image list -->
    </div><!-- end begin spacing/icon div -->
    </div><!-- end 1st column -->

    <!-- 2nd column -->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Two</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  8. <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  9. <!-- end 1st item -->
    <!-- 2nd item -->

  10. <h4>Second Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb2.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - In aeque partem sensibus ius, quaeque voluptaria dissentiunt ei pro. Clita viderer appellantur his te.
    </p>
  11. <!-- end 2nd item -->
    <!-- 3rd item -->

  12. <h4>Third Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb3.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Ei etiam nostrud eam, brute facilisis voluptatibus mel cu, eam cu diceret definitionem conclusionemque.
    </p>
  13. <!-- end 3rd item -->
    <!-- end image list -->
    </div><!-- end spacing/icon div -->
    </div><!-- end 2nd column -->

    <!-- 3rd column-->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Three</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  14. <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  15. <!-- end 1st item -->
    <!-- 2nd item -->

  16. <h4>Second Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb2.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - In aeque partem sensibus ius, quaeque voluptaria dissentiunt ei pro. Clita viderer appellantur his te.
    </p>
  17. <!-- end 2nd item -->
    <!-- 3rd item -->

  18. <h4>Third Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb3.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Ei etiam nostrud eam, brute facilisis voluptatibus mel cu, eam cu diceret definitionem conclusionemque.
    </p>
  19. <!-- end 3rd item -->
    <!-- end image list -->
    </div><!-- end spacing/icon div -->
    </div><!-- end 3rd column -->

    <!-- clearing div -->
    <div class="clear"></div>

    <!-- 1st column -->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Four</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  20. <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  21. <!-- end 1st item -->
    <!-- 2nd item -->

  22. <h4>Second Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb2.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - In aeque partem sensibus ius, quaeque voluptaria dissentiunt ei pro. Clita viderer appellantur his te.
    </p>
  23. <!-- end 2nd item -->
    <!-- 3rd item -->

  24. <h4>Third Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb3.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Ei etiam nostrud eam, brute facilisis voluptatibus mel cu, eam cu diceret definitionem conclusionemque.
    </p>
  25. <!-- end 3rd item -->
    <!-- end image list -->
    </div><!-- end begin spacing/icon div -->
    </div><!-- end 1st column -->

    <!-- 2nd column -->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Five</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  26. <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  27. <!-- end 1st item -->
    <!-- 2nd item -->

  28. <h4>Second Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb2.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - In aeque partem sensibus ius, quaeque voluptaria dissentiunt ei pro. Clita viderer appellantur his te.
    </p>
  29. <!-- end 2nd item -->
    <!-- 3rd item -->

  30. <h4>Third Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb3.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Ei etiam nostrud eam, brute facilisis voluptatibus mel cu, eam cu diceret definitionem conclusionemque.
    </p>
  31. <!-- end 3rd item -->
    <!-- end image list -->
    </div><!-- end spacing/icon div -->
    </div><!-- end 2nd column -->

    <!-- 3rd column-->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Six</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  32. <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  33. <!-- end 1st item -->
    <!-- 2nd item -->

  34. <h4>Second Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb2.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - In aeque partem sensibus ius, quaeque voluptaria dissentiunt ei pro. Clita viderer appellantur his te.
    </p>
  35. <!-- end 2nd item -->
    <!-- 3rd item -->

  36. <h4>Third Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb3.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Ei etiam nostrud eam, brute facilisis voluptatibus mel cu, eam cu diceret definitionem conclusionemque.
    </p>
  37. <!-- end 3rd item -->
    <!-- end image list -->
    </div><!-- end spacing/icon div -->
    </div><!-- end 3rd column -->

    <!-- clearing div -->
    <div class="clear"></div>

    </div><!-- end content container -->

    Will such a format necesitate the use of a custom page template for the home page? Been trying to achieve this for a couple of hours now, stuck, and lost in the mud - help, please...

Posted 4 years ago #
  • Chris
    Moderator

    Hi,

    I would suggest do create a custom frontpage template. This would be much easier to handle.

    I'm using something similar on http://thematic4you.com

    You can't use this code on your site. Especially the aggregator code is something very special for WPMU, but it should give you an idea how the concept works.

    frontpage.php:

    <?php
    /*
    Template Name: Front Page
    .
    Something special for thematic4you.com
    .
    */
        // calling the header.php
        get_header();
    
        // action hook for placing content above #container
        thematic_abovecontainer();
    
    ?>
    
    	<div id="front-content">
    
    		<div class="block block1">
    
    			<h2><em>Programming</em> Thematic 4 You</h2>
    
    			<?php 
    
    			if (function_exists(wp_mu_aggregator))
    			{
    				 wp_mu_aggregator(5,1);
    			}
    
                ?>
    		</div><!-- block block1 -->
    
    		<div class="block block2">
    
    			<h2><em>Developing</em> Thematic 4 You</h2>
    
    			<?php 
    
    			if (function_exists(wp_mu_aggregator))
    			{
    				 wp_mu_aggregator(7,2);
    			}
    
                ?>
    		</div><!-- block block2 -->
    
    		<div class="block block3">
    
    			<h2><em>Coming</em> soon</h2>
    
    			<h3>Stay Tuned</h3>
    			<div class="entry">We will provide tutorials, Professional Services, inspirations and more.</div>
    		</div><!-- block block3 -->
    
    	</div><!-- #front-content -->
    
    <?php 
    
        // action hook for placing content below #container
        thematic_belowcontainer();
    
        // calling footer.php
        get_footer();
    
    ?>

    And this is the aggregator code:

    function wp_mu_aggregator($blog_id, $row) {
    	global $wpdb;
    	$counter = 0;
    
    	// we need _posts and _options tables for this to work
    
    	$blogPostsTable = "wp_".$blog_id."_posts";
    
    	// we fetch the title and link for the latest post
    	// will only return posts from the last 30 days
    	$thispost = $wpdb->get_results("SELECT ID, post_title, guid, post_name, post_excerpt
    				FROM $blogPostsTable WHERE post_status = 'publish'
    				AND post_type = 'post'
    				ORDER BY id DESC");
    
    	// if it is found put it to the output
    	if($thispost) {
    
    		for ($counter = 0; $counter < 8; $counter++) {
    
    			//create permalink for the blog post
    			$permalink=get_blog_permalink($blog_id, $thispost[$counter]->ID);
    
    			//if permalink exists use it, if not use ID
    			If($permalink) {
    				$URI=$permalink;
    			}Else{
    				$URI=$thispost[$counter]->guid;
    			}
    
    			if ($counter < 2) { ?>
    
    				<div class="entry">
    
    					<?php
    
    					//display post title
    					echo '<h3><a href="'.$URI.'">'.$thispost[$counter]->post_title.'</a></h3>';
    
    					//display post content
    					echo $thispost[$counter]->post_excerpt.' [&hellip;]<br />';
    					echo '<div class="more-link"><a rel="bookmark nofollow" href="'.$URI.'">Keep Reading &raquo;</a></div>';
    
    					?>
    
    				</div>
    
    				<?php
    
    			}
    
    			if (($counter == 2) AND ($row ==1)) { ?>
    
    				<h2>More <em>Programming</em> Thematic 4 You</h2>
    
    				<ul>
    
    				<?php
    			}
    
    			if (($counter == 2) AND ($row ==2)) { ?>
    
    				<h2>More <em>Developing</em> Thematic 4 You</h2>
    
    				<ul>
    
    				<?php
    			}
    
    			if ($counter > 1)  {
    				if (isset($thispost[$counter]->post_title)) {
    					echo '<li><a href="'.$URI.'">'.$thispost[$counter]->post_title.'</a></li>';
    				}
    			}
    
    		}
    
    		echo '</ul>';
    
    	}
    
    }

    Chris

    Posted 4 years ago #
  • lqunta
    Member

    Hey Chris,

    You're a lifesaver...just as I was about to give up [ cofee doesn't seem to help at this point - I confess, I'm getting desperate ]. Going thru your code above to see whether it works.

    @Chris [edit]
    Gone thru the code and viewed the site example. That is the closest to what I'm looking at implementing. On http://thematic4you.com/ you have the 3 column structure that I'm eagerly trying to use. I've also taken note that you have 3 categories on the same page, split into the three columns [ very identical to what I had in mind - very nice! ]. However, is it possible to:
    - List the Category Title [ I have format this in HTML + CSS - look at the code posted above, I've copy-pasted it from my HTML layout ], some category description [ at this point, I won't mind if I have to 'hard-code' the category thumbnail and category description in order to achieve my envisioned layout ].
    - Have the Post Title, Post Thumbnail and Post Excerpt from the same category listed immediately after [ would you mind simplifying your code - pardon me, I'm rather limited in PHP/ Thematic [ the lingo is almost like french to me, tho I'm tring to survive :D ], I'll greatly appreciate this ].

    Yet again, you have my pat on the back for renewing my hope.

    Cheers
    LQunta

    Posted 4 years ago #
  • Chris
    Moderator

    The aggregator code won't work. I'm fetching the latest posts from 2 different blogs. You need one 'loop' for each category. That means .. each wp_mu_aggregator() call in my frontpage template would be one 'loop' in your template.

    Posted 4 years ago #
  • lqunta
    Member

    @ Chris

    Pardon my 'green' nature, when you say "each wp_mu_aggregator() call in my frontpage template would be one 'loop' in your template", do you mean that on each 'column' in my layout, I should call the wp_mu_aggregator() function?

    How can I implement this on my home page? as I said earlier, I already have my HTML structure [ I've done the site 'template' in HTML, now trying to 'port' it to Thematic, just don't know how to exactly do it ]

    Should I copy the wp_mu_aggregator() function to my functions.php file?

    Looking at your page example, what are the numbers next to the wp_mu_aggregator function? are these category Id's?


    <div class="block block2">

    <h2>Developing Thematic 4 You</h2>

    <?php

    if (function_exists(wp_mu_aggregator))
    {
    wp_mu_aggregator(7,2);
    }

    Please exercise a little bit more patience with me - all this is just all too confusing - I'm trying to catch up as quick as I can. FYI my coding 'prowess' is just best at HTML + CSS.

    [ a simple explanation will get me moving at rocket speed :P ]

    Posted 4 years ago #
  • Chris
    Moderator

    No .. forget about the wp_mu_aggregator().

    I'll be back in about 30 minutes with an example.

    Posted 4 years ago #
  • Chris
    Moderator

    Ok .. back again .. I took my frontpage and put some loops in:

    <?php
    /*
    Template Name: Front Page
    .
    Take a look at the functions.php for this theme to see how the random content is included.
    .
    */
        // calling the header.php
        get_header();
    
        // action hook for placing content above #container
        thematic_abovecontainer();
    
    ?>
    
    	<div id="front-content">
    
    		<div class="block block1">
    
    			<h2><em>Programming</em> Thematic 4 You</h2>
    
    			<?php
    
    			// you need to change cat=1 and posts_per_page=5 according to your needs
    			query_posts( $query_string . '&cat=1&posts_per_page=5' );
    
    			while ( have_posts() ) : the_post();
    
    				thematic_abovepost(); ?>
    
    				<div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?>">
    					<?php thematic_postheader(); ?>
    					<div class="entry-content">
    						<?php the_excerpt(); ?>
    					</div>
    					<?php thematic_postfooter(); ?>
    				</div><!-- .post -->
    
    				<?php 
    
    				thematic_belowpost();
    
    			endwhile;
    
                ?>
    		</div><!-- block block1 -->
    
    		<div class="block block2">
    
    			<h2><em>Developing</em> Thematic 4 You</h2>
    
    			<?php
    
    			// you need to change cat=2 and posts_per_page=5 according to your needs
    			query_posts( $query_string . '&cat=2&posts_per_page=5' );
    
    			while ( have_posts() ) : the_post();
    
    				thematic_abovepost(); ?>
    
    				<div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?>">
    					<?php thematic_postheader(); ?>
    					<div class="entry-content">
    						<?php the_excerpt(); ?>
    					</div>
    					<?php thematic_postfooter(); ?>
    				</div><!-- .post -->
    
    				<?php 
    
    				thematic_belowpost();
    
    			endwhile;
    
                ?>
    		</div><!-- block block2 -->
    
    		<div class="block block3">
    
    			<h2><em>Coming</em> soon</h2>
    
    			<h3>Stay Tuned</h3>
    			<div class="entry">We will provide tutorials, Professional Services, inspirations and more.</div>
    		</div><!-- block block3 -->
    
    	</div><!-- #front-content -->
    
    <?php 
    
        // action hook for placing content below #container
        thematic_belowcontainer();
    
        // calling footer.php
        get_footer();
    
    ?>

    This is untested code, which should give you 5 posts from category 1 in the first column and 5 posts from category 2 in the second column.

    To keep the post titles in line, you would need more code. I should find some free time over the weekend to rewrite the wp_mu_aggregator into something that can be used on a regular WP installation.

    Posted 4 years ago #
  • lqunta
    Member

    Thanks Chris,

    Trying this out. Will post back progress in 30 min.

    Just quick question - with my 'custom' layout, will I have to filter out the Main div...will I have to filter out the sidebar and use the full page width...or do I use a custom home page?

    How do I get this to work for the 'home' page only [i.e. the first page that a user would get on when he/she visits the site]? So far, I have the following code in my HTML - please correct me if I'm wrong.


    <!-- 1st column -->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title One</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <?php

    // Change this, and input the Category ID that corresponds above cat=6 and posts_per_page=3 according to your needs
    query_posts( $query_string . '&cat=6&posts_per_page=3' );

    while ( have_posts() ) : the_post();

    thematic_abovepost(); ?>

    <div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?>">
    <?php thematic_postheader(); ?>
    <div class="entry-content">
    <?php the_excerpt(); ?>
    </div>
    <?php thematic_postfooter(); ?>
    </div><!-- .post -->

    <?php

    thematic_belowpost();

    endwhile;

    ?>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  • <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  • <!-- end 1st item -->

    <!-- end image list -->
    </div><!-- end begin spacing/icon div -->
    </div><!-- end 1st column -->

    <!-- 2nd column -->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Two</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <?php

    // Change this, and input the Category ID that corresponds above cat=8 and posts_per_page=3 according to your needs
    query_posts( $query_string . '&cat=8&posts_per_page=3' );

    while ( have_posts() ) : the_post();

    thematic_abovepost(); ?>

    <div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?>">
    <?php thematic_postheader(); ?>
    <div class="entry-content">
    <?php the_excerpt(); ?>
    </div>
    <?php thematic_postfooter(); ?>
    </div><!-- .post -->

    <?php

    thematic_belowpost();

    endwhile;

    ?>

    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  • <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  • <!-- end 1st item -->

    <!-- end image list -->
    </div><!-- end spacing/icon div -->
    </div><!-- end 2nd column -->

    <!-- 3rd column-->
    <div class="grid_8">
    <!-- begin spacing/icon div -->
    <div class="icon pngfix">
    <h2>Category Title Three</h2>
    <p>
    <img class="frame" src="style/img/stock-image.jpg" alt="Category Image" />
    Category Description - Sint porro tantas nam ad, an eius nihil has. Aperiri expetenda conclusionemque in duo, no cum sumo possim debitis, no quo ferri menandri.

    <img src="style/img/btn-read-more.png" alt="read articles in this category..." />

    </p>

    <?php

    // Change this, and input the Category ID that corresponds above cat=3 and posts_per_page=3 according to your needs
    query_posts( $query_string . '&cat=3&posts_per_page=3' );

    while ( have_posts() ) : the_post();

    thematic_abovepost(); ?>

    <div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?>">
    <?php thematic_postheader(); ?>
    <div class="entry-content">
    <?php the_excerpt(); ?>
    </div>
    <?php thematic_postfooter(); ?>
    </div><!-- .post -->

    <?php

    thematic_belowpost();

    endwhile;

    ?>
    <!-- begin image list -->
    <ul class="imglist">
    <!-- 1st item -->

  • <h4>Most Recent Article Title</h4>
    <p>
    <img src="style/img/stock-thumb1.jpg" alt="Post Image Thumbnail - Aligned Left" />
    Post Excerpt - Duo latine verterem delicatissimi eu, quo ad eros malis disputando, pri unum adipisci inciderint an.
    </p>
  • <!-- end 1st item -->

    <!-- end image list -->
    </div><!-- end spacing/icon div -->
    </div><!-- end 3rd column -->

    I'm learning by leaps and bounds here, wish my head were 'fresh' [ tired, sleepy, but, don't wanna move from the PC :) ]

    Rgds
    LQunta

    Posted 4 years ago #
  • Chris
    Moderator

    You create a custom template, like I did. This template file .. call it frontpage.php .. needs to be copied into your child theme's directory.

    Create a page(!), call it 'Home', no content, switch Templates to 'Front Page', and save this page.

    Create a page(!), call it 'Blog', no content.

    Go to Settings / Reading, change Front page displays to 'A static page', switch 'Front page' to 'Home' and Posts Page to 'Blog'.

    That's it.

    The template that I use has the sidebars removed.

    You should add:

    .home #container {
     width: 960px;
    }
    
    .home #content {
     width: 940px;
    }

    to your CSS to get the full width for your front page.

    Posted 4 years ago #
  • lqunta
    Member

    Hi Chris

    No joy still. Still not getting any output [ even my layout isn't showing ], just getting blank white page [no output from the above code, even if I try using it with a working theme such as Street - by Cristi Antohe ].

    I'm beat for now [bn trying to make heads or tails for 20+ hrs] - resting for a few hours then will try again in 3-4 hrs.

    Rgds
    LQunta

    Posted 4 years ago #

  • RSS feed for this topic

    Topic Closed

    This topic has been closed to new replies.