Support » Fixing WordPress » Add images outside of main content area in template…

  • This seems like it should be a simple thing, but I’m having the hardest time figuring it out. What I’m trying to do is convert an existing web site into a WordPress as a CMS site, to allow the site owner to make updates to the content of his pages, as well as add portfolio pages. There are currently around 20 portfolio pages that I’ve created a template for (utilizing the NextGEN gallery plugin). I would like to find a way for the site owner to be able to modify the text of his 5 “main” content pages, and while editing those pages, be able to pick 3 images from any of his galleries to appear on those pages. The problem is my main page templates have those images sitting outside of the “main” content area.

    Example code:

    Template Name: KL Front Page
    <?php get_header(); ?>
                    <div id="Logo"><a href=""><img src="<?php bloginfo('template_directory'); ?>/images/KLlogo.jpg" width="300" height="255" alt="Images, Inc." border="none"></a></div>
                    <div id="Description"></div>
                <div id="Title"></div>
                <div id="Content">
                    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
                        <article class="post" id="post-<?php the_ID(); ?>">
                        <div class="entry">
            				<?php the_content(); ?>
                	<?php endwhile; endif; ?>
            <div class="Row">
                <div class="FrontPF"><a href="pf/portfolio3-1.html"><img src="<?php bloginfo('template_directory'); ?>/images/KLIndexImage1.jpg" /></a></div>
                <div class="FrontPF"><a href="pf/portfolio1-1.html"><img src="<?php bloginfo('template_directory'); ?>/images/KLIndexImage2.jpg" /></a></div>
                <div class="FrontPF"><a href="pf/portfolio2-5.html"><img src="<?php bloginfo('template_directory'); ?>/images/KLIndexImage3.jpg" /></a></div>
    <?php get_footer(); ?>

    For layout purposes, the “loop” exists in the main content area, but the images will appear in a separate layer below the main content area.

    It seems like there should be an easy solution to this, but I’m in code hell at the moment and just can’t seem to find it. I’m familiar with PHP, HTML and Javascript, but new to WordPress, and really trying to do this in WordPress because I think the client will like the interface. Can someone please point me in the right direction. I’ve looked at having the images appear in a sidebar, but if I go that route, how do I then allow the user to choose the images when modifying the content of the page?

    Any help would be appreciated.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Can you assemble the image code inside the loop, storing it in a string variable, and then echo it out after the end of the loop?

    I thought about that, but the problem then becomes how to get the image info into the loop without embedding it into the “content”. In the post.php and post-new.php, I need to find a way for the client to select any 3 images from one of their NextGEN galleries, and then pass that information (including a link to each image’s gallery page) to the loop in the template file. The problem is I don’t want the images embedded in the content, just passed along with it, kind of like extra metadata or something.

    Could you have the client insert the images into the post and use a filter on the_content to remove them?

    That way they would be attached to the post and you could retrieve them as attachments.

    That might work, but how do I filter? Should I write a custom RegEx? Is there a plugin or something built in that would make that easier?

    Just curious if this could work or not. Is there an easy way to add functionality to the post.php and post-new.php to select the 3 images visually using something like the Featured Image functionality, and then just pass the Image ID’s or something uniquely identifying as metadata to the loop so I can write some custom php that will read the metadata, go find the images by their ID, create the link to their gallery pages, and assemble the HTML to display them into a variable to be echo’d outside the loop?

    I think I can handle 90-95% of that easily enough by myself, the only question would be how to get the visual “image selector” into the post.php and post-new.php and then assign the Image ID or something to a metadata variable to be passed to the loop.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Add images outside of main content area in template…’ is closed to new replies.