Here's what i'm trying to achieve,

alt text

Basically in the left block (the one w/ red boxes) is a product gallery block where it should spit thumbnails of products (the red boxes). the thumbnail is a "custom field" of a product page, the name of the custom field is "gal_thumb" and is link to it's page.

At the right side (the one w/ blue box and some text) is a Services Block. It list down some services offered together with it's thumbnail. the thumbnail is also a custom field called "serv_thumb". At the side of the thumb is a title of the service, and a excerpt of the page. with a read more link.

I had tried implementing it using snippet available on the web, but can't seem to make it work. In the services block, I only made 1 service to show and it spits all the text (lolz). There is a 'Service Page' which is a parent of 'service 1', 'service 2' and 'service 3' I also haven't touch the custom field yet(no idea how to implement)

Please help me

Thanks!

2 answers

0
points

As detailed as the questions is, I'm afraid it's too vague to be able to answer!

I suspect you might be better asking this at stackoverflow.com as it sounds like a programming question, but you'll have to explain what programming language you're using and if possible give code examples of what you've managed to achieve so far.

Answered about 6 years ago by John Catterfeld
davidg 0
0
points

custom fields have to be placed within The Loop. it looks like you may have to have two different loops on the page.

The Loop In Action

Custom Fields

The Excerpt

Ill try my best here to give you an example...

your index.php:

<?php get_header() ?>
<div id="wrap"> <!-- loop wrapper -->
    <div id="redcolumn">
        <?php if (have_posts()) : ?> <!-- loop starts here -->
        <?php while (have_posts()) : the_post(); ?>

        <div class="productGrid">
            <div class="galThumb">
            <?php if ( get_post_meta($post->ID, 'gal_thumb', true) ) : ?> <!--begin retrieving custom field 'gal_thumb'-->
                <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">
            <?php echo get_post_meta($post->ID, 'gal_thumb', true) ?>
                </a>
            <?php endif; ?> <!-- end of gal_thumb retrieval -->
            </div><!-- /.galThumb -->

        <?php endwhile; ?>
        <?php else : ?>
        <h2 class="center">Not Found</h2>
        <p class="center">
        <?php _e("Sorry, but you are looking for something that isn't here."); ?></p>        
        <?php endif; ?> <!-- loop ends here -->

        </div><!-- /.productGrid -->
    </div><!-- /#redcolumn -->
    <?php get_sidebar() ?> <!-- this will call your second loop below! -->
</div><!-- /#wrap -->
<?php get_footer() ?>

Alright, so that's your index.php file. Let's see what your sidebar.php file might look like...

<div id="sidebar">
    <?php query_posts ($query_string . '&cat=n'); ?> <!-- n=category id number for services, must precede the loop -->
    <?php if (have_posts()) : ?> <!-- start of services loop -->
    <?php while (have_posts()) : the_post(); ?>

        <div class="serviceGrid">
            <div class="servThumb"><!-- your thumb -->
                <?php if ( get_post_meta($post->ID, 'serv_thumb', true) ) : ?>
                <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">
                <?php echo get_post_meta($post->ID, 'serv_thumb', true) ?>
                </a>
                <?php endif; ?>
            </div><!-- /.servThumb -->

            <div class="postExcerpt">
                <h2 id="post-<?php the_ID(); ?>">
                <a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a><!-- service title -->
                </h2>
                <?php the_excerpt(); ?> <!-- excerpt content, can be controlled with <more> tag in post editor, default 50 chars i think -->
            </div><!-- /.postExcerpt -->

            <div class="moreLink"> <!-- read more link -->
                <a href="<?php the_permalink() ?>">Read More</a>
            </div><!-- /.moreLink -->

        </div><!-- /.serviceGrid -->

            <?php endwhile; ?>
            <?php else : ?>

            <h2 class="center">Not Found</h2>
            <p class="center">
            <?php _e("Sorry, but you are looking for something that isn't here."); ?>
            </p>

    <?php endif; ?><!-- loop end -->
</div><!-- /#sidebar -->

and with plenty of styling you can get it looking the way you would like.

my website coolthanks uses your 'services' loop almost exactly the way you described it. hope this helps!

Edit: added <?php query_posts ($query_string . '&cat=n'); ?> to filter posts in services sidebar.

Answered about 6 years ago by davidg
  • ah, forgot that you might need to do some category filtering on the services sidebar. davidg about 6 years ago
  • any help? no help? davidg about 6 years ago